From e6810f76a28a125e2ddc1b768943dd1e2b616d65 Mon Sep 17 00:00:00 2001 From: Ramya krishna Date: Fri, 19 Jul 2024 16:57:01 +0530 Subject: [PATCH 1/8] changes --- .../components/NewfoldInterfaceSkeleton/SiteBuild/index.js | 6 +++++- src/OnboardingSPA/steps/SiteGen/Migration/index.js | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js index c05242715..98f276165 100644 --- a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js +++ b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js @@ -64,6 +64,7 @@ import { ACTION_MIGRATION_INITIATED, ACTION_PAGEVIEW, CATEGORY, + ACTION_MFE_MIGRATION_INITIATED, } from '../../../utils/analytics/hiive/constants'; import { socialMediaStoreToState } from '../../SocialMediaForm/utils'; @@ -122,6 +123,7 @@ const SiteBuild = () => { const [ isRequestPlaced, setIsRequestPlaced ] = useState( false ); const [ didVisitBasicInfo, setDidVisitBasicInfo ] = useState( false ); const [ didVisitEcommerce, setDidVisitEcommerce ] = useState( false ); + const [ isMfeMigrationInitiated, setIsMfeMigrationInitiated ] = useState( false ); const { setActiveChapter, flushQueue, @@ -339,6 +341,7 @@ const SiteBuild = () => { }; const trackChapters = () => { + console.count("tracking"); trackInstaWpMigrationEvent(); if ( location.pathname === firstStep.path ) { trackOnboardingEvent( @@ -389,7 +392,7 @@ const SiteBuild = () => { if ( instaWpMigrationUrl ) { sendOnboardingEvent( new OnboardingEvent( - ACTION_MIGRATION_INITIATED, + isMfeMigrationInitiated ? ACTION_MFE_MIGRATION_INITIATED : ACTION_MIGRATION_INITIATED, instaWpMigrationUrl ) ); @@ -403,6 +406,7 @@ const SiteBuild = () => { // Track Migration Initated Event in the Migration Step. useEffect( () => { + getSettings().then(res => setIsMfeMigrationInitiated(res.nfd_migrate_site)) trackInstaWpMigrationEvent(); }, [ instaWpMigrationUrl ] ); diff --git a/src/OnboardingSPA/steps/SiteGen/Migration/index.js b/src/OnboardingSPA/steps/SiteGen/Migration/index.js index 18bed6976..68e6505ef 100644 --- a/src/OnboardingSPA/steps/SiteGen/Migration/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Migration/index.js @@ -59,7 +59,7 @@ const StepSiteGenMigration = () => { if ( migrateUrl ) { setInstaWpMigrationUrl( migrateUrl ); setTimeout( () => { - window.open( migrateUrl, '_self' ); + // window.open( migrateUrl, '_self' ); }, 3000 ); } else { trackOnboardingEvent( From f20a110e00a08647abf131c61c3d4e88b2edd6c7 Mon Sep 17 00:00:00 2001 From: Ramya krishna Date: Mon, 22 Jul 2024 11:26:15 +0530 Subject: [PATCH 2/8] linting fixes --- .../SiteBuild/index.js | 257 +++++++++--------- .../utils/analytics/hiive/constants.js | 59 ++-- 2 files changed, 158 insertions(+), 158 deletions(-) diff --git a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js index 98f276165..e4bd2e63b 100644 --- a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js +++ b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteBuild/index.js @@ -71,8 +71,8 @@ import { socialMediaStoreToState } from '../../SocialMediaForm/utils'; const SiteBuild = () => { const location = useLocation(); - const isLargeViewport = useViewportMatch( 'medium' ); - const pathname = kebabCase( location.pathname ); + const isLargeViewport = useViewportMatch('medium'); + const pathname = kebabCase(location.pathname); const { isDrawerOpen, @@ -91,39 +91,38 @@ const SiteBuild = () => { pluginInstallHash, instaWpMigrationUrl, } = useSelect( - ( select ) => { + (select) => { return { - isDrawerOpen: select( nfdOnboardingStore ).isDrawerOpened(), - newfoldBrand: select( nfdOnboardingStore ).getNewfoldBrand(), - onboardingFlow: - select( nfdOnboardingStore ).getOnboardingFlow(), + isDrawerOpen: select(nfdOnboardingStore).isDrawerOpened(), + newfoldBrand: select(nfdOnboardingStore).getNewfoldBrand(), + onboardingFlow: select(nfdOnboardingStore).getOnboardingFlow(), currentData: - select( nfdOnboardingStore ).getCurrentOnboardingData(), + select(nfdOnboardingStore).getCurrentOnboardingData(), socialData: - select( nfdOnboardingStore ).getOnboardingSocialData(), - firstStep: select( nfdOnboardingStore ).getFirstStep(), - allSteps: select( nfdOnboardingStore ).getAllSteps(), - topPriority: select( nfdOnboardingStore ).getTopPriority(), + select(nfdOnboardingStore).getOnboardingSocialData(), + firstStep: select(nfdOnboardingStore).getFirstStep(), + allSteps: select(nfdOnboardingStore).getAllSteps(), + topPriority: select(nfdOnboardingStore).getTopPriority(), experienceLevel: - select( nfdOnboardingStore ).getExperienceLevel(), - currentStep: select( nfdOnboardingStore ).getCurrentStep(), - lastChapter: select( nfdOnboardingStore ).getCurrentChapter(), - brandConfig: - select( nfdOnboardingStore ).getNewfoldBrandConfig(), - initialize: select( nfdOnboardingStore ).getInitialize(), + select(nfdOnboardingStore).getExperienceLevel(), + currentStep: select(nfdOnboardingStore).getCurrentStep(), + lastChapter: select(nfdOnboardingStore).getCurrentChapter(), + brandConfig: select(nfdOnboardingStore).getNewfoldBrandConfig(), + initialize: select(nfdOnboardingStore).getInitialize(), pluginInstallHash: - select( nfdOnboardingStore ).getPluginInstallHash(), + select(nfdOnboardingStore).getPluginInstallHash(), instaWpMigrationUrl: - select( nfdOnboardingStore ).getinstaWpMigrationUrl(), + select(nfdOnboardingStore).getinstaWpMigrationUrl(), }; }, - [ location.pathname ] + [location.pathname] ); - const [ isRequestPlaced, setIsRequestPlaced ] = useState( false ); - const [ didVisitBasicInfo, setDidVisitBasicInfo ] = useState( false ); - const [ didVisitEcommerce, setDidVisitEcommerce ] = useState( false ); - const [ isMfeMigrationInitiated, setIsMfeMigrationInitiated ] = useState( false ); + const [isRequestPlaced, setIsRequestPlaced] = useState(false); + const [didVisitBasicInfo, setDidVisitBasicInfo] = useState(false); + const [didVisitEcommerce, setDidVisitEcommerce] = useState(false); + const [isMfeMigrationInitiated, setIsMfeMigrationInitiated] = + useState(false); const { setActiveChapter, flushQueue, @@ -134,13 +133,13 @@ const SiteBuild = () => { updateTopSteps, updateDesignRoutes, setCurrentOnboardingData, - } = useDispatch( nfdOnboardingStore ); + } = useDispatch(nfdOnboardingStore); async function syncSocialSettings() { const initialData = await getSettings(); - const result = await setSettings( socialData ); - setDidVisitBasicInfo( false ); - if ( result?.error !== null ) { + const result = await setSettings(socialData); + setDidVisitBasicInfo(false); + if (result?.error !== null) { return initialData?.body; } return result?.body; @@ -149,7 +148,7 @@ const SiteBuild = () => { async function syncStoreDetails() { const { address } = currentData.storeDetails; let payload = {}; - if ( address !== undefined ) { + if (address !== undefined) { delete address.country; delete address.state; payload = address; @@ -159,87 +158,87 @@ const SiteBuild = () => { // delete tax.isStoreDetailsFilled; // payload = { ...payload, ...tax }; // } - if ( ! isEmpty( payload ) ) { - await updateWPSettings( payload ); + if (!isEmpty(payload)) { + await updateWPSettings(payload); } delete currentData.storeDetails.address; delete currentData.storeDetails.tax; - setDidVisitEcommerce( false ); + setDidVisitEcommerce(false); } async function syncStoreToDB() { // The First Welcome Step doesn't have any Store changes const isFirstStep = location?.pathname === firstStep?.path; - if ( currentData && ! isFirstStep ) { - if ( ! isRequestPlaced ) { - setIsRequestPlaced( true ); + if (currentData && !isFirstStep) { + if (!isRequestPlaced) { + setIsRequestPlaced(true); - if ( didVisitEcommerce ) { + if (didVisitEcommerce) { await syncStoreDetails(); } // If Social Data is changed then sync it - if ( didVisitBasicInfo ) { + if (didVisitBasicInfo) { const socialDataResp = await syncSocialSettings(); // If Social Data is changed then Sync that also to the store - if ( socialDataResp ) { - setOnboardingSocialData( socialDataResp ); + if (socialDataResp) { + setOnboardingSocialData(socialDataResp); } } flushQueue(); - enqueueRequest( API_REQUEST.SET_FLOW, () => - setFlow( currentData ) + enqueueRequest(API_REQUEST.SET_FLOW, () => + setFlow(currentData) ); - setIsRequestPlaced( false ); + setIsRequestPlaced(false); } } // Check if the Basic Info page was visited - if ( location?.pathname.includes( 'basic-info' ) ) { - setDidVisitBasicInfo( true ); + if (location?.pathname.includes('basic-info')) { + setDidVisitBasicInfo(true); } - if ( location?.pathname.includes( 'ecommerce' ) ) { - setDidVisitEcommerce( true ); + if (location?.pathname.includes('ecommerce')) { + setDidVisitEcommerce(true); } } function handleConditionalDesignStepsRoutes() { if ( - location?.pathname.includes( 'colors' ) || - location?.pathname.includes( 'typography' ) + location?.pathname.includes('colors') || + location?.pathname.includes('typography') ) { const updates = injectInAllSteps( allSteps, designChapter.conditionalSteps ); - updateAllSteps( updates.allSteps ); - if ( ! currentData.data.customDesign ) { + updateAllSteps(updates.allSteps); + if (!currentData.data.customDesign) { currentData.data.customDesign = true; - setCurrentOnboardingData( currentData ); + setCurrentOnboardingData(currentData); } } } const handlePreviousStepTracking = () => { const previousStep = window.nfdOnboarding?.previousStep; - if ( typeof previousStep !== 'object' ) { + if (typeof previousStep !== 'object') { window.nfdOnboarding.previousStep = { path: location.pathname, url: window.location.href, }; - HiiveAnalytics.dispatchEvents( CATEGORY ); + HiiveAnalytics.dispatchEvents(CATEGORY); return; } const previousStepPath = previousStep.path; const previousStepURL = previousStep.url; - if ( previousStepPath.includes( 'basic-info' ) ) { + if (previousStepPath.includes('basic-info')) { const siteTitle = currentData.data.blogName; const siteDescription = currentData.data.blogDescription; const siteLogo = currentData.data.siteLogo.url; - if ( siteTitle ) { + if (siteTitle) { trackOnboardingEvent( new OnboardingEvent( ACTION_SITE_TITLE_SET, @@ -250,7 +249,7 @@ const SiteBuild = () => { ); } - if ( siteDescription ) { + if (siteDescription) { trackOnboardingEvent( new OnboardingEvent( ACTION_TAGLINE_SET, @@ -261,7 +260,7 @@ const SiteBuild = () => { ); } - if ( siteLogo ) { + if (siteLogo) { trackOnboardingEvent( new OnboardingEvent( ACTION_LOGO_ADDED, @@ -272,11 +271,9 @@ const SiteBuild = () => { ); } - const platforms = Object.keys( - socialMediaStoreToState( socialData ) - ); - if ( platforms.length ) { - platforms.forEach( ( platform ) => { + const platforms = Object.keys(socialMediaStoreToState(socialData)); + if (platforms.length) { + platforms.forEach((platform) => { trackOnboardingEvent( new OnboardingEvent( ACTION_SOCIAL_ADDED, @@ -285,13 +282,13 @@ const SiteBuild = () => { previousStepURL ) ); - } ); + }); } } - if ( previousStepPath.includes( 'site-pages' ) ) { + if (previousStepPath.includes('site-pages')) { const sitePages = currentData.data.sitePages?.other; - if ( ! sitePages || false === sitePages ) { + if (!sitePages || false === sitePages) { trackOnboardingEvent( new OnboardingEvent( ACTION_STARTER_PAGES_SELECTED, @@ -306,7 +303,7 @@ const SiteBuild = () => { trackOnboardingEvent( new OnboardingEvent( ACTION_STARTER_PAGES_SELECTED, - sitePages.map( ( sitePage ) => sitePage.key ), + sitePages.map((sitePage) => sitePage.key), { count: sitePages.length, }, @@ -316,10 +313,10 @@ const SiteBuild = () => { } } - if ( previousStepPath.includes( 'site-features' ) ) { + if (previousStepPath.includes('site-features')) { const siteFeatures = currentData.data.siteFeatures; - for ( const siteFeature in siteFeatures ) { - if ( false !== siteFeatures[ siteFeature ] ) { + for (const siteFeature in siteFeatures) { + if (false !== siteFeatures[siteFeature]) { trackOnboardingEvent( new OnboardingEvent( ACTION_FEATURE_ADDED, @@ -337,24 +334,24 @@ const SiteBuild = () => { url: window.location.href, }; - HiiveAnalytics.dispatchEvents( CATEGORY ); + HiiveAnalytics.dispatchEvents(CATEGORY); }; const trackChapters = () => { - console.count("tracking"); + console.count('tracking'); trackInstaWpMigrationEvent(); - if ( location.pathname === firstStep.path ) { + if (location.pathname === firstStep.path) { trackOnboardingEvent( - new OnboardingEvent( ACTION_ONBOARDING_STARTED ) + new OnboardingEvent(ACTION_ONBOARDING_STARTED) ); } const currentChapter = currentStep?.chapter; - if ( lastChapter !== currentChapter ) { - if ( lastChapter ) { - if ( currentData.data.chapters[ lastChapter ] ) { - currentData.data.chapters[ lastChapter ].completed = true; + if (lastChapter !== currentChapter) { + if (lastChapter) { + if (currentData.data.chapters[lastChapter]) { + currentData.data.chapters[lastChapter].completed = true; } trackOnboardingEvent( new OnboardingEvent( @@ -364,11 +361,9 @@ const SiteBuild = () => { ); } - if ( currentChapter ) { - if ( currentData.data.chapters[ currentChapter ] ) { - currentData.data.chapters[ - currentChapter - ].completed = false; + if (currentChapter) { + if (currentData.data.chapters[currentChapter]) { + currentData.data.chapters[currentChapter].completed = false; } trackOnboardingEvent( new OnboardingEvent( @@ -378,21 +373,23 @@ const SiteBuild = () => { ); } - setActiveChapter( currentChapter ); + setActiveChapter(currentChapter); } - if ( currentChapter && currentData.data.chapters[ currentChapter ] ) { - currentData.data.chapters[ currentChapter ].lastStep = + if (currentChapter && currentData.data.chapters[currentChapter]) { + currentData.data.chapters[currentChapter].lastStep = currentStep?.path ?? ''; } }; const trackInstaWpMigrationEvent = () => { - if ( currentStep?.path === stepSiteGenMigration?.path ) { - if ( instaWpMigrationUrl ) { + if (currentStep?.path === stepSiteGenMigration?.path) { + if (instaWpMigrationUrl) { sendOnboardingEvent( new OnboardingEvent( - isMfeMigrationInitiated ? ACTION_MFE_MIGRATION_INITIATED : ACTION_MIGRATION_INITIATED, + isMfeMigrationInitiated + ? ACTION_MFE_MIGRATION_INITIATED + : ACTION_MIGRATION_INITIATED, instaWpMigrationUrl ) ); @@ -400,24 +397,26 @@ const SiteBuild = () => { } }; - useEffect( () => { + useEffect(() => { trackChapters(); - }, [ currentStep ] ); + }, [currentStep]); // Track Migration Initated Event in the Migration Step. - useEffect( () => { - getSettings().then(res => setIsMfeMigrationInitiated(res.nfd_migrate_site)) + useEffect(() => { + getSettings().then((res) => + setIsMfeMigrationInitiated(res.nfd_migrate_site) + ); trackInstaWpMigrationEvent(); - }, [ instaWpMigrationUrl ] ); + }, [instaWpMigrationUrl]); const prioritizeFlow = () => { const currentFlow = window.nfdOnboarding.currentFlow; - const initialChapters = getInitialChapters( currentFlow ); - const chapterQueryArg = getQueryParam( 'chapter' ); + const initialChapters = getInitialChapters(currentFlow); + const chapterQueryArg = getQueryParam('chapter'); let chapters; - if ( chapterQueryArg ) { - chapters = getChapterFromId( chapterQueryArg ); + if (chapterQueryArg) { + chapters = getChapterFromId(chapterQueryArg); } else { chapters = getChaptersFromTopPriorityAndExperienceLevel( initialChapters, @@ -426,8 +425,8 @@ const SiteBuild = () => { ); } - const getData = resolveGetDataForFlow( currentFlow ); - const data = getData( chapters, chapterQueryArg ); + const getData = resolveGetDataForFlow(currentFlow); + const data = getData(chapters, chapterQueryArg); currentData.data.chapters = stateToStore( initialChapters, @@ -435,41 +434,41 @@ const SiteBuild = () => { currentStep ); - setCurrentOnboardingData( currentData ); - updateAllSteps( data.steps ); - updateTopSteps( data.topSteps ); - updateRoutes( data.routes ); - updateDesignRoutes( data.designRoutes ); + setCurrentOnboardingData(currentData); + updateAllSteps(data.steps); + updateTopSteps(data.topSteps); + updateRoutes(data.routes); + updateDesignRoutes(data.designRoutes); }; - useEffect( () => { - if ( initialize ) { - initializePlugins( pluginInstallHash ); + useEffect(() => { + if (initialize) { + initializePlugins(pluginInstallHash); initializeThemes(); initializeSettings(); - setInterval( cronTrigger, 45000 ); + setInterval(cronTrigger, 45000); } - }, [ initialize ] ); + }, [initialize]); - useEffect( () => { - if ( false !== brandConfig?.prioritization ) { + useEffect(() => { + if (false !== brandConfig?.prioritization) { return prioritizeFlow(); } - }, [ experienceLevel, topPriority ] ); + }, [experienceLevel, topPriority]); - useEffect( () => { - document.body.classList.add( `nfd-brand-${ newfoldBrand }` ); - }, [ newfoldBrand ] ); + useEffect(() => { + document.body.classList.add(`nfd-brand-${newfoldBrand}`); + }, [newfoldBrand]); - useEffect( () => { + useEffect(() => { syncStoreToDB(); handlePreviousStepTracking(); handleConditionalDesignStepsRoutes(); - }, [ location.pathname, onboardingFlow ] ); + }, [location.pathname, onboardingFlow]); - useEffect( () => { - sendOnboardingEvent( new OnboardingEvent( ACTION_PAGEVIEW ) ); - }, [ location.pathname ] ); + useEffect(() => { + sendOnboardingEvent(new OnboardingEvent(ACTION_PAGEVIEW)); + }, [location.pathname]); const isForkStep = currentStep === stepTheFork || @@ -486,11 +485,11 @@ const SiteBuild = () => { const commonSkeletonProps = { className: classNames( 'nfd-onboarding-skeleton', - `brand-${ newfoldBrand }`, - `path-${ pathname }`, + `brand-${newfoldBrand}`, + `path-${pathname}`, { 'is-drawer-open': isDrawerOpen }, { 'is-large-viewport': isLargeViewport }, - { 'is-small-viewport': ! isLargeViewport }, + { 'is-small-viewport': !isLargeViewport }, { 'nfd-onboarding-skeleton--sitegen': isForkStep } ), header:
, @@ -500,18 +499,18 @@ const SiteBuild = () => { footer: isForkStep ?