diff --git a/apps/web/src/constants/experimentsConstants.ts b/apps/web/src/constants/experimentsConstants.ts deleted file mode 100644 index 2720076d019..00000000000 --- a/apps/web/src/constants/experimentsConstants.ts +++ /dev/null @@ -1 +0,0 @@ -export const OnboardingExperimentV2ModalKey = 'nv_onboarding_modal'; diff --git a/apps/web/src/pages/auth/components/QuestionnaireForm.tsx b/apps/web/src/pages/auth/components/QuestionnaireForm.tsx index c8c59eb87c1..aaa72d8cff4 100644 --- a/apps/web/src/pages/auth/components/QuestionnaireForm.tsx +++ b/apps/web/src/pages/auth/components/QuestionnaireForm.tsx @@ -26,7 +26,6 @@ import { ROUTES } from '../../../constants/routes.enum'; import { DynamicCheckBox } from './dynamic-checkbox/DynamicCheckBox'; import styled from '@emotion/styled/macro'; import { useDomainParser } from './useDomainHook'; -import { OnboardingExperimentV2ModalKey } from '../../../constants/experimentsConstants'; export function QuestionnaireForm() { const [loading, setLoading] = useState(); @@ -34,7 +33,6 @@ export function QuestionnaireForm() { handleSubmit, formState: { errors }, control, - setError, } = useForm({}); const navigate = useNavigate(); const { setToken, token } = useAuthContext(); @@ -69,7 +67,6 @@ export function QuestionnaireForm() { const createDto: ICreateOrganizationDto = { ...rest, name: organizationName }; const organization = await createOrganizationMutation(createDto); const organizationResponseToken = await api.post(`/v1/auth/organizations/${organization._id}/switch`, {}); - localStorage.setItem(OnboardingExperimentV2ModalKey, 'true'); setToken(organizationResponseToken); } diff --git a/apps/web/src/pages/quick-start/components/OnboardingExperimentModal.tsx b/apps/web/src/pages/quick-start/components/OnboardingExperimentModal.tsx deleted file mode 100644 index b1791aeef8d..00000000000 --- a/apps/web/src/pages/quick-start/components/OnboardingExperimentModal.tsx +++ /dev/null @@ -1,132 +0,0 @@ -import { useEffect, useState } from 'react'; -import { Modal, useMantineTheme, Grid } from '@mantine/core'; - -import styled from '@emotion/styled'; -import { colors, shadows, Title, Button } from '@novu/design-system'; -import { useAuthContext, useSegment } from '@novu/shared-web'; -import { useCreateOnboardingExperimentWorkflow } from '../../../api/hooks/notification-templates/useCreateOnboardingExperimentWorkflow'; -import { OnboardingExperimentV2ModalKey } from '../../../constants/experimentsConstants'; -import { OnBoardingAnalyticsEnum } from '../consts'; - -export function OnboardingExperimentModal() { - const [opened, setOpened] = useState(true); - const theme = useMantineTheme(); - const segment = useSegment(); - const { currentOrganization } = useAuthContext(); - const { - createOnboardingExperimentWorkflow, - isLoading: IsCreateOnboardingExpWorkflowLoading, - isDisabled: isIsCreateOnboardingExpWorkflowDisabled, - } = useCreateOnboardingExperimentWorkflow(); - const handleOnClose = () => { - setOpened(true); - }; - - useEffect(() => { - segment.track('Welcome modal open - [Onboarding]', { - experiment_id: '2024-w15-onb', - _organization: currentOrganization?._id, - }); - }, [currentOrganization?._id, segment]); - - return ( - What would you like to do first?} - sx={{ backdropFilter: 'blur(10px)' }} - shadow={theme.colorScheme === 'dark' ? shadows.dark : shadows.medium} - radius="md" - size="lg" - onClose={handleOnClose} - centered - withCloseButton={false} - > - - - - Send test notification - Learn how to set up a workflow and send your first email notification. - { - segment.track(OnBoardingAnalyticsEnum.ONBOARDING_EXPERIMENT_TEST_NOTIFICATION, { - action: 'Modal - Send test notification', - experiment_id: '2024-w15-onb', - _organization: currentOrganization?._id, - }); - localStorage.removeItem(OnboardingExperimentV2ModalKey); - createOnboardingExperimentWorkflow(); - }} - > - Send test notification now - - - - - - Look around - Start exploring the Novu app on your own terms - { - segment.track(OnBoardingAnalyticsEnum.ONBOARDING_EXPERIMENT_TEST_NOTIFICATION, { - action: 'Modal - Get started', - experiment_id: '2024-w15-onb', - _organization: currentOrganization?._id, - }); - localStorage.removeItem(OnboardingExperimentV2ModalKey); - setOpened(false); - }} - > - Get started - - - - - - ); -} - -const ChannelCard = styled.div` - display: flex; - justify-content: space-between; - flex-direction: column; - max-width: 230px; -`; - -const TitleRow = styled.div` - display: flex; - align-items: center; - font-size: 20px; - line-height: 32px; - margin-bottom: 8px; -`; - -const Description = styled.div` - flex: auto; - font-size: 16px; - line-height: 20px; - margin-bottom: 20px; - color: ${colors.B60}; - height: 60px; -`; - -const StyledButton = styled(Button)` - width: fit-content; - outline: none; -`; diff --git a/apps/web/src/pages/quick-start/steps/GetStarted.tsx b/apps/web/src/pages/quick-start/steps/GetStarted.tsx index 93e88d1f2ae..a008af10015 100644 --- a/apps/web/src/pages/quick-start/steps/GetStarted.tsx +++ b/apps/web/src/pages/quick-start/steps/GetStarted.tsx @@ -9,9 +9,6 @@ import { ChannelsConfiguration } from '../components/ChannelsConfiguration'; import { GetStartedLayout } from '../components/layout/GetStartedLayout'; import { NavButton } from '../components/NavButton'; import { getStartedSteps, OnBoardingAnalyticsEnum } from '../consts'; -import { OnboardingExperimentModal } from '../components/OnboardingExperimentModal'; -import { useAuthContext } from '@novu/shared-web'; -import { OnboardingExperimentV2ModalKey } from '../../../constants/experimentsConstants'; const ChannelsConfigurationHolder = styled.div` display: flex; @@ -28,20 +25,17 @@ const ChannelsConfigurationHolder = styled.div` export function GetStarted() { const segment = useSegment(); - const { currentOrganization } = useAuthContext(); + const [clickedChannel, setClickedChannel] = useState<{ open: boolean; channelType?: ChannelTypeEnum; }>({ open: false }); - const isOnboardingModalEnabled = - localStorage.getItem(OnboardingExperimentV2ModalKey) === 'true' && window.innerWidth > 768; - const onIntegrationModalClose = () => setClickedChannel({ open: false }); useEffect(() => { segment.track(OnBoardingAnalyticsEnum.CONFIGURE_PROVIDER_VISIT); - }, [currentOrganization?._id, isOnboardingModalEnabled, segment]); + }, [segment]); function handleOnClick() { segment.track(OnBoardingAnalyticsEnum.CONFIGURE_PROVIDER_NAVIGATION_NEXT_PAGE_CLICK); @@ -67,7 +61,6 @@ export function GetStarted() { /> - {isOnboardingModalEnabled && } ); }