diff --git a/site/.eslintrc.yaml b/site/.eslintrc.yaml index 9c60bca004266..58bb2490505b5 100644 --- a/site/.eslintrc.yaml +++ b/site/.eslintrc.yaml @@ -30,7 +30,6 @@ plugins: - import - react-hooks - jest - - no-storage - unicorn root: true rules: @@ -98,7 +97,6 @@ rules: message: "Use path imports to avoid pulling in unused modules. See: https://material-ui.com/guides/minimizing-bundle-size/" - no-storage/no-browser-storage: error no-unused-vars: "off" "object-curly-spacing": "off" react-hooks/exhaustive-deps: warn diff --git a/site/package.json b/site/package.json index dc9457a0da627..8f5b044f1c3f4 100644 --- a/site/package.json +++ b/site/package.json @@ -111,7 +111,6 @@ "eslint-plugin-import": "2.26.0", "eslint-plugin-jest": "27.0.1", "eslint-plugin-jsx-a11y": "6.6.1", - "eslint-plugin-no-storage": "1.0.2", "eslint-plugin-react": "7.31.1", "eslint-plugin-react-hooks": "4.6.0", "eslint-plugin-unicorn": "44.0.0", diff --git a/site/src/components/AuthAndFrame/AuthAndFrame.test.tsx b/site/src/components/AuthAndFrame/AuthAndFrame.test.tsx new file mode 100644 index 0000000000000..2ea19161659d0 --- /dev/null +++ b/site/src/components/AuthAndFrame/AuthAndFrame.test.tsx @@ -0,0 +1,25 @@ +import { fireEvent, screen } from "@testing-library/react" +import { renderWithAuth } from "testHelpers/renderHelpers" +import { AccountPage } from "pages/UserSettingsPage/AccountPage/AccountPage" +import i18next from "i18next" + +const { t } = i18next + +describe("AuthAndFrame", () => { + it("sets localStorage key-value when dismissed", async () => { + const localStorageMock = { + ...global.localStorage, + getItem: jest.fn(), + } + global.localStorage = localStorageMock + + // rendering a random page that is wrapped in AuthAndFrame + return renderWithAuth() + fireEvent.click( + screen.getByRole("button", { + name: t("ctas.dismissCta", { ns: "common" }), + }), + ) + expect(localStorageMock.getItem).toHaveBeenCalledWith("dismissedVersion") + }) +}) diff --git a/site/src/xServices/updateCheck/updateCheckXService.ts b/site/src/xServices/updateCheck/updateCheckXService.ts index ef5ca67eabaf8..dddce422a41df 100644 --- a/site/src/xServices/updateCheck/updateCheckXService.ts +++ b/site/src/xServices/updateCheck/updateCheckXService.ts @@ -117,7 +117,7 @@ export const updateCheckMachine = createMachine( dismissOrClear: { on: { DISMISS: { - actions: ["assignHide"], + actions: ["assignHide", "setDismissedVersion"], target: "dismissed", }, CLEAR: { @@ -141,9 +141,11 @@ export const updateCheckMachine = createMachine( assignPermissions: assign({ permissions: (_, event) => event.data as Permissions, }), - assignShow: assign({ - show: true, - }), + assignShow: assign((context) => ({ + show: + localStorage.getItem("dismissedVersion") !== + context.updateCheck?.version, + })), assignHide: assign({ show: false, }), @@ -161,6 +163,12 @@ export const updateCheckMachine = createMachine( ...context, error: undefined, })), + setDismissedVersion: (context) => { + if (context.updateCheck?.version) { + // We use localStorage to ensure users who have dismissed the UpdateCheckBanner are not plagued by its reappearance on page reload + localStorage.setItem("dismissedVersion", context.updateCheck.version) + } + }, }, guards: { canViewUpdateCheck: (context) => diff --git a/site/yarn.lock b/site/yarn.lock index f12e781f26c37..0b7a6eac63b51 100644 --- a/site/yarn.lock +++ b/site/yarn.lock @@ -6550,11 +6550,6 @@ eslint-plugin-jsx-a11y@6.6.1: minimatch "^3.1.2" semver "^6.3.0" -eslint-plugin-no-storage@1.0.2: - version "1.0.2" - resolved "https://registry.yarnpkg.com/eslint-plugin-no-storage/-/eslint-plugin-no-storage-1.0.2.tgz#b32b2f00c4084f8e70c6c4ea79704ffe28b6caad" - integrity sha512-INY2pA4ynTsPIb7wP6+j1QEzDx+zVZ1rZsQkC3up+TQLXsVGg3AnYSqDv/LlwR1QPfh4fDEgQ2Hg5Zxk2XxxEw== - eslint-plugin-react-hooks@4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz#4c3e697ad95b77e93f8646aaa1630c1ba607edd3"