fixes for personal server app notification (#3227) (#3230)

* fixes for personal server app notification (#3227)

* fix test

webapp/src/components/messages/__snapshots__/cloudMessage.test.tsx.snap

@@ -36,4 +36,38 @@ exports[`components/messages/CloudMessage not plugin mode, show message, close m
 </div>
 `;
 
+exports[`components/messages/CloudMessage not plugin mode, single user, close message 1`] = `
+<div>
+  <div
+    class="CloudMessage"
+  >
+    <div
+      class="banner"
+    >
+      <i
+        class="CompassIcon icon-information-outline CompassIcon"
+      />
+      Get your own free cloud server.
+      <button
+        title="Learn more"
+        type="button"
+      >
+        <span>
+          Learn more
+        </span>
+      </button>
+    </div>
+    <button
+      aria-label="Close dialog"
+      title="Close dialog"
+      type="button"
+    >
+      <i
+        class="CompassIcon icon-close CloseIcon"
+      />
+    </button>
+  </div>
+</div>
+`;
+
 exports[`components/messages/CloudMessage plugin mode, no display 1`] = `<div />`;

webapp/src/components/messages/cloudMessage.test.tsx

@@ -18,6 +18,8 @@ import {wrapIntl} from '../../testUtils'
 
 import client from '../../octoClient'
 
+import {UserSettings} from '../../userSettings'
+
 import CloudMessage from './cloudMessage'
 
 jest.mock('../../utils')
@@ -127,4 +129,41 @@ describe('components/messages/CloudMessage', () => {
             },
         })
     })
+
+    test('not plugin mode, single user, close message', () => {
+        const me: IUser = {
+            id: 'single-user',
+            username: 'single-user',
+            email: 'single-user',
+            props: {},
+            create_at: 0,
+            update_at: Date.now() - (1000 * 60 * 60 * 24), //24 hours,
+            is_bot: false,
+        }
+        const state = {
+            users: {
+                me,
+            },
+        }
+        const store = mockStore(state)
+        const hideCloudMessageSpy = jest.spyOn(UserSettings, 'hideCloudMessage', 'set')
+
+        mockedUtils.isFocalboardPlugin.mockReturnValue(false)
+
+        const component = wrapIntl(
+            <ReduxProvider store={store}>
+                <CloudMessage/>
+            </ReduxProvider>,
+        )
+
+        const {container} = render(component)
+        expect(container).toMatchSnapshot()
+
+        const buttonElement = screen.getByRole('button', {name: 'Close dialog'})
+        userEvent.click(buttonElement)
+
+        expect(mockedOctoClient.patchUserConfig).toBeCalledTimes(0)
+        expect(hideCloudMessageSpy).toHaveBeenCalledWith(true)
+        expect(UserSettings.hideCloudMessage).toBe(true)
+    })
 })

webapp/src/components/messages/cloudMessage.tsx

@@ -14,6 +14,7 @@ import {useAppSelector, useAppDispatch} from '../../store/hooks'
 import octoClient from '../../octoClient'
 import {IUser, UserConfigPatch} from '../../user'
 import {getMe, patchProps, getCloudMessageCanceled} from '../../store/users'
+import {UserSettings} from '../../userSettings'
 
 import CompassIcon from '../../widgets/icons/compassIcon'
 import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../../telemetry/telemetryClient'
@@ -35,6 +36,11 @@ const CloudMessage = React.memo(() => {
 
     const onClose = async () => {
         if (me) {
+            if (me.id === 'single-user') {
+                UserSettings.hideCloudMessage = true
+                dispatch(patchProps({focalboard_cloudMessageCanceled: 'true'}))
+                return
+            }
             const patch: UserConfigPatch = {
                 updatedFields: {
                     focalboard_cloudMessageCanceled: 'true',

webapp/src/store/users.ts

@@ -12,6 +12,7 @@ import {Subscription} from '../wsclient'
 
 // TODO: change this whene the initial load is complete
 // import {initialLoad} from './initialLoad'
+import {UserSettings} from '../userSettings'
 
 import {RootState} from './index'
 
@@ -148,6 +149,9 @@ export const getCloudMessageCanceled = createSelector(
         if (!me) {
             return false
         }
+        if (me.id === 'single-user') {
+            return UserSettings.hideCloudMessage
+        }
         return Boolean(me.props?.focalboard_cloudMessageCanceled)
     },
 )

webapp/src/userSettings.ts

@@ -17,6 +17,7 @@ export enum UserSettingKey {
     RandomIcons = 'randomIcons',
     MobileWarningClosed = 'mobileWarningClosed',
     WelcomePageViewed = 'welcomePageViewed',
+    HideCloudMessage = 'hideCloudMessage'
 }
 
 export class UserSettings {
@@ -146,6 +147,14 @@ export class UserSettings {
     static set mobileWarningClosed(newValue: boolean) {
         UserSettings.set(UserSettingKey.MobileWarningClosed, String(newValue))
     }
+
+    static get hideCloudMessage(): boolean {
+        return localStorage.getItem(UserSettingKey.HideCloudMessage) === 'true'
+    }
+
+    static set hideCloudMessage(newValue: boolean) {
+        localStorage.setItem(UserSettingKey.HideCloudMessage, JSON.stringify(newValue))
+    }
 }
 
 export function exportUserSettingsBlob(): string {