[MM-58379] Remove playbooks from onboarding (#27757)

* remove playbooks from onboarding

* i18n

webapp/channels/src/components/global_header/left_controls/product_menu/product_menu.tsx

@@ -8,31 +8,22 @@ import styled from 'styled-components';
 
 import IconButton from '@mattermost/compass-components/components/icon-button'; // eslint-disable-line no-restricted-imports
 
-import {getConfig, getLicense} from 'mattermost-redux/selectors/entities/general';
+import {getLicense} from 'mattermost-redux/selectors/entities/general';
-import {getInt} from 'mattermost-redux/selectors/entities/preferences';
-import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 
 import {setProductMenuSwitcherOpen} from 'actions/views/product_menu';
 import {isSwitcherOpen} from 'selectors/views/product_menu';
 
 import {
-    GenericTaskSteps,
     OnboardingTaskCategory,
     OnboardingTasksName,
     TaskNameMapToSteps,
     useHandleOnBoardingTaskData,
 } from 'components/onboarding_tasks';
-import {FINISHED, TutorialTourName} from 'components/tours';
-import {PlaybooksTourTip} from 'components/tours/onboarding_explore_tools_tour';
 import Menu from 'components/widgets/menu/menu';
 import MenuWrapper from 'components/widgets/menu/menu_wrapper';
 
-import {useGetPluginsActivationState} from 'plugins/useGetPluginsActivationState';
-import {ExploreOtherToolsTourSteps, suitePluginIds} from 'utils/constants';
 import {useCurrentProductId, useProducts, isChannels} from 'utils/products';
 
-import type {GlobalState} from 'types/store';
-
 import ProductBranding from './product_branding';
 import ProductBrandingTeamEdition from './product_branding_team_edition';
 import ProductMenuItem from './product_menu_item';
@@ -77,16 +68,6 @@ const ProductMenu = (): JSX.Element => {
     const currentProductID = useCurrentProductId();
     const license = useSelector(getLicense);
 
-    const enableTutorial = useSelector(getConfig).EnableTutorial === 'true';
-    const currentUserId = useSelector(getCurrentUserId);
-    const tutorialStep = useSelector((state: GlobalState) => getInt(state, TutorialTourName.EXPLORE_OTHER_TOOLS, currentUserId, 0));
-    const triggerStep = useSelector((state: GlobalState) => getInt(state, OnboardingTaskCategory, OnboardingTasksName.EXPLORE_OTHER_TOOLS, FINISHED));
-    const exploreToolsTourTriggered = triggerStep === GenericTaskSteps.STARTED;
-
-    const {playbooksPlugin} = useGetPluginsActivationState();
-
-    const showPlaybooksTour = enableTutorial && tutorialStep === ExploreOtherToolsTourSteps.PLAYBOOKS_TOUR && exploreToolsTourTriggered && playbooksPlugin;
-
     const handleClick = () => dispatch(setProductMenuSwitcherOpen(!switcherOpen));
 
     const handleOnBoardingTaskData = useHandleOnBoardingTaskData();
@@ -99,7 +80,7 @@ const ProductMenu = (): JSX.Element => {
     };
 
     useClickOutsideRef(menuRef, () => {
-        if (exploreToolsTourTriggered || !switcherOpen) {
+        if (!switcherOpen) {
             return;
         }
         dispatch(setProductMenuSwitcherOpen(false));
@@ -108,11 +89,6 @@ const ProductMenu = (): JSX.Element => {
     const productItems = products?.map((product) => {
         let tourTip;
 
-        // playbooks
-        if (product.pluginId === suitePluginIds.playbooks && showPlaybooksTour) {
-            tourTip = (<PlaybooksTourTip singleTip={true}/>);
-        }
-
         return (
             <ProductMenuItem
                 key={product.id}

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

@@ -8,11 +8,9 @@ export const OnboardingTaskCategory = 'onboarding_task_list';
 // Whole task list is based on these
 export const OnboardingTasksName = {
     CHANNELS_TOUR: 'channels_tour',
-    PLAYBOOKS_TOUR: 'playbooks_tour',
     INVITE_PEOPLE: 'invite_people',
     DOWNLOAD_APP: 'download_app',
     COMPLETE_YOUR_PROFILE: 'complete_your_profile',
-    EXPLORE_OTHER_TOOLS: 'explore_other_tools',
     VISIT_SYSTEM_CONSOLE: 'visit_system_console',
     START_TRIAL: 'start_trial',
 };
@@ -33,9 +31,7 @@ export const GenericTaskSteps = {
 
 export const TaskNameMapToSteps = {
     [OnboardingTasksName.CHANNELS_TOUR]: GenericTaskSteps,
-    [OnboardingTasksName.PLAYBOOKS_TOUR]: GenericTaskSteps,
     [OnboardingTasksName.COMPLETE_YOUR_PROFILE]: GenericTaskSteps,
-    [OnboardingTasksName.EXPLORE_OTHER_TOOLS]: GenericTaskSteps,
     [OnboardingTasksName.DOWNLOAD_APP]: GenericTaskSteps,
     [OnboardingTasksName.VISIT_SYSTEM_CONSOLE]: GenericTaskSteps,
     [OnboardingTasksName.INVITE_PEOPLE]: GenericTaskSteps,

webapp/channels/src/components/onboarding_tasks/onboarding_tasks_manager.tsx

@@ -4,7 +4,7 @@
 import React, {useCallback, useMemo} from 'react';
 import {useIntl} from 'react-intl';
 import {useDispatch, useSelector} from 'react-redux';
-import {matchPath, useHistory, useLocation} from 'react-router-dom';
+import {matchPath, useLocation} from 'react-router-dom';
 
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {getCurrentUserId} from 'mattermost-redux/selectors/entities/common';
@@ -24,13 +24,11 @@ import {setProductMenuSwitcherOpen} from 'actions/views/product_menu';
 import {setStatusDropdown} from 'actions/views/status_dropdown';
 
 import Channels from 'components/common/svg_images_components/channels_svg';
-import Clipboard from 'components/common/svg_images_components/clipboard_svg';
 import Gears from 'components/common/svg_images_components/gears_svg';
 import Handshake from 'components/common/svg_images_components/handshake_svg';
 import Phone from 'components/common/svg_images_components/phone_svg';
 import Security from 'components/common/svg_images_components/security_svg';
 import Sunglasses from 'components/common/svg_images_components/sunglasses_svg';
-import Wrench from 'components/common/svg_images_components/wrench_svg';
 import LearnMoreTrialModal from 'components/learn_more_trial_modal/learn_more_trial_modal';
 import {
     AutoTourStatus,
@@ -41,7 +39,7 @@ import {
     TutorialTourName,
 } from 'components/tours';
 
-import {ModalIdentifiers, TELEMETRY_CATEGORIES, ExploreOtherToolsTourSteps} from 'utils/constants';
+import {ModalIdentifiers, TELEMETRY_CATEGORIES} from 'utils/constants';
 
 import type {GlobalState} from 'types/store';
 
@@ -61,14 +59,6 @@ const useGetTaskDetails = () => {
                 defaultMessage: 'Take a tour of Channels.',
             }),
         },
-        [OnboardingTasksName.PLAYBOOKS_TOUR]: {
-            id: 'task_resolve_incidents_faster_with_playbooks',
-            svg: Clipboard,
-            message: formatMessage({
-                id: 'onboardingTask.checklist.task_resolve_incidents_faster_with_playbooks',
-                defaultMessage: 'Explore workflows with your first playbook.',
-            }),
-        },
         [OnboardingTasksName.INVITE_PEOPLE]: {
             id: 'task_invite_team_members',
             svg: Handshake,
@@ -86,15 +76,6 @@ const useGetTaskDetails = () => {
             }),
         },
 
-        [OnboardingTasksName.EXPLORE_OTHER_TOOLS]: {
-            id: 'task_explore_other_tools_in_platform',
-            svg: Wrench,
-            message: formatMessage({
-                id: 'onboardingTask.checklist.task_explore_other_tools_in_platform',
-                defaultMessage: 'Explore other tools in the platform.',
-            }),
-        },
-
         [OnboardingTasksName.DOWNLOAD_APP]: {
             id: 'task_download_mm_apps',
             svg: Phone,
@@ -124,7 +105,6 @@ const useGetTaskDetails = () => {
 };
 
 export const useTasksList = () => {
-    const pluginsList = useSelector((state: GlobalState) => state.plugins.plugins);
     const prevTrialLicense = useSelector((state: GlobalState) => state.entities.admin.prevTrialLicense);
     const license = useSelector(getLicense);
     const isPrevLicensed = prevTrialLicense?.IsLicensed;
@@ -147,9 +127,6 @@ export const useTasksList = () => {
     const showStartTrialTask = selfHostedTrialCondition || cloudTrialCondition;
 
     const list: Record<string, string> = {...OnboardingTasksName};
-    if (!pluginsList.playbooks || !isUserFirstAdmin) {
-        delete list.PLAYBOOKS_TOUR;
-    }
     if (!showStartTrialTask) {
         delete list.START_TRIAL;
     }
@@ -159,11 +136,6 @@ export const useTasksList = () => {
         delete list.START_TRIAL;
     }
 
-    // explore other tools tour is only shown to subsequent admins and end users
-    if (isUserFirstAdmin || (!pluginsList.playbooks && !pluginsList.focalboard)) {
-        delete list.EXPLORE_OTHER_TOOLS;
-    }
-
     // invite other users is hidden for guest users
     if (isGuestUser) {
         delete list.INVITE_PEOPLE;
@@ -233,7 +205,6 @@ export const useHandleOnBoardingTaskData = () => {
 
 export const useHandleOnBoardingTaskTrigger = () => {
     const dispatch = useDispatch();
-    const history = useHistory();
     const {pathname} = useLocation();
 
     const handleSaveData = useHandleOnBoardingTaskData();
@@ -269,12 +240,6 @@ export const useHandleOnBoardingTaskTrigger = () => {
             }
             break;
         }
-        case OnboardingTasksName.PLAYBOOKS_TOUR: {
-            history.push('/playbooks/start');
-            localStorage.setItem(OnboardingTaskCategory, 'true');
-            handleSaveData(taskName, TaskNameMapToSteps[taskName].FINISHED, true);
-            break;
-        }
         case OnboardingTasksName.COMPLETE_YOUR_PROFILE: {
             dispatch(setStatusDropdown(true));
             dispatch(setShowOnboardingCompleteProfileTour(true));
@@ -284,30 +249,6 @@ export const useHandleOnBoardingTaskTrigger = () => {
             }
             break;
         }
-        case OnboardingTasksName.EXPLORE_OTHER_TOOLS: {
-            dispatch(setProductMenuSwitcherOpen(true));
-            handleSaveData(taskName, TaskNameMapToSteps[taskName].STARTED, true);
-            const tourCategory = TutorialTourName.EXPLORE_OTHER_TOOLS;
-            const preferences = [
-                {
-                    user_id: currentUserId,
-                    category: tourCategory,
-                    name: currentUserId,
-                    value: ExploreOtherToolsTourSteps.PLAYBOOKS_TOUR.toString(),
-                },
-                {
-                    user_id: currentUserId,
-                    category: tourCategory,
-                    name: TTNameMapToATStatusKey[tourCategory],
-                    value: AutoTourStatus.ENABLED.toString(),
-                },
-            ];
-            dispatch(savePreferences(currentUserId, preferences));
-            if (!inChannels) {
-                dispatch(switchToChannels());
-            }
-            break;
-        }
         case OnboardingTasksName.VISIT_SYSTEM_CONSOLE: {
             dispatch(setProductMenuSwitcherOpen(true));
             dispatch(setShowOnboardingVisitConsoleTour(true));

webapp/channels/src/components/tours/constant.ts

@@ -23,7 +23,6 @@ export const TutorialTourName = {
     CRT_TUTORIAL_STEP: 'crt_tutorial_step',
     CRT_THREAD_PANE_STEP: 'crt_thread_pane_step',
     AUTO_TOUR_STATUS: 'auto_tour_status',
-    EXPLORE_OTHER_TOOLS: 'explore_tools',
 };
 
 export const OnboardingTourSteps = {
@@ -41,11 +40,6 @@ export const OnboardingTourStepsForGuestUsers = {
     FINISHED,
 };
 
-export const ExploreOtherToolsTourSteps = {
-    PLAYBOOKS_TOUR: 1,
-    FINISHED,
-};
-
 export const CrtTutorialSteps = {
     WELCOME_POPOVER: 0,
     LIST_POPOVER: 1,
@@ -63,12 +57,10 @@ export const TTNameMapToATStatusKey = {
     [TutorialTourName.ONBOARDING_TUTORIAL_STEP]: TutorialTourName.ONBOARDING_TUTORIAL_STEP + AutoStatusSuffix,
     [TutorialTourName.CRT_TUTORIAL_STEP]: 'crt_tutorial_auto_tour_status',
     [TutorialTourName.CRT_THREAD_PANE_STEP]: TutorialTourName.CRT_THREAD_PANE_STEP + AutoStatusSuffix,
-    [TutorialTourName.EXPLORE_OTHER_TOOLS]: TutorialTourName.EXPLORE_OTHER_TOOLS + AutoStatusSuffix,
 };
 
 export const TTNameMapToTourSteps = {
     [TutorialTourName.ONBOARDING_TUTORIAL_STEP]: OnboardingTourSteps,
     [TutorialTourName.ONBOARDING_TUTORIAL_STEP_FOR_GUESTS]: OnboardingTourStepsForGuestUsers,
     [TutorialTourName.CRT_TUTORIAL_STEP]: CrtTutorialSteps,
-    [TutorialTourName.EXPLORE_OTHER_TOOLS]: ExploreOtherToolsTourSteps,
 };

webapp/channels/src/components/tours/hooks.ts

@@ -11,18 +11,15 @@ import {getCurrentUserId, isCurrentUserGuestUser} from 'mattermost-redux/selecto
 import {setAddChannelDropdown} from 'actions/views/add_channel_dropdown';
 import {close as closeLhs, open as openLhs} from 'actions/views/lhs';
 import {switchToChannels} from 'actions/views/onboarding_tasks';
-import {setProductMenuSwitcherOpen} from 'actions/views/product_menu';
 
 import {OnboardingTaskCategory, OnboardingTaskList, OnboardingTasksName} from 'components/onboarding_tasks';
 
-import {useGetPluginsActivationState} from 'plugins/useGetPluginsActivationState';
 import {getHistory} from 'utils/browser_history';
 
 import type {GlobalState} from 'types/store';
 
 import {
     CrtTutorialSteps,
-    ExploreOtherToolsTourSteps,
     FINISHED,
     OnboardingTourSteps,
     TTNameMapToTourSteps,
@@ -34,16 +31,7 @@ export const useGetTourSteps = (tourCategory: string) => {
 
     let tourSteps: Record<string, number> = TTNameMapToTourSteps[tourCategory];
 
-    const {playbooksPlugin, playbooksProductEnabled} = useGetPluginsActivationState();
+    if (tourCategory === TutorialTourName.ONBOARDING_TUTORIAL_STEP && isGuestUser) {
-
-    if (tourCategory === TutorialTourName.EXPLORE_OTHER_TOOLS) {
-        const steps: Record<string, number> = tourSteps as typeof ExploreOtherToolsTourSteps;
-        if (!playbooksPlugin && !playbooksProductEnabled) {
-            delete steps.PLAYBOOKS_TOUR;
-        }
-
-        tourSteps = steps;
-    } else if (tourCategory === TutorialTourName.ONBOARDING_TUTORIAL_STEP && isGuestUser) {
         // restrict the 'learn more about messaging' tour when user is guest (townSquare, channel creation and user invite are restricted to guests)
         tourSteps = TTNameMapToTourSteps[TutorialTourName.ONBOARDING_TUTORIAL_STEP_FOR_GUESTS];
     }
@@ -112,31 +100,6 @@ export const useHandleNavigationAndExtraActions = (tourCategory: string) => {
             }
             default:
             }
-        } else if (tourCategory === TutorialTourName.EXPLORE_OTHER_TOOLS) {
-            switch (step) {
-            case ExploreOtherToolsTourSteps.FINISHED : {
-                dispatch(setProductMenuSwitcherOpen(false));
-                let preferences = [
-                    {
-                        user_id: currentUserId,
-                        category: OnboardingTaskCategory,
-                        name: OnboardingTasksName.EXPLORE_OTHER_TOOLS,
-                        value: FINISHED.toString(),
-                    },
-                ];
-                preferences = [...preferences,
-                    {
-                        user_id: currentUserId,
-                        category: OnboardingTaskCategory,
-                        name: OnboardingTaskList.ONBOARDING_TASK_LIST_OPEN,
-                        value: 'true',
-                    },
-                ];
-                dispatch(savePreferences(currentUserId, preferences));
-                break;
-            }
-            default:
-            }
         }
     }, [currentUserId, teamUrl, tourCategory]);
 

webapp/channels/src/components/tours/onboarding_explore_tools_tour/index.ts

@@ -1,4 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-export * from './playbooks_tour_tip';

webapp/channels/src/components/tours/onboarding_explore_tools_tour/onboarding_explore_tools_tour_tip.tsx

@@ -1,18 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import React from 'react';
-
-import {ChannelsTourTip, TutorialTourName} from 'components/tours';
-import type {ChannelsTourTipProps} from 'components/tours';
-
-const OnboardingExploreToolsTourTip = (props: Omit<ChannelsTourTipProps, 'tourCategory'>) => {
-    return (
-        <ChannelsTourTip
-            {...props}
-            tourCategory={TutorialTourName.EXPLORE_OTHER_TOOLS}
-        />
-    );
-};
-
-export default OnboardingExploreToolsTourTip;

webapp/channels/src/components/tours/onboarding_explore_tools_tour/playbooks_tour_tip.tsx

@@ -1,47 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import React from 'react';
-import {FormattedMessage} from 'react-intl';
-
-import {useMeasurePunchouts} from '@mattermost/components';
-
-import PlaybooksImg from 'images/playbooks_tour_tip.svg';
-
-import OnboardingExploreToolsTourTip from './onboarding_explore_tools_tour_tip';
-
-interface PlaybooksTourTipProps {
-    singleTip: boolean;
-}
-
-export const PlaybooksTourTip = ({singleTip}: PlaybooksTourTipProps) => {
-    const title = (
-        <FormattedMessage
-            id='onboardingTour.Playbooks.title'
-            defaultMessage={'Build workflows with Playbooks'}
-        />
-    );
-    const screen = (
-        <p>
-            <FormattedMessage
-                id='onboardingTour.Playbooks.Description'
-                defaultMessage={'With checklists, automations and integrations, you can define processes that ensure best practices are followed every time.'}
-            />
-        </p>
-    );
-
-    const overlayPunchOut = useMeasurePunchouts(['product-menu-item-playbooks'], []);
-
-    return (
-        <OnboardingExploreToolsTourTip
-            title={title}
-            screen={screen}
-            overlayPunchOut={overlayPunchOut}
-            singleTip={singleTip}
-            imageURL={PlaybooksImg}
-            placement='right-start'
-            pulsatingDotPlacement='right'
-        />
-    );
-};
-

webapp/channels/src/i18n/en.json

@@ -4388,10 +4388,8 @@
   "onboardingTask.checklist.start_enterprise_now": "Start your free Enterprise trial now!",
   "onboardingTask.checklist.task_complete_your_profile": "Complete your profile.",
   "onboardingTask.checklist.task_download_mm_apps": "Download the Desktop and Mobile Apps.",
-  "onboardingTask.checklist.task_explore_other_tools_in_platform": "Explore other tools in the platform.",
   "onboardingTask.checklist.task_invite_team_members": "Invite team members to the workspace.",
   "onboardingTask.checklist.task_learn_more_about_messaging": "Take a tour of Channels.",
-  "onboardingTask.checklist.task_resolve_incidents_faster_with_playbooks": "Explore workflows with your first playbook.",
   "onboardingTask.checklist.task_start_enterprise_trial": "Learn more about Enterprise-level high-security features.",
   "onboardingTask.checklist.task_visit_system_console": "Visit the System Console to configure your workspace.",
   "onboardingTask.checklist.video_title": "Watch overview",
@@ -4410,8 +4408,6 @@
   "onboardingTour.customizeYourExperience.title": "Customize your experience",
   "onboardingTour.invitePeople.Description": "Invite members of your organization or external guests to the team and start collaborating with them.",
   "onboardingTour.invitePeople.title": "Invite people to the team",
-  "onboardingTour.Playbooks.Description": "With checklists, automations and integrations, you can define processes that ensure best practices are followed every time.",
-  "onboardingTour.Playbooks.title": "Build workflows with Playbooks",
   "onboardingTour.sendMessage.Description": "Start collaborating with others by typing or selecting one of the messages below. You can also drag and drop attachments into the text field or upload them using the paperclip icon.",
   "onboardingTour.sendMessage.title": "Send messages",
   "ONE_HUNDRED_TO_500": "101-500",

webapp/channels/src/utils/constants.tsx

@@ -680,11 +680,6 @@ export const CrtTutorialSteps = {
     FINISHED: 999,
 };
 
-export const ExploreOtherToolsTourSteps = {
-    PLAYBOOKS_TOUR: 1,
-    FINISHED: 999,
-};
-
 export const CrtTutorialTriggerSteps = {
     START: 0,
     STARTED: 1,
@@ -1440,7 +1435,6 @@ export const Constants = {
     AdminTutorialSteps,
     CrtTutorialSteps,
     CrtTutorialTriggerSteps,
-    ExploreOtherToolsTourSteps,
     CrtThreadPaneSteps,
     PostTypes,
     ErrorPageTypes,