From 64209de7237ecbd0de17d4c41cc2facd479d024e Mon Sep 17 00:00:00 2001 From: ajayadav09 Date: Tue, 20 Feb 2024 17:29:49 +0530 Subject: [PATCH 1/6] remooved building step --- src/OnboardingSPA/chapters/sitegen.js | 2 -- .../NewfoldInterfaceSkeleton/SiteGen/index.js | 17 ++++++----------- 2 files changed, 6 insertions(+), 13 deletions(-) diff --git a/src/OnboardingSPA/chapters/sitegen.js b/src/OnboardingSPA/chapters/sitegen.js index faaf53ad6..1a93c73ff 100644 --- a/src/OnboardingSPA/chapters/sitegen.js +++ b/src/OnboardingSPA/chapters/sitegen.js @@ -6,7 +6,6 @@ import { stepSiteGenSiteDetails } from '../steps/SiteGen/SiteDetails/step'; import { stepSiteGenSiteLogo } from '../steps/SiteGen/SiteLogo/step'; import { stepSiteGenSocialMedia } from '../steps/SiteGen/SocialMedia/step'; import { stepSiteGenExperience } from '../steps/SiteGen/Experience/step'; -import { stepSiteGenBuilding } from '../steps/SiteGen/Building/step'; import { stepSiteGenPreview } from '../steps/SiteGen/Preview/step'; import { stepSiteGenEditor } from '../steps/SiteGen/Editor/step'; @@ -16,7 +15,6 @@ const steps = [ stepSiteGenSocialMedia, stepSiteGenSiteLogo, stepSiteGenExperience, - stepSiteGenBuilding, stepSiteGenPreview, stepSiteGenEditor, ]; diff --git a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js index 1b28cdd1c..39fcd8f52 100644 --- a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js +++ b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js @@ -119,24 +119,16 @@ const SiteGen = () => { async function generateSiteGenData() { // Start the API Requests when the loader is shown. - if ( - ! ( - location.pathname.includes( 'experience' ) || - location.pathname.includes( 'building' ) - ) - ) { + if ( ! location.pathname.includes( 'experience' ) ) { return; } let identifiers = await getSiteGenIdentifiers(); identifiers = identifiers.body; - const midIndex = Math.floor( identifiers.length / 2 ); + const midIndex = Math.floor( identifiers.length ); if ( location.pathname.includes( 'experience' ) ) { identifiers = identifiers.slice( 0, midIndex ); currentData.sitegen.siteGenMetaStatus.currentStatus = 0; - } else if ( location.pathname.includes( 'building' ) ) { - identifiers = identifiers.slice( midIndex ); - currentData.sitegen.siteGenMetaStatus.currentStatus = midIndex; } setCurrentOnboardingData( currentData ); const siteInfo = { @@ -181,7 +173,10 @@ const SiteGen = () => { }, [ location.pathname ] ); useEffect( () => { - if ( prevSiteGenErrorStatus.current === true && siteGenErrorStatus === false ) { + if ( + prevSiteGenErrorStatus.current === true && + siteGenErrorStatus === false + ) { generateSiteGenData(); syncStoreToDB(); } From b9f9bcf362d37b4447f0658c789c0b6786b44c00 Mon Sep 17 00:00:00 2001 From: ajayadav09 Date: Tue, 20 Feb 2024 18:51:30 +0530 Subject: [PATCH 2/6] upadted preview step --- .../NewfoldInterfaceSkeleton/SiteGen/index.js | 2 +- .../steps/SiteGen/Preview/index.js | 77 ++++++++++++++++++- 2 files changed, 74 insertions(+), 5 deletions(-) diff --git a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js index 39fcd8f52..24f4a155f 100644 --- a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js +++ b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js @@ -125,7 +125,7 @@ const SiteGen = () => { let identifiers = await getSiteGenIdentifiers(); identifiers = identifiers.body; - const midIndex = Math.floor( identifiers.length ); + const midIndex = Math.floor( identifiers.length / 2 ); if ( location.pathname.includes( 'experience' ) ) { identifiers = identifiers.slice( 0, midIndex ); currentData.sitegen.siteGenMetaStatus.currentStatus = 0; diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/index.js b/src/OnboardingSPA/steps/SiteGen/Preview/index.js index 030a782ec..4a5af4d1c 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Preview/index.js @@ -6,12 +6,17 @@ import { cloneDeep, isEmpty } from 'lodash'; import CommonLayout from '../../../components/Layouts/Common'; import { store as nfdOnboardingStore } from '../../../store'; -import { HEADER_SITEGEN } from '../../../../constants'; +import { HEADER_SITEGEN, MAX_RETRIES_SITE_GEN } from '../../../../constants'; import { SiteGenPreviewSelectableCard } from '../../../components/LivePreview'; import getContents from './contents'; import HeartAnimation from './heartAnimation'; import RegeneratingSiteCard from './regeneratingCard'; -import { getHomepages, regenerateHomepage } from '../../../utils/api/siteGen'; +import { + getHomepages, + regenerateHomepage, + generateSiteGenMeta, + getSiteGenIdentifiers, +} from '../../../utils/api/siteGen'; import { getGlobalStyles } from '../../../utils/api/themes'; import SitegenAiStateHandler from '../../../components/StateHandlers/SitegenAi'; @@ -47,6 +52,13 @@ const SiteGenPreview = () => { } ); + // Define fetchData outside of useEffect + async function fetchPreviewData() { + await generateSiteGenData(); + loadHomepages(); + loadGlobalStyles(); + } + useEffect( () => { setIsHeaderEnabled( true ); setHideFooterNav( true ); @@ -67,6 +79,64 @@ const SiteGenPreview = () => { prevSiteGenErrorStatus.current = siteGenErrorStatus; }, [ siteGenErrorStatus ] ); + async function performSiteGenMetaGeneration( + siteInfo, + identifier, + skipCache, + retryCount = 1 + ) { + try { + const data = await generateSiteGenMeta( + siteInfo, + identifier, + skipCache + ); + if ( data.body !== null ) { + currentData.sitegen.siteGenMetaStatus.currentStatus += 1; + if ( + currentData.sitegen.siteGenMetaStatus.currentStatus === + currentData.sitegen.siteGenMetaStatus.totalCount + ) { + currentData.sitegen.skipCache = false; + } + setCurrentOnboardingData( currentData ); + } + } catch ( err ) { + if ( retryCount < MAX_RETRIES_SITE_GEN ) { + performSiteGenMetaGeneration( + siteInfo, + identifier, + skipCache, + retryCount + 1 + ); + } else { + updateSiteGenErrorStatus( true ); + } + } + } + + async function generateSiteGenData() { + setIsPreviewLoading( true ); + // Start the API Requests when the loader is shown. + let identifiers = await getSiteGenIdentifiers(); + identifiers = identifiers.body; + + const midIndex = Math.floor( identifiers.length / 2 ); + identifiers = identifiers.slice( midIndex, identifiers.length ); + currentData.sitegen.siteGenMetaStatus.currentStatus = midIndex; + setCurrentOnboardingData( currentData ); + const siteInfo = { + site_description: currentData.sitegen?.siteDetails?.prompt, + }; + + const skipCache = currentData.sitegen?.skipCache; + + // Iterate over Identifiers and fire Requests! + identifiers.forEach( ( identifier ) => { + performSiteGenMetaGeneration( siteInfo, identifier, skipCache ); + } ); + } + const loadHomepages = async () => { setIsPreviewLoading( true ); if ( ! isEmpty( currentData.sitegen.homepages.data ) ) { @@ -105,8 +175,7 @@ const SiteGenPreview = () => { }; useEffect( () => { - loadHomepages(); - loadGlobalStyles(); + fetchPreviewData(); }, [] ); const handlePreview = ( slug ) => { From 7da20d10f9a2a84653f3a64b55ec07e51e9ec491 Mon Sep 17 00:00:00 2001 From: ajayadav09 Date: Wed, 21 Feb 2024 12:00:36 +0530 Subject: [PATCH 3/6] changed total count --- src/OnboardingSPA/components/Loaders/SiteGenLoader/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/OnboardingSPA/components/Loaders/SiteGenLoader/index.js b/src/OnboardingSPA/components/Loaders/SiteGenLoader/index.js index 94cd18a97..dcf576d7f 100644 --- a/src/OnboardingSPA/components/Loaders/SiteGenLoader/index.js +++ b/src/OnboardingSPA/components/Loaders/SiteGenLoader/index.js @@ -33,9 +33,10 @@ const SiteGenLoader = ( { autoNavigate = false } ) => { }, [] ); useEffect( () => { + /* Divided the totalCount by 2 to complete the progress bar in the experience step */ const percentageValue = ( currentData?.sitegen?.siteGenMetaStatus?.currentStatus / - currentData?.sitegen?.siteGenMetaStatus?.totalCount ) * + ( currentData?.sitegen?.siteGenMetaStatus?.totalCount / 2 ) ) * 100; setPercentage( percentageValue ); }, [ currentData?.sitegen?.siteGenMetaStatus?.currentStatus ] ); From a8ff043af63bc301707214240302bdfa4457d2f9 Mon Sep 17 00:00:00 2001 From: ajayadav09 Date: Wed, 21 Feb 2024 12:06:10 +0530 Subject: [PATCH 4/6] removed building step files --- .../steps/SiteGen/Building/index.js | 48 ----------- .../steps/SiteGen/Building/step.js | 18 ----- .../steps/SiteGen/Building/stylesheet.scss | 80 ------------------- src/OnboardingSPA/styles/app.scss | 1 - 4 files changed, 147 deletions(-) delete mode 100644 src/OnboardingSPA/steps/SiteGen/Building/index.js delete mode 100644 src/OnboardingSPA/steps/SiteGen/Building/step.js delete mode 100644 src/OnboardingSPA/steps/SiteGen/Building/stylesheet.scss diff --git a/src/OnboardingSPA/steps/SiteGen/Building/index.js b/src/OnboardingSPA/steps/SiteGen/Building/index.js deleted file mode 100644 index 87bb72cad..000000000 --- a/src/OnboardingSPA/steps/SiteGen/Building/index.js +++ /dev/null @@ -1,48 +0,0 @@ -import CommonLayout from '../../../components/Layouts/Common'; - -import { memo, useEffect } from '@wordpress/element'; - -import { useDispatch } from '@wordpress/data'; -import { store as nfdOnboardingStore } from '../../../store'; -import { HEADER_SITEGEN } from '../../../../constants'; - -import SiteGenLoader from '../../../components/Loaders/SiteGenLoader'; -import SitegenAiStateHandler from '../../../components/StateHandlers/SitegenAi'; - -const SiteGenBuilding = () => { - const { - setIsHeaderEnabled, - setSidebarActiveView, - setHeaderActiveView, - setDrawerActiveView, - } = useDispatch( nfdOnboardingStore ); - - useEffect( () => { - setIsHeaderEnabled( true ); - setSidebarActiveView( false ); - setHeaderActiveView( HEADER_SITEGEN ); - setDrawerActiveView( false ); - } ); - return ( - - -
-
-
-
-
-
-
-
-
- -
- - - ); -}; - -export default memo( SiteGenBuilding ); diff --git a/src/OnboardingSPA/steps/SiteGen/Building/step.js b/src/OnboardingSPA/steps/SiteGen/Building/step.js deleted file mode 100644 index 2cd24d672..000000000 --- a/src/OnboardingSPA/steps/SiteGen/Building/step.js +++ /dev/null @@ -1,18 +0,0 @@ -import { copy } from '@wordpress/icons'; -import { lazy } from '@wordpress/element'; -import { __ } from '@wordpress/i18n'; -import { Step } from '../../../data/models/Step'; - -const SiteGenBuilding = lazy( () => import( './index' ) ); - -export const stepSiteGenBuilding = new Step( { - path: '/sitegen/step/building', - title: __( 'Page Layouts', 'wp-module-onboarding' ), - Component: SiteGenBuilding, - icon: copy, - sidebars: { - LearnMore: { - SidebarComponents: [], - }, - }, -} ); diff --git a/src/OnboardingSPA/steps/SiteGen/Building/stylesheet.scss b/src/OnboardingSPA/steps/SiteGen/Building/stylesheet.scss deleted file mode 100644 index b698b0a4b..000000000 --- a/src/OnboardingSPA/steps/SiteGen/Building/stylesheet.scss +++ /dev/null @@ -1,80 +0,0 @@ -@property --angle { - inherits: true; - syntax: ""; - initial-value: 90deg; -} - -@keyframes borderRotate { - - 100% { - --angle: 360deg; - } -} - -.nfd-onboarding-step--site-gen__building { - margin: 20px; - padding: 20px; - position: relative; - display: flex; - place-content: center; - place-items: flex-start; -} - -.site-gen__building { - - &_skimmer { - max-width: 1800px; - - &--main { - margin-bottom: 30px; - background: rgba(var(--nfd-onboarding-primary-rgb), 0.05); - box-shadow: 0 4px 30px rgba(var(--nfd-onboarding-secondary-rgb), 0.1); - animation: borderRotate 3500ms infinite forwards; - border: 0.25px solid rgba(var(--nfd-onboarding-secondary-rgb), 0.26); - border-image: conic-gradient(from var(--angle), rgba(var(--nfd-onboarding-secondary-rgb), 0.26) calc(var(--angle) + 0.5deg), rgba(var(--nfd-onboarding-shimmer-color), 0.5) calc(var(--angle) + 1deg)) 30; - - @media (prefers-reduced-motion) { - animation: none !important; - } - } - - &--header { - height: 6vh; - width: 90vw; - min-height: 50px; - } - - &--body { - width: 90vw; - height: calc(56vh - 150px); - min-height: 250px; - } - - &--footer { - width: 90vw; - display: flex; - align-items: center; - flex-direction: row; - justify-content: space-between; - - &_left { - width: 45vw; - height: calc(38vh - 100px); - min-height: 150px; - } - - &_right { - width: 37vw; - height: calc(38vh - 100px); - min-height: 150px; - } - } - } - - &_loader__overlay { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } -} diff --git a/src/OnboardingSPA/styles/app.scss b/src/OnboardingSPA/styles/app.scss index 4b00aa040..61c55c74f 100644 --- a/src/OnboardingSPA/styles/app.scss +++ b/src/OnboardingSPA/styles/app.scss @@ -86,7 +86,6 @@ @import "../steps/SiteGen/SiteLogo/stylesheet"; @import "../steps/SiteGen/SocialMedia/stylesheet"; @import "../steps/SiteGen/Welcome/stylesheet"; -@import "../steps/SiteGen/Building/stylesheet"; @import "../steps/SiteGen/Editor/stylesheet"; @import "../steps/SiteGen/Editor/Header/stylesheet"; From 1362793d702abe48a5db0ab620071aba0f377ec3 Mon Sep 17 00:00:00 2001 From: ajayadav09 Date: Wed, 21 Feb 2024 14:25:40 +0530 Subject: [PATCH 5/6] error status check --- src/OnboardingSPA/steps/SiteGen/Preview/index.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/index.js b/src/OnboardingSPA/steps/SiteGen/Preview/index.js index 4a5af4d1c..eea2e4562 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Preview/index.js @@ -55,8 +55,13 @@ const SiteGenPreview = () => { // Define fetchData outside of useEffect async function fetchPreviewData() { await generateSiteGenData(); - loadHomepages(); - loadGlobalStyles(); + if ( ! siteGenErrorStatus ) { + console.log( 'Load homepages' ); + loadHomepages(); + loadGlobalStyles(); + } else { + console.log( 'Do not load home pages' ); + } } useEffect( () => { @@ -111,6 +116,7 @@ const SiteGenPreview = () => { ); } else { updateSiteGenErrorStatus( true ); + setIsPreviewLoading( false ); } } } From 209d3d110c309f57676dea67e79d9d738de3a157 Mon Sep 17 00:00:00 2001 From: "lokapure.girish" Date: Wed, 21 Feb 2024 15:25:46 +0530 Subject: [PATCH 6/6] code update for error state and retry only failed apis --- .../steps/SiteGen/Preview/index.js | 63 ++++++++++++------- 1 file changed, 40 insertions(+), 23 deletions(-) diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/index.js b/src/OnboardingSPA/steps/SiteGen/Preview/index.js index eea2e4562..da97a33e5 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Preview/index.js @@ -25,7 +25,9 @@ const SiteGenPreview = () => { const [ homepages, setHomepages ] = useState( false ); const [ isRegenerating, setIsRegenerating ] = useState( false ); const [ isPreviewLoading, setIsPreviewLoading ] = useState( false ); + const [ isMetaApiSuccess, setIsMetaApiSuccess ] = useState( false ); const [ globalStyles, setGlobalStyles ] = useState( false ); + const [ failedApi, setFailedApi ] = useState( [] ); const prevSiteGenErrorStatus = useRef(); @@ -52,18 +54,6 @@ const SiteGenPreview = () => { } ); - // Define fetchData outside of useEffect - async function fetchPreviewData() { - await generateSiteGenData(); - if ( ! siteGenErrorStatus ) { - console.log( 'Load homepages' ); - loadHomepages(); - loadGlobalStyles(); - } else { - console.log( 'Do not load home pages' ); - } - } - useEffect( () => { setIsHeaderEnabled( true ); setHideFooterNav( true ); @@ -73,13 +63,28 @@ const SiteGenPreview = () => { updateInitialize( true ); }, [ currentData ] ); + useEffect( () => { + generateSiteGenData(); + }, [] ); + + useEffect( () => { + if ( isMetaApiSuccess ) { + loadHomepages(); + loadGlobalStyles(); + } + }, [ isMetaApiSuccess ] ); + useEffect( () => { if ( prevSiteGenErrorStatus.current === true && siteGenErrorStatus === false ) { - loadHomepages(); - loadGlobalStyles(); + if ( ! isMetaApiSuccess ) { + generateSiteGenData(); + } else { + loadHomepages(); + loadGlobalStyles(); + } } prevSiteGenErrorStatus.current = siteGenErrorStatus; }, [ siteGenErrorStatus ] ); @@ -103,6 +108,7 @@ const SiteGenPreview = () => { currentData.sitegen.siteGenMetaStatus.totalCount ) { currentData.sitegen.skipCache = false; + setIsMetaApiSuccess( true ); } setCurrentOnboardingData( currentData ); } @@ -115,6 +121,13 @@ const SiteGenPreview = () => { retryCount + 1 ); } else { + setFailedApi( ( prevState ) => { + if ( ! prevState.includes( identifier ) ) { + return [ ...prevState, identifier ]; + } + return prevState; + } ); + currentData.sitegen.siteGenErrorStatus = true; updateSiteGenErrorStatus( true ); setIsPreviewLoading( false ); } @@ -124,12 +137,20 @@ const SiteGenPreview = () => { async function generateSiteGenData() { setIsPreviewLoading( true ); // Start the API Requests when the loader is shown. - let identifiers = await getSiteGenIdentifiers(); - identifiers = identifiers.body; - const midIndex = Math.floor( identifiers.length / 2 ); - identifiers = identifiers.slice( midIndex, identifiers.length ); - currentData.sitegen.siteGenMetaStatus.currentStatus = midIndex; + let identifiers; + if ( Array.isArray( failedApi ) && failedApi.length > 0 ) { + identifiers = failedApi; + setFailedApi( [] ); + } else { + identifiers = await getSiteGenIdentifiers(); + identifiers = identifiers.body; + + const midIndex = Math.floor( identifiers.length / 2 ); + identifiers = identifiers.slice( midIndex, identifiers.length ); + currentData.sitegen.siteGenMetaStatus.currentStatus = midIndex; + } + setCurrentOnboardingData( currentData ); const siteInfo = { site_description: currentData.sitegen?.siteDetails?.prompt, @@ -180,10 +201,6 @@ const SiteGenPreview = () => { setGlobalStyles( globalStylesResponse.body ); }; - useEffect( () => { - fetchPreviewData(); - }, [] ); - const handlePreview = ( slug ) => { if ( ! ( slug in homepages ) ) { return false;