MM-51795 Remove free cloud server message (#4677)

* remove free cloud server message

* remove selector for cloud message

* remove unused import

webapp/i18n/en.json

@@ -1,5 +1,7 @@
 {
-  "AppBar.Tooltip": "Toggle linked boards",
+  "AdminBadge.SystemAdmin": "Admin",
+  "AdminBadge.TeamAdmin": "Team Admin",
+  "AppBar.Tooltip": "Toggle Linked Boards",
   "Attachment.Attachment-title": "Attachment",
   "AttachmentBlock.DeleteAction": "delete",
   "AttachmentBlock.addElement": "add {type}",
@@ -115,7 +117,6 @@
   "CenterPanel.Login": "Login",
   "CenterPanel.Share": "Share",
   "ChannelIntro.CreateBoard": "Create a board",
-  "CloudMessage.cloud-server": "Get your own free cloud server.",
   "ColorOption.selectColor": "Select {color} Color",
   "Comment.delete": "Delete",
   "CommentsList.send": "Send",
@@ -138,6 +139,7 @@
   "ContentBlock.moveDown": "Move down",
   "ContentBlock.moveUp": "Move up",
   "ContentBlock.text": "text",
+  "DateFilter.empty": "Empty",
   "DateRange.clear": "Clear",
   "DateRange.empty": "Empty",
   "DateRange.endDate": "End date",
@@ -156,10 +158,14 @@
   "Filter.ends-with": "ends with",
   "Filter.includes": "includes",
   "Filter.is": "is",
+  "Filter.is-after": "is after",
+  "Filter.is-before": "is before",
   "Filter.is-empty": "is empty",
   "Filter.is-not-empty": "is not empty",
   "Filter.is-not-set": "is not set",
   "Filter.is-set": "is set",
+  "Filter.isafter": "is after",
+  "Filter.isbefore": "is before",
   "Filter.not-contains": "doesn't contain",
   "Filter.not-ends-with": "doesn't end with",
   "Filter.not-includes": "doesn't include",
@@ -306,6 +312,7 @@
   "ValueSelector.valueSelector": "Value selector",
   "ValueSelectorLabel.openMenu": "Open menu",
   "VersionMessage.help": "Check out what's new in this version.",
+  "VersionMessage.learn-more": "Learn more",
   "View.AddView": "Add view",
   "View.Board": "Board",
   "View.DeleteView": "Delete view",
@@ -360,6 +367,9 @@
   "WelcomePage.StartUsingIt.Text": "Start using it",
   "Workspace.editing-board-template": "You're editing a board template.",
   "badge.guest": "Guest",
+  "boardPage.confirm-join-button": "Join",
+  "boardPage.confirm-join-text": "You are about to join a private board without explicitly being added by the board admin. Are you sure you wish to join this private board?",
+  "boardPage.confirm-join-title": "Join private board",
   "boardSelector.confirm-link-board": "Link board to channel",
   "boardSelector.confirm-link-board-button": "Yes, link board",
   "boardSelector.confirm-link-board-subtext": "When you link \"{boardName}\" to the channel, all members of the channel (existing and new) will be able to edit it. This excludes members who are guests. You can unlink a board from a channel at any time.",

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

@@ -1,73 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`components/messages/CloudMessage not plugin mode, close message 1`] = `<div />`;
-
-exports[`components/messages/CloudMessage not plugin mode, show message, 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 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.scss

@@ -1,38 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-.CloudMessage {
-    background-color: rgb(var(--sidebar-text-active-border-rgb));
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    text-align: center;
-    font-weight: 600;
-
-    div {
-        width: 100%;
-    }
-
-    > .banner {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        justify-content: center;
-        padding: 10px;
-        color: #fff;
-
-        .CompassIcon {
-            font-size: 18px;
-            margin-right: 2px;
-        }
-
-        .Button {
-            margin-left: 8px;
-            background-color: rgba(255, 255, 255, 0.16);
-        }
-    }
-
-    .IconButton {
-        float: right;
-        color: #fff;
-    }
-}

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

@@ -1,190 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import React from 'react'
-import {Provider as ReduxProvider} from 'react-redux'
-
-import {render, screen} from '@testing-library/react'
-import {mocked} from 'jest-mock'
-import userEvent from '@testing-library/user-event'
-
-import configureStore from 'redux-mock-store'
-
-import {Utils} from '../../utils'
-
-import {IUser} from '../../user'
-
-import {wrapIntl} from '../../testUtils'
-
-import client from '../../octoClient'
-
-import {UserSettings} from '../../userSettings'
-
-import CloudMessage from './cloudMessage'
-
-jest.mock('../../utils')
-jest.mock('../../octoClient')
-const mockedOctoClient = mocked(client, true)
-
-describe('components/messages/CloudMessage', () => {
-    beforeEach(() => {
-        jest.clearAllMocks()
-    })
-
-    const mockedUtils = mocked(Utils, true)
-    const mockStore = configureStore([])
-
-    test('plugin mode, no display', () => {
-        mockedUtils.isFocalboardPlugin.mockReturnValue(true)
-
-        const me: IUser = {
-            id: 'user-id-1',
-            username: 'username_1',
-            email: '',
-            nickname: '',
-            firstname: '',
-            lastname: '',
-            props: {},
-            create_at: 0,
-            update_at: 0,
-            is_bot: false,
-            is_guest: false,
-            roles: 'system_user',
-        }
-        const state = {
-            users: {
-                me,
-            },
-        }
-
-        const store = mockStore(state)
-
-        const component = wrapIntl(
-            <ReduxProvider store={store}>
-                <CloudMessage/>
-            </ReduxProvider>,
-        )
-
-        const {container} = render(component)
-        expect(container).toMatchSnapshot()
-    })
-
-    test('not plugin mode, close message', () => {
-        const me: IUser = {
-            id: 'user-id-1',
-            username: 'username_1',
-            email: '',
-            nickname: '',
-            firstname: '',
-            lastname: '',
-            create_at: 0,
-            update_at: 0,
-            is_bot: false,
-            is_guest: false,
-            roles: 'system_user',
-            props: {},
-        }
-        const state = {
-            users: {
-                me,
-                myConfig: {
-                    cloudMessageCanceled: {value: 'true'},
-                },
-            },
-        }
-        const store = mockStore(state)
-        mockedUtils.isFocalboardPlugin.mockReturnValue(false)
-
-        const component = wrapIntl(
-            <ReduxProvider store={store}>
-                <CloudMessage/>
-            </ReduxProvider>,
-        )
-
-        const {container} = render(component)
-        expect(container).toMatchSnapshot()
-    })
-
-    test('not plugin mode, show message, close message', () => {
-        const me: IUser = {
-            id: 'user-id-1',
-            username: 'username_1',
-            email: '',
-            nickname: '',
-            firstname: '',
-            lastname: '',
-            props: {},
-            create_at: 0,
-            update_at: 0,
-            is_bot: false,
-            is_guest: false,
-            roles: 'system_user',
-        }
-        const state = {
-            users: {
-                me,
-            },
-        }
-        const store = mockStore(state)
-        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).toBeCalledWith('user-id-1', {
-            updatedFields: {
-                cloudMessageCanceled: 'true',
-            },
-        })
-    })
-
-    test('not plugin mode, single user, close message', () => {
-        const me: IUser = {
-            id: 'single-user',
-            username: 'single-user',
-            email: 'single-user',
-            nickname: '',
-            firstname: '',
-            lastname: '',
-            props: {},
-            create_at: 0,
-            update_at: Date.now() - (1000 * 60 * 60 * 24), //24 hours,
-            is_bot: false,
-            is_guest: false,
-            roles: 'system_user',
-        }
-        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

@@ -1,114 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-import React from 'react'
-
-import {useIntl, FormattedMessage} from 'react-intl'
-
-import {Utils} from '../../utils'
-import IconButton from '../../widgets/buttons/iconButton'
-import Button from '../../widgets/buttons/button'
-
-import CloseIcon from '../../widgets/icons/close'
-
-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'
-
-import './cloudMessage.scss'
-const signupURL = 'https://mattermost.com/pricing'
-const displayAfter = (1000 * 60 * 60 * 24) //24 hours
-
-const CloudMessage = React.memo(() => {
-    const intl = useIntl()
-    const dispatch = useAppDispatch()
-    const me = useAppSelector<IUser|null>(getMe)
-    const cloudMessageCanceled = useAppSelector(getCloudMessageCanceled)
-
-    const closeDialogText = intl.formatMessage({
-        id: 'Dialog.closeDialog',
-        defaultMessage: 'Close dialog',
-    })
-
-    const onClose = async () => {
-        if (me) {
-            if (me.id === 'single-user') {
-                UserSettings.hideCloudMessage = true
-                dispatch(patchProps([
-                    {
-                        user_id: me.id,
-                        category: 'focalboard',
-                        name: 'cloudMessageCanceled',
-                        value: 'true',
-                    },
-                ]))
-                return
-            }
-            const patch: UserConfigPatch = {
-                updatedFields: {
-                    cloudMessageCanceled: 'true',
-                },
-            }
-
-            const patchedProps = await octoClient.patchUserConfig(me.id, patch)
-            if (patchedProps) {
-                dispatch(patchProps(patchedProps))
-            }
-        }
-    }
-
-    if (Utils.isFocalboardPlugin() || cloudMessageCanceled) {
-        return null
-    }
-
-    if (me) {
-        const installTime = Date.now() - me.create_at
-        if (installTime < displayAfter) {
-            return null
-        }
-    }
-
-    return (
-        <div className='CloudMessage'>
-            <div className='banner'>
-                <CompassIcon
-                    icon='information-outline'
-                    className='CompassIcon'
-                />
-                <FormattedMessage
-                    id='CloudMessage.cloud-server'
-                    defaultMessage='Get your own free cloud server.'
-                />
-
-                <Button
-                    title='Learn more'
-                    size='xsmall'
-                    emphasis='primary'
-                    onClick={() => {
-                        TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.CloudMoreInfo)
-                        window.open(signupURL)
-                    }}
-                >
-                    <FormattedMessage
-                        id='cloudMessage.learn-more'
-                        defaultMessage='Learn more'
-                    />
-                </Button>
-
-            </div>
-
-            <IconButton
-                className='margin-right'
-                onClick={onClose}
-                icon={<CloseIcon/>}
-                title={closeDialogText}
-                size='small'
-            />
-        </div>
-    )
-})
-export default CloudMessage

webapp/src/components/messages/versionMessage.tsx

@@ -71,7 +71,7 @@ const VersionMessage = React.memo(() => {
                     }}
                 >
                     <FormattedMessage
-                        id='cloudMessage.learn-more'
+                        id='VersionMessage.learn-more'
                         defaultMessage='Learn more'
                     />
                 </Button>

webapp/src/pages/boardPage/boardPage.scss

@@ -1,7 +1,6 @@
 .BoardPage {
     position: relative;
 
-    .CloudMessage:not(:first-child),
     .VersionMessage:not(:first-child) {
         position: absolute;
         top: 0;

webapp/src/pages/boardPage/boardPage.tsx

@@ -6,7 +6,6 @@ import {FormattedMessage, useIntl} from 'react-intl'
 import {useRouteMatch, useHistory} from 'react-router-dom'
 
 import Workspace from '../../components/workspace'
-import CloudMessage from '../../components/messages/cloudMessage'
 import VersionMessage from '../../components/messages/versionMessage'
 import octoClient from '../../octoClient'
 import {Subscription, WSClient} from '../../wsclient'
@@ -300,7 +299,6 @@ const BoardPage = (props: Props): JSX.Element => {
                     <SetWindowTitleAndIcon/>
                     <UndoRedoHotKeys/>
                     <WebsocketConnection/>
-                    <CloudMessage/>
                     <VersionMessage/>
 
                     {!mobileWarningClosed &&

webapp/src/store/users.ts

@@ -10,10 +10,6 @@ import {Utils} from '../utils'
 
 import {Subscription} from '../wsclient'
 
-// TODO: change this whene the initial load is complete
-// import {initialLoad} from './initialLoad'
-import {UserSettings} from '../userSettings'
-
 import {initialLoad} from './initialLoad'
 
 import {RootState} from './index'
@@ -169,20 +165,6 @@ export const getOnboardingTourCategory = createSelector(
     (myConfig): string => (myConfig.tourCategory ? myConfig.tourCategory.value : ''),
 )
 
-export const getCloudMessageCanceled = createSelector(
-    getMe,
-    getMyConfig,
-    (me, myConfig): boolean => {
-        if (!me) {
-            return false
-        }
-        if (me.id === 'single-user') {
-            return UserSettings.hideCloudMessage
-        }
-        return Boolean(myConfig.cloudMessageCanceled?.value)
-    },
-)
-
 export const getVersionMessageCanceled = createSelector(
     getMe,
     getMyConfig,

webapp/src/userSettings.ts

@@ -17,7 +17,6 @@ export enum UserSettingKey {
     RandomIcons = 'randomIcons',
     MobileWarningClosed = 'mobileWarningClosed',
     WelcomePageViewed = 'welcomePageViewed',
-    HideCloudMessage = 'hideCloudMessage',
     NameFormat = 'nameFormat'
 }
 
@@ -149,14 +148,6 @@ export class UserSettings {
         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))
-    }
-
     static get nameFormat(): string | null {
         return UserSettings.get(UserSettingKey.NameFormat)
     }