MM-53088 - remove autoshow linked board (#23783)

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist.tsx

@@ -8,7 +8,6 @@ import styled, {css} from 'styled-components';
 import {FormattedMessage} from 'react-intl';
 
 import {getShowTaskListBool} from 'selectors/onboarding';
-import {shouldShowAutoLinkedBoard} from 'selectors/plugins';
 
 import {
     getBool,
@@ -32,11 +31,10 @@ import CompassThemeProvider from 'components/compass_theme_provider/compass_them
 
 import {openModal} from 'actions/views/modals';
 import {GlobalState} from 'types/store';
-import {showRHSPlugin} from 'actions/views/rhs';
 import {trackEvent} from 'actions/telemetry_actions';
 import checklistImg from 'images/onboarding-checklist.svg';
 
-import {Preferences, RecommendedNextStepsLegacy, suitePluginIds} from 'utils/constants';
+import {Preferences, RecommendedNextStepsLegacy} from 'utils/constants';
 
 import {TaskListPopover} from './onboarding_tasklist_popover';
 import {Task} from './onboarding_tasklist_task';
@@ -187,24 +185,11 @@ const OnBoardingTaskList = (): JSX.Element | null => {
     const [showTaskList, firstTimeOnboarding] = useSelector(getShowTaskListBool);
     const theme = useSelector(getTheme);
 
-    // a/b test auto show linked boards
-    const autoShowLinkedBoard = useSelector((state: GlobalState) => shouldShowAutoLinkedBoard(state));
-    const pluginsComponentsList = useSelector((state: GlobalState) => state.plugins.components);
-
     const startTask = (taskName: string) => {
         toggleTaskList();
         handleTaskTrigger(taskName);
     };
 
-    const findRhsPluginId = (pluginId: string) => {
-        const rhsPlugins = pluginsComponentsList.RightHandSidebarComponent;
-
-        if (rhsPlugins.length) {
-            return rhsPlugins.find((plugin) => plugin.pluginId === pluginId)?.id;
-        }
-        return null;
-    };
-
     const initOnboardingPrefs = async () => {
         // save to preferences the show/open-task-list to true
         // also save the recomendedNextSteps-hide to true to avoid asserting to true
@@ -288,16 +273,6 @@ const OnBoardingTaskList = (): JSX.Element | null => {
         }];
         dispatch(savePreferences(currentUserId, preferences));
         trackEvent(OnboardingTaskCategory, open ? OnboardingTaskList.ONBOARDING_TASK_LIST_CLOSE : OnboardingTaskList.ONBOARDING_TASK_LIST_OPEN);
-
-        // check if the AB test FF is set and also check that the linkedBoard has only been shown once, then open the RHS
-        if (autoShowLinkedBoard && open) {
-            const boardsId = findRhsPluginId(suitePluginIds.boards);
-            if (!boardsId) {
-                return;
-            }
-
-            dispatch(showRHSPlugin(boardsId));
-        }
     }, [open, currentUserId]);
 
     const openVideoModal = useCallback(() => {

webapp/channels/src/components/onboarding_tasks/constants.ts

@@ -24,9 +24,6 @@ export const OnboardingTaskList = {
     ONBOARDING_TASK_LIST_CLOSE: 'onboarding_task_list_close',
     ONBOARDING_VIDEO_MODAL: 'onboarding_video_modal',
     DECLINED_ONBOARDING_TASK_LIST: 'declined_onboarding_task_list',
-
-    // auto show channel linked boards A/B test
-    ONBOARDING_LINKED_BOARD_AUTO_SHOWN: 'linked_board_auto_shown',
 };
 
 export const GenericTaskSteps = {

webapp/channels/src/i18n/en.json

@@ -2797,8 +2797,6 @@
   "authorize.app": "The app **{appName}** would like the ability to access and modify your basic information.",
   "authorize.deny": "Deny",
   "authorize.title": "Authorize **{appName}** to Connect to Your **Mattermost** User Account",
-  "autoShowLinkedBoard.tutorialTip.description": "Manage tasks, plan sprints, conduct standup with the help of kanban boards and tables.",
-  "autoShowLinkedBoard.tutorialTip.title": "Link kanban boards to channels",
   "avatars.overflowUnnamedOnly": "{overflowUnnamedCount, plural, =1 {one other} other {# others}}",
   "avatars.overflowUsers": "{overflowUnnamedCount, plural, =0 {{names}} =1 {{names} and one other} other {{names} and # others}}",
   "backstage_list.search": "Search",

webapp/channels/src/packages/mattermost-redux/src/actions/boards.ts

@@ -8,8 +8,6 @@ import {PreferenceType} from '@mattermost/types/preferences';
 
 import {Preferences} from '../constants';
 
-import {OnboardingTaskCategory, OnboardingTaskList} from 'components/onboarding_tasks';
-
 import {savePreferences} from './preferences';
 
 export function setNewChannelWithBoardPreference(initializationState: Record<string, boolean>): ActionFunc {
@@ -26,18 +24,3 @@ export function setNewChannelWithBoardPreference(initializationState: Record<str
         return {data: true};
     };
 }
-
-export function setAutoShowLinkedBoardPreference(): ActionFunc {
-    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
-        const state = getState();
-        const currentUserId = getCurrentUserId(state);
-        const preference: PreferenceType = {
-            category: OnboardingTaskCategory,
-            user_id: currentUserId,
-            name: OnboardingTaskList.ONBOARDING_LINKED_BOARD_AUTO_SHOWN,
-            value: 'true',
-        };
-        await dispatch(savePreferences(currentUserId, [preference]));
-        return {data: true};
-    };
-}

webapp/channels/src/packages/mattermost-redux/src/constants/preferences.ts

@@ -76,7 +76,6 @@ const Preferences = {
 
     NEW_CHANNEL_WITH_BOARD_TOUR_SHOWED: 'channel_with_board_tip_showed',
 
-    AUTO_LINKED_BOARD: 'auto_linked_board',
     CATEGORY_ONBOARDING: 'category_onboarding',
 
     CATEGORY_DRAFTS: 'drafts',

webapp/channels/src/packages/mattermost-redux/src/selectors/entities/preferences.ts

@@ -291,10 +291,6 @@ export function getVisibleDmGmLimit(state: GlobalState) {
     return getInt(state, Preferences.CATEGORY_SIDEBAR_SETTINGS, Preferences.LIMIT_VISIBLE_DMS_GMS, defaultLimit);
 }
 
-export function autoShowLinkedBoardFFEnabled(state: GlobalState): boolean {
-    return getFeatureFlagValue(state, 'OnboardingAutoShowLinkedBoard') === 'true';
-}
-
 export function onboardingTourTipsEnabled(state: GlobalState): boolean {
     return getFeatureFlagValue(state, 'OnboardingTourTips') === 'true';
 }

webapp/channels/src/plugins/rhs_plugin/auto_show_linked_board_tourtip.tsx

@@ -1,96 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import React, {useCallback} from 'react';
-import {FormattedMessage} from 'react-intl';
-import {useDispatch, useSelector} from 'react-redux';
-
-import {Placement} from 'tippy.js';
-
-import {setAutoShowLinkedBoardPreference} from 'mattermost-redux/actions/boards';
-
-import {TourTip} from '@mattermost/components';
-import {shouldShowAutoLinkedBoard} from 'selectors/plugins';
-import {suitePluginIds} from 'utils/constants';
-import {getPluggableId} from 'selectors/rhs';
-import {PluginComponent} from 'types/store/plugins';
-import {GlobalState} from 'types/store';
-
-type Props = {
-    pulsatingDotPlacement?: Omit<Placement, 'auto'| 'auto-end'>;
-}
-
-const AutoShowLinkedBoardTourTip = ({
-    pulsatingDotPlacement = 'auto',
-}: Props): JSX.Element | null => {
-    const dispatch = useDispatch();
-
-    const rhsPlugins: PluginComponent[] = useSelector((state: GlobalState) => state.plugins.components.RightHandSidebarComponent);
-    const pluggableId = useSelector(getPluggableId);
-    const pluginComponent = rhsPlugins.find((element: PluginComponent) => element.id === pluggableId);
-
-    const isBoards = pluginComponent && (pluginComponent.pluginId === suitePluginIds.focalboard || pluginComponent.pluginId === suitePluginIds.boards);
-    const showAutoLinkedBoard = useSelector(shouldShowAutoLinkedBoard);
-    const showAutoLinkedBoardTourTip = isBoards && showAutoLinkedBoard;
-
-    const title = (
-        <FormattedMessage
-            id='autoShowLinkedBoard.tutorialTip.title'
-            defaultMessage='Link kanban boards to channels'
-        />
-    );
-
-    const screen = (
-        <FormattedMessage
-            id='autoShowLinkedBoard.tutorialTip.description'
-            defaultMessage='Manage tasks, plan sprints, conduct standup with the help of kanban boards and tables.'
-        />
-    );
-
-    const handleDismiss = useCallback((e: React.MouseEvent) => {
-        e.stopPropagation();
-        dispatch(setAutoShowLinkedBoardPreference());
-    }, []);
-
-    const handleOpen = useCallback((e: React.MouseEvent) => {
-        e.stopPropagation();
-        e.preventDefault();
-        dispatch(setAutoShowLinkedBoardPreference());
-    }, []);
-
-    const nextBtn = (
-        <FormattedMessage
-            id={'tutorial_tip.done'}
-            defaultMessage={'Done'}
-        />
-    );
-
-    if (!showAutoLinkedBoardTourTip) {
-        return null;
-    }
-
-    return (
-        <TourTip
-            show={true}
-            screen={screen}
-            title={title}
-            overlayPunchOut={null}
-            placement='left-start'
-            pulsatingDotPlacement={pulsatingDotPlacement}
-            step={1}
-            singleTip={true}
-            showOptOut={false}
-            interactivePunchOut={true}
-            handleDismiss={handleDismiss}
-            handleOpen={handleOpen}
-            handlePrevious={handleDismiss}
-            pulsatingDotTranslate={{x: -10, y: 70}}
-            tippyBlueStyle={true}
-            hideBackdrop={true}
-            nextBtn={nextBtn}
-            handleNext={handleDismiss}
-        />
-    );
-};
-
-export default AutoShowLinkedBoardTourTip;

webapp/channels/src/plugins/rhs_plugin/rhs_plugin.tsx

@@ -7,8 +7,6 @@ import SearchResultsHeader from 'components/search_results_header';
 
 import Pluggable from 'plugins/pluggable';
 
-import AutoShowLinkedBoardTourTip from './auto_show_linked_board_tourtip';
-
 export type Props = {
     showPluggable: boolean;
     pluggableId: string;
@@ -17,15 +15,12 @@ export type Props = {
 
 export default class RhsPlugin extends React.PureComponent<Props> {
     render() {
-        const autoLinkedBoardTourTip = (<AutoShowLinkedBoardTourTip/>);
-
         return (
             <div
                 id='rhsContainer'
                 className='sidebar-right__body'
             >
                 <SearchResultsHeader>
-                    {autoLinkedBoardTourTip}
                     {this.props.title}
                 </SearchResultsHeader>
                 {

webapp/channels/src/selectors/plugins.ts

@@ -5,11 +5,9 @@ import {createSelector} from 'mattermost-redux/selectors/create_selector';
 import {appBarEnabled, getAppBarAppBindings} from 'mattermost-redux/selectors/entities/apps';
 import {createShallowSelector} from 'mattermost-redux/utils/helpers';
 
-import {autoShowLinkedBoardFFEnabled, get, getBool} from 'mattermost-redux/selectors/entities/preferences';
+import {get} from 'mattermost-redux/selectors/entities/preferences';
 import {Preferences} from 'mattermost-redux/constants';
 
-import {OnboardingTaskCategory, OnboardingTaskList} from 'components/onboarding_tasks';
-
 import {GlobalState} from 'types/store';
 
 import {AppBinding} from '@mattermost/types/apps';
@@ -104,12 +102,3 @@ export function showNewChannelWithBoardPulsatingDot(state: GlobalState): boolean
     const showPulsatingDot = pulsatingDotState !== '' && JSON.parse(pulsatingDotState)[Preferences.NEW_CHANNEL_WITH_BOARD_TOUR_SHOWED] === false;
     return showPulsatingDot;
 }
-
-export const shouldShowAutoLinkedBoard = createSelector(
-    'shouldShowAutoLinkedBoard',
-    (state: GlobalState) => getBool(state, OnboardingTaskCategory, OnboardingTaskList.ONBOARDING_LINKED_BOARD_AUTO_SHOWN),
-    (state: GlobalState) => autoShowLinkedBoardFFEnabled(state),
-    (showAutoLinkedBoardPref: boolean, showAutoLinkedBoardFFEnabled: boolean) => {
-        return !showAutoLinkedBoardPref && showAutoLinkedBoardFFEnabled;
-    },
-);