[MM-51233] Updates for Trial Requests (#22620)

* Add new trial form to enrich trial requests with more customer info

* Update snapshots

* One more addition

* Fixes from PR feedback

* Fix types, i18n, update e2e tests

* Fix linter

* Fix i18n?

* Fix blank translation

* update snapshot

* Update snapshot properly

* Remove inapplicable test

* Fix business email validation only happening once

* UX Feedback

* Fix linter

* Fix linter again, not working locally

* FIX LINTER

* Move isvalid check until after some fields are set

* Fix for overlapping modals

* Fix linter

* UX feedback

* UX Feedback

* Fix typo in error modal

* [MM-51551] Add new Trial Form to Playbooks trial requests (#22650)

* Playbooks start trial entrypoints opens new trial form modal

* Fix style

---------

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

* [MM-51347] Trial form error modal for embargoed and air gapped entities (#22656)

* Playbooks start trial entrypoints opens new trial form modal

* Add support for air gapped environments when making trial requests

* Add specific handling for embargoed entities

* undo some code

* Fix linter

* Fix types

* Fix style

* Updates because TE has to upgrade to E0 before it can activate a trial

---------

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

---------

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

webapp/playbooks/src/client.ts

@@ -569,24 +569,6 @@ export function exportChannelUrl(channelId: string) {
     return `${exportPluginUrl}/export${queryParams}`;
 }
 
-export async function trackRequestTrialLicense(action: string) {
-    await doFetchWithoutResponse(`${apiUrl}/telemetry/start-trial`, {
-        method: 'POST',
-        body: JSON.stringify({action}),
-    });
-}
-
-export const requestTrialLicense = async (users: number, action: string) => {
-    trackRequestTrialLicense(action);
-
-    try {
-        const response = await Client4.requestTrialLicense({users, terms_accepted: true, receive_emails_accepted: true});
-        return {data: response};
-    } catch (e) {
-        return {error: e.message};
-    }
-};
-
 export const postMessageToAdmins = async (messageType: AdminNotificationType) => {
     const body = `{"message_type": "${messageType}"}`;
     try {

webapp/playbooks/src/components/backstage/upgrade_modal.tsx

@@ -4,14 +4,14 @@ import {useSelector} from 'react-redux';
 import styled from 'styled-components';
 
 import GenericModal, {DefaultFooterContainer} from 'src/components/widgets/generic_modal';
-import {postMessageToAdmins, requestTrialLicense} from 'src/client';
+import {postMessageToAdmins} from 'src/client';
 import UpgradeModalFooter from 'src/components/backstage/upgrade_modal_footer';
 
 import {getAdminAnalytics, isCurrentUserAdmin, isTeamEdition} from 'src/selectors';
 
 import {AdminNotificationType} from 'src/constants';
 import {isCloud} from 'src/license';
-import {useOpenCloudModal} from 'src/hooks';
+import {useOpenCloudModal, useOpenStartTrialFormModal} from 'src/hooks';
 
 import {ModalActionState, getUpgradeModalButtons, getUpgradeModalCopy} from 'src/components/backstage/upgrade_modal_data';
 
@@ -29,6 +29,7 @@ const UpgradeModal = (props: Props) => {
     const isServerCloud = useSelector(isCloud);
     const isAdmin = useSelector(isCurrentUserAdmin);
     const isServerTeamEdition = useSelector(isTeamEdition);
+    const openTrialFormModal = useOpenStartTrialFormModal();
 
     const [actionState, setActionState] = useState(ModalActionState.Uninitialized);
 
@@ -40,14 +41,7 @@ const UpgradeModal = (props: Props) => {
             return;
         }
         setActionState(ModalActionState.Loading);
-
-        const requestedUsers = Math.max(serverTotalUsers, 30);
-        const response = await requestTrialLicense(requestedUsers, props.messageType);
-        if (response.error) {
-            setActionState(ModalActionState.Error);
-        } else {
-            setActionState(ModalActionState.Success);
-        }
+        openTrialFormModal('playbooks_upgrade_modal');
     };
 
     const openUpgradeModal = async () => {

webapp/playbooks/src/components/upgrade_banner.tsx

@@ -14,10 +14,10 @@ import LoadingSpinner from 'src/components/assets/loading_spinner';
 import {getAdminAnalytics, isTeamEdition} from 'src/selectors';
 import StartTrialNotice from 'src/components/backstage/start_trial_notice';
 import ConvertEnterpriseNotice from 'src/components/backstage/convert_enterprise_notice';
-import {postMessageToAdmins, requestTrialLicense} from 'src/client';
+import {postMessageToAdmins} from 'src/client';
 import {AdminNotificationType} from 'src/constants';
 import {isCloud} from 'src/license';
-import {useOpenCloudModal} from 'src/hooks';
+import {useOpenCloudModal, useOpenStartTrialFormModal} from 'src/hooks';
 
 import SuccessSvg from './assets/success_svg';
 import ErrorSvg from './assets/error_svg';
@@ -125,6 +125,7 @@ const UpgradeBanner = (props: Props) => {
     const isCurrentUserAdmin = isSystemAdmin(currentUser.roles);
     const [actionState, setActionState] = useState(ActionState.Uninitialized);
     const isServerTeamEdition = useSelector(isTeamEdition);
+    const openTrialFormModal = useOpenStartTrialFormModal();
 
     const analytics = useSelector(getAdminAnalytics);
     const serverTotalUsers = analytics?.TOTAL_USERS || 0;
@@ -149,15 +150,7 @@ const UpgradeBanner = (props: Props) => {
             return;
         }
 
-        setActionState(ActionState.Loading);
-
-        const requestedUsers = Math.max(serverTotalUsers, 30);
-        const response = await requestTrialLicense(requestedUsers, props.notificationType);
-        if (response.error) {
-            setActionState(ActionState.Error);
-        } else {
-            setActionState(ActionState.Success);
-        }
+        openTrialFormModal('playbooks_upgrade_banner');
     };
 
     const openUpgradeModal = async () => {

webapp/playbooks/src/hooks/general.ts

@@ -377,6 +377,39 @@ export function useEnsureProfiles(userIds: string[]) {
     }, [userIds]);
 }
 
+export function useOpenStartTrialFormModal() {
+    const dispatch = useDispatch();
+
+    // @ts-ignore
+    if (!window.WebappUtils?.modals?.openModal || !window.WebappUtils?.modals?.ModalIdentifiers?.START_TRIAL_FORM_MODAL || !window.Components?.StartTrialFormModal) {
+        // eslint-disable-next-line no-console
+        console.error('unable to open cloud modal');
+
+        return () => {
+            /*do nothing*/
+        };
+    }
+
+    // @ts-ignore
+    const {openModal, ModalIdentifiers} = window.WebappUtils.modals;
+
+    // @ts-ignore
+    const TrialModal = window.Components.StartTrialFormModal;
+
+    return (page?: string, onClose?: () => void) => {
+        dispatch(
+            openModal({
+                modalId: ModalIdentifiers.START_TRIAL_FORM_MODAL,
+                dialogType: TrialModal,
+                dialogProps: {
+                    page,
+                    onClose,
+                },
+            }),
+        );
+    };
+}
+
 export function useOpenCloudModal() {
     const dispatch = useDispatch();
     const isServerCloud = useSelector(isCloud);