From f3930a4de72395b5afddb4f8c2ac205827887cc8 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 12:41:43 +0530 Subject: [PATCH 01/23] Added Support for API Requests to be queued --- src/OnboardingSPA/store/actions.js | 20 ++++++++++++++ src/OnboardingSPA/store/reducer.js | 26 +++++++++++++++++-- src/OnboardingSPA/store/selectors.js | 10 +++++++ .../utils/api-queuer/api-executer.js | 8 ++++++ .../utils/api-queuer/constants.js | 2 ++ 5 files changed, 64 insertions(+), 2 deletions(-) create mode 100644 src/OnboardingSPA/utils/api-queuer/api-executer.js create mode 100644 src/OnboardingSPA/utils/api-queuer/constants.js diff --git a/src/OnboardingSPA/store/actions.js b/src/OnboardingSPA/store/actions.js index 9f80cb9ee..15b4150e4 100644 --- a/src/OnboardingSPA/store/actions.js +++ b/src/OnboardingSPA/store/actions.js @@ -138,3 +138,23 @@ export function updatePreviewSettings( previewSettings ) { previewSettings, }; } + +export function enqueueRequest( request ) { + return { + type: 'ENQUEUE_REQUEST', + request, + }; +} + +export function dequeueRequest() { + return { + type: 'DEQUEUE_REQUEST' + }; +} + +export function flushQueue( storeData ) { + return { + type: 'FLUSH_QUEUE', + storeData, + }; +} diff --git a/src/OnboardingSPA/store/reducer.js b/src/OnboardingSPA/store/reducer.js index cb2213f20..d5cf32837 100644 --- a/src/OnboardingSPA/store/reducer.js +++ b/src/OnboardingSPA/store/reducer.js @@ -1,6 +1,7 @@ import { combineReducers } from '@wordpress/data'; import { VIEW_NAV_PRIMARY } from '../../constants'; +import { apiExecuter } from '../utils/api-queuer/api-executer'; import { routes as initialRoutes, @@ -71,6 +72,7 @@ export function drawer( return state; } + export function currentData( state = {}, action ) { switch ( action.type ) { case 'SET_CURRENT_DATA': @@ -107,6 +109,25 @@ export function sidebar( return state; } +export function queue(state = [], action) { + switch (action.type) { + // Add a new API Request to the Queue + case 'ENQUEUE_REQUEST': + return [...state, action.request]; + + // Take out the topmost Queue Item + case 'DEQUEUE_REQUEST': + return [...state.slice(1)]; + + // Make all the Queue Requests and Empty the queue + case 'FLUSH_QUEUE': + apiExecuter(action.storeData, state); + return []; + } + + return state; +} + export function runtime( state = {}, action ) { switch ( action.type ) { case 'SET_RUNTIME': @@ -136,11 +157,12 @@ export function settings( state = {}, action ) { return state; } -export default combineReducers( { +export default combineReducers({ drawer, runtime, currentData, settings, flow, sidebar, -} ); + queue, +}); diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index ea6dd57eb..3bd9103b1 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -83,6 +83,16 @@ export function getOnboardingFlow( state ) { return state.runtime.currentFlow ?? 'wp-setup'; } +/** + * Gets the Queue Element on top + * + * @param {*} state + * @return string + */ +export function getQueuePeek(state) { + return state?.queue[0] ?? null; +} + /** * Gets steps to display in drawer. * diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js new file mode 100644 index 000000000..3dbfdec9e --- /dev/null +++ b/src/OnboardingSPA/utils/api-queuer/api-executer.js @@ -0,0 +1,8 @@ +import { FLOW_SYNC, SETTINGS_SYNC } from './constants'; + +// This Function is responsible to execute requests in a sequence +export async function apiExecuter(storeData, requests) { + + // Get all the Requests in the Queue + console.log(requests); +} diff --git a/src/OnboardingSPA/utils/api-queuer/constants.js b/src/OnboardingSPA/utils/api-queuer/constants.js new file mode 100644 index 000000000..9fe4bc7eb --- /dev/null +++ b/src/OnboardingSPA/utils/api-queuer/constants.js @@ -0,0 +1,2 @@ +export const FLOW_SYNC = 'FLOW_SYNC'; +export const SETTINGS_SYNC = 'SETTINGS_SYNC'; From 92debbb88025654e2cccd94cea030441be998a6b Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 12:48:03 +0530 Subject: [PATCH 02/23] Added API Queuer to Basic Info Page --- src/OnboardingSPA/pages/Steps/BasicInfo/index.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index 072a052c6..5c744ef30 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -6,22 +6,27 @@ import { store as nfdOnboardingStore } from '../../../store'; import { useSelect, useDispatch } from '@wordpress/data'; import { useEffect } from '@wordpress/element'; import { useViewportMatch } from '@wordpress/compose'; +import { FLOW_SYNC, SETTINGS_SYNC } from '../../../utils/api-queuer/constants'; const StepBasicInfo = () => { const isLargeViewport = useViewportMatch( 'medium' ); - const { setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = + const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep } = useSelect( + const { currentStep, currentData } = useSelect( (select) => { return { - currentStep: select(nfdOnboardingStore).getCurrentStep() + currentStep: select(nfdOnboardingStore).getCurrentStep(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingData() }; }, [] ); useEffect( () => { + flushQueue(currentData); + enqueueRequest(FLOW_SYNC); + enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); } From 3f3d285afe7c922e21ea4891d878f09e16ba4f84 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 12:50:14 +0530 Subject: [PATCH 03/23] added API Queuer Support to Get Started Experience page --- .../pages/Steps/GetStarted/GetStartedExperience/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 7730415ec..68f568f86 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -6,6 +6,8 @@ import NeedHelpTag from '../../../../components/NeedHelpTag'; import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; import { store as nfdOnboardingStore } from '../../../../store'; import content from './content.json'; +import { FLOW_SYNC } from '../../../../utils/api-queuer/constants'; + import { RadioControl } from '@wordpress/components'; import { useState, useEffect } from '@wordpress/element'; import { useDispatch, useSelect } from '@wordpress/data'; @@ -21,7 +23,7 @@ const GetStartedExperience = () => { const [ isLoaded, setisLoaded ] = useState( false ); const [ wpComfortLevel, setWpComfortLevel ] = useState( '0' ); - const { setCurrentOnboardingData } = useDispatch( nfdOnboardingStore ); + const { enqueueRequest, flushQueue, setCurrentOnboardingData } = useDispatch( nfdOnboardingStore ); const { currentData, currentStep } = useSelect( ( select ) => { return { @@ -37,6 +39,8 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { + flushQueue(currentData); + enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); From 3d3e310e8da7b6f694d276b4abe90045730346d8 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 12:52:11 +0530 Subject: [PATCH 04/23] Added API Queuer Support for Get Started Welcome Page --- src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 2e1fbea6d..4aaba4e1b 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,22 +22,25 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, brandName } = useSelect( + const { currentStep, currentData, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, [location.pathname] ); const { + flushQueue, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); useEffect( () => { + flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); From 58768a76d466f89516b35a28597fccd6625cbd5b Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 12:55:12 +0530 Subject: [PATCH 05/23] Added API Queuer Support for Get Started Primary and Secondary Page --- .../SiteTypeSetup/PrimarySite/index.js | 5 ++- .../SiteTypeSetup/SecondarySite/index.js | 32 +++++++++++-------- 2 files changed, 22 insertions(+), 15 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 04ba89845..2e873134f 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -10,11 +10,12 @@ import NavCardButton from '../../../../../components/Button/NavCardButton'; import NeedHelpTag from '../../../../../components/NeedHelpTag'; import content from '../content.json'; import { translations } from '../../../../../utils/locales/translations'; +import { FLOW_SYNC } from '../../../../../utils/api-queuer/constants'; const StepPrimarySetup = () => { - const { setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( + const { enqueueRequest, flushQueue, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); @@ -29,6 +30,8 @@ const StepPrimarySetup = () => { ); useEffect(() => { + flushQueue(currentData); + enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); setDrawerActiveView(VIEW_NAV_GET_STARTED); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index 408bfdf5a..d9296d3d6 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -10,14 +10,28 @@ import NavCardButton from '../../../../../components/Button/NavCardButton'; import NeedHelpTag from '../../../../../components/NeedHelpTag'; import content from '../content.json'; import { translations } from '../../../../../utils/locales/translations'; - +import { FLOW_SYNC } from '../../../../../utils/api-queuer/constants'; const StepPrimarySetup = () => { - const { setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( - nfdOnboardingStore - ); + const { enqueueRequest, + flushQueue, + setDrawerActiveView, + setIsSidebarOpened, + setIsDrawerSuppressed, + setCurrentOnboardingData + } + = useDispatch( nfdOnboardingStore ); + + const { currentStep, currentData } = useSelect((select) => { + return { + currentStep: select(nfdOnboardingStore).getCurrentStep(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + }; + }, []); useEffect(() => { + flushQueue(currentData); + enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); setDrawerActiveView(VIEW_NAV_GET_STARTED); @@ -26,16 +40,6 @@ const StepPrimarySetup = () => { const [clickedIndex, changeCategory] = useState(-1); const [inputCategVal, changeInputCateg] = useState(''); - - const { setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); - - const { currentStep, currentData } = useSelect((select) => { - return { - currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() - }; - }, []); - const selectedCategoryInStore = currentData?.data?.siteType?.secondary; const categoriesArray = content.categories; const subCategories = categoriesArray[0]?.subCategories; From 1db76ed976c9867d8add997d8f29494f69b3df70 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 13:08:16 +0530 Subject: [PATCH 06/23] Added API Queuer Support for Design Theme --- src/OnboardingSPA/pages/Steps/DesignThemes/index.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index ab6d8a9aa..edf258e9d 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -2,14 +2,21 @@ import CommonLayout from '../../../components/Layouts/Common'; import StepOverview from '../../../components/StepOverview'; import { VIEW_DESIGN_THEMES } from '../../../../constants'; import { store as nfdOnboardingStore } from '../../../store'; -import { useDispatch } from '@wordpress/data'; +import { useDispatch, useSelect } from '@wordpress/data'; import { useEffect } from '@wordpress/element'; const StepDesignThemes = () => { - const { setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = + const { flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = useDispatch( nfdOnboardingStore ); + const { currentData } = useSelect((select) => { + return { + currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + }; + }, []); + useEffect( () => { + flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerOpened( true ); setDrawerActiveView( VIEW_DESIGN_THEMES ); From bd07a4a86ded77d041d236e9286c25edc1655145 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Fri, 19 Aug 2022 13:08:22 +0530 Subject: [PATCH 07/23] Added API Queuer Support for Top Priority --- src/OnboardingSPA/pages/Steps/TopPriority/index.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 96b19dd0c..2d190069d 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -8,6 +8,7 @@ import { store as nfdOnboardingStore } from '../../../store'; import CommonLayout from '../../../components/Layouts/Common'; import HeadingWithSubHeading from '../../../components/HeadingWithSubHeading'; import SelectableCardList from '../../../components/SelectableCardList/selectable-card-list'; +import { FLOW_SYNC } from '../../../utils/api-queuer/constants'; const StepTopPriority = ( props ) => { const priorityTypes = { @@ -40,6 +41,8 @@ const StepTopPriority = ( props ) => { const isLargeViewport = useViewportMatch( 'medium' ); const { + enqueueRequest, + flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened, @@ -61,6 +64,8 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { + flushQueue(currentData); + enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); } From 110c759a4410b751ed1109a3b7a60b283697b9df Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 08:37:10 +0530 Subject: [PATCH 08/23] Added API Queuer support to Ecommerce Steps --- src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js | 2 ++ src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js | 2 ++ src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js | 2 ++ 3 files changed, 6 insertions(+) diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 33c51908e..bcaded9ee 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -16,6 +16,7 @@ import { useWPSettings } from '../useWPSettings'; const StepAddress = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { + flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -24,6 +25,7 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index be825792f..25163f012 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -15,6 +15,7 @@ import content from '../content.json'; const StepProducts = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { + flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -27,6 +28,7 @@ const StepProducts = () => { ); let productInfo = currentData.storeDetails.productInfo; useEffect(() => { + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 8239a0a0e..5a92a8819 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -21,6 +21,7 @@ function createReverseLookup(state) { const StepTax = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { + flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -34,6 +35,7 @@ const StepTax = () => { ); useEffect(() => { + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } From 33d8dfc25a25a0ef872e80ee93bc62d0f2a0f246 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 08:40:04 +0530 Subject: [PATCH 09/23] added API requests to the api-executer function --- src/OnboardingSPA/utils/api-queuer/api-executer.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js index 3dbfdec9e..42cc9d984 100644 --- a/src/OnboardingSPA/utils/api-queuer/api-executer.js +++ b/src/OnboardingSPA/utils/api-queuer/api-executer.js @@ -1,8 +1,18 @@ +import { setFlow } from '../api/flow'; +import { setSettings } from '../api/settings'; import { FLOW_SYNC, SETTINGS_SYNC } from './constants'; // This Function is responsible to execute requests in a sequence export async function apiExecuter(storeData, requests) { - // Get all the Requests in the Queue - console.log(requests); + requests.forEach(request => { + switch (request) { + case FLOW_SYNC: setFlow(storeData); + break; + case SETTINGS_SYNC: setSettings(storeData?.data?.socialData); + break; + default: + break; + } + }); } From 6d7d182166eed286c2766e348a12d70ec4a3a883 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 08:47:09 +0530 Subject: [PATCH 10/23] Removed earlier based API Requests from App.js component --- src/OnboardingSPA/components/App/index.js | 52 +++-------------------- 1 file changed, 5 insertions(+), 47 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index d19b8ddf8..4d68e5eb7 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -4,8 +4,6 @@ import Drawer from '../Drawer'; import Sidebar from '../Sidebar'; import classNames from 'classnames'; import { useLocation } from 'react-router-dom'; -import { setFlow } from '../../utils/api/flow'; -import { getSettings, setSettings } from '../../utils/api/settings'; import { isEmpty, updateWPSettings } from '../../utils/api/ecommerce'; import { store as nfdOnboardingStore } from '../../store'; @@ -44,21 +42,8 @@ const App = () => { }; }, []); - const [isRequestPlaced, setIsRequestPlaced] = useState(false); - const [didVisitBasicInfo, setDidVisitBasicInfo] = useState(false); const [didVisitEcommerce, setDidVisitEcommerce] = useState(false); - const { setActiveStep, setActiveFlow, setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); - - async function syncSocialSettings() { - const initialData = await getSettings(); - const result = await setSettings(currentData?.data?.socialData); - setDidVisitBasicInfo(false); - if (result?.error != null) { - console.error('Unable to Save Social Data!'); - return initialData?.body; - } - return result?.body; - } + const { setActiveStep, setActiveFlow } = useDispatch(nfdOnboardingStore); async function syncStoreDetails() { let { address, tax } = currentData.storeDetails; @@ -90,39 +75,12 @@ const App = () => { } 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 (didVisitEcommerce) { - await syncStoreDetails(); - } - - // If Social Data is changed then sync it - if (didVisitBasicInfo){ - const socialData = await syncSocialSettings(); - - // If Social Data is changed then Sync that also to the store - if (socialData && currentData?.data) - currentData.data.socialData = socialData; - } - - const result = await setFlow(currentData); - if (result?.error != null) { - setIsRequestPlaced(false); - console.error('Unable to Save data!'); - } else { - setCurrentOnboardingData(result?.body); - setIsRequestPlaced(false); - } - + if ( currentData ){ + if (didVisitEcommerce) { + await syncStoreDetails(); } } - // Check if the Basic Info page was visited - if (location?.pathname.includes('basic-info')) - setDidVisitBasicInfo(true); + if (location?.pathname.includes('ecommerce')) { setDidVisitEcommerce(true); } From b3e1e57582e506470db15f78cfcef0004e280804 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 10:18:57 +0530 Subject: [PATCH 11/23] Removed Default primary and secondary types in Flows.php --- includes/Data/Flows.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/includes/Data/Flows.php b/includes/Data/Flows.php index 0440570ee..201ae68c1 100644 --- a/includes/Data/Flows.php +++ b/includes/Data/Flows.php @@ -28,8 +28,8 @@ final class Flows { 'siteType' => array( 'label' => '', 'referTo' => 'site', - 'primary' => 'primaryCategory', - 'secondary' => 'secondaryCategory', + 'primary' => '', + 'secondary' => '', ), 'wpComfortLevel' => '0', From e0c6e06177585f5c861cf256fc3b6947145f39e2 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 12:45:24 +0530 Subject: [PATCH 12/23] Extracted Social Media out of CurrentData --- src/OnboardingSPA/components/App/index.js | 27 ++++++++++------ .../components/ExitToWordPress/index.js | 2 +- .../components/Header/step-navigation.js | 2 +- .../components/MiniPreview/index.js | 31 ++++++++++--------- .../components/SkipButton/index.js | 2 +- .../components/SocialMediaForm/index.js | 28 ++++++++--------- src/OnboardingSPA/index.js | 18 ++++++++--- .../pages/Steps/BasicInfo/basicInfoForm.js | 24 +++++++------- .../Steps/Ecommerce/StepAddress/index.js | 8 ++--- .../Steps/Ecommerce/StepProducts/index.js | 8 ++--- .../pages/Steps/Ecommerce/StepTax/index.js | 8 ++--- .../GetStarted/GetStartedExperience/index.js | 6 ++-- .../SiteTypeSetup/PrimarySite/index.js | 8 ++--- .../SiteTypeSetup/SecondarySite/index.js | 8 ++--- .../pages/Steps/TopPriority/index.js | 8 ++--- src/OnboardingSPA/store/actions.js | 17 ++++++++-- src/OnboardingSPA/store/reducer.js | 21 ++++++++++--- src/OnboardingSPA/store/selectors.js | 17 ++++++++-- 18 files changed, 149 insertions(+), 94 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index 50e32d63a..fb0bcea8c 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -33,13 +33,15 @@ const App = () => { newfoldBrand, onboardingFlow, currentData, + socialData, firstStep } = useSelect((select) => { return { isDrawerOpen: select(nfdOnboardingStore).isDrawerOpened(), newfoldBrand: select(nfdOnboardingStore).getNewfoldBrand(), onboardingFlow: select(nfdOnboardingStore).getOnboardingFlow(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData(), firstStep: select(nfdOnboardingStore).getFirstStep(), }; }, []); @@ -47,11 +49,16 @@ const App = () => { const [isRequestPlaced, setIsRequestPlaced] = useState(false); const [didVisitBasicInfo, setDidVisitBasicInfo] = useState(false); const [didVisitEcommerce, setDidVisitEcommerce] = useState(false); - const { setActiveStep, setActiveFlow, setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); + const { + setActiveStep, + setActiveFlow, + setCurrentOnboardingFlowData, + setCurrentOnboardingSocialData + } = useDispatch(nfdOnboardingStore); async function syncSocialSettings() { const initialData = await getSettings(); - const result = await setSettings(currentData?.data?.socialData); + const result = await setSettings(socialData); setDidVisitBasicInfo(false); if (result?.error != null) { console.error('Unable to Save Social Data!'); @@ -61,7 +68,7 @@ const App = () => { } async function syncStoreDetails() { - let { address, tax } = currentData.storeDetails; + let { address, tax } = currentData?.storeDetails; let payload = {}; if (address !== undefined) { delete address.country; @@ -86,8 +93,8 @@ const App = () => { if (!isEmpty(payload)) { await updateWPSettings(payload); } - delete currentData.storeDetails.address; - delete currentData.storeDetails.tax; + delete currentData?.storeDetails?.address; + delete currentData?.storeDetails?.tax; setDidVisitEcommerce(false); } @@ -104,11 +111,11 @@ const App = () => { // If Social Data is changed then sync it if (didVisitBasicInfo){ - const socialData = await syncSocialSettings(); + const socialDataToBeSaved = await syncSocialSettings(); // If Social Data is changed then Sync that also to the store - if (socialData && currentData?.data) - currentData.data.socialData = socialData; + if (socialDataToBeSaved && currentData?.data) + setCurrentOnboardingSocialData(socialDataToBeSaved); } const result = await setFlow(currentData); @@ -116,7 +123,7 @@ const App = () => { setIsRequestPlaced(false); console.error('Unable to Save data!'); } else { - setCurrentOnboardingData(result?.body); + setCurrentOnboardingFlowData(result?.body); setIsRequestPlaced(false); } diff --git a/src/OnboardingSPA/components/ExitToWordPress/index.js b/src/OnboardingSPA/components/ExitToWordPress/index.js index cddfd1a45..b03a5ab8a 100644 --- a/src/OnboardingSPA/components/ExitToWordPress/index.js +++ b/src/OnboardingSPA/components/ExitToWordPress/index.js @@ -34,7 +34,7 @@ const ExitToWordPress = ({ const { currentData } = useSelect( (select) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/Header/step-navigation.js b/src/OnboardingSPA/components/Header/step-navigation.js index 8632fe5e7..8430987bd 100644 --- a/src/OnboardingSPA/components/Header/step-navigation.js +++ b/src/OnboardingSPA/components/Header/step-navigation.js @@ -102,7 +102,7 @@ const StepNavigation = () => { return { nextStep: select(nfdOnboardingStore).getNextStep(), previousStep: select(nfdOnboardingStore).getPreviousStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/MiniPreview/index.js b/src/OnboardingSPA/components/MiniPreview/index.js index 890b9985c..72d963e7a 100644 --- a/src/OnboardingSPA/components/MiniPreview/index.js +++ b/src/OnboardingSPA/components/MiniPreview/index.js @@ -24,19 +24,20 @@ const MiniPreview = ({ title, desc, icon, socialData }) => { const [tiktok, setTikTok] = useState(""); useEffect(() => { - setFacebook((socialData?.facebook_site) ?? ""); - setTwitter(socialData?.twitter_site ?? ""); - setInstagram(socialData?.instagram_url ?? ""); - setYouTube(socialData?.youtube_url ?? ""); - setLinkedIn(socialData?.linkedin_url ?? ""); - if (Object.keys(socialData).includes("other_social_urls")) - { - const otherURLS = socialData.other_social_urls; - if (Object.keys(otherURLS).includes("yelp_url")) - setYelp(otherURLS["yelp_url"] ?? ""); + if( socialData ) { + setFacebook((socialData?.facebook_site) ?? ""); + setTwitter(socialData?.twitter_site ?? ""); + setInstagram(socialData?.instagram_url ?? ""); + setYouTube(socialData?.youtube_url ?? ""); + setLinkedIn(socialData?.linkedin_url ?? ""); + if (Object.keys(socialData).includes("other_social_urls")) { + const otherURLS = socialData.other_social_urls; + if (Object.keys(otherURLS).includes("yelp_url")) + setYelp(otherURLS["yelp_url"] ?? ""); - if (Object.keys(otherURLS).includes("tiktok_url")) - setTikTok(otherURLS["tiktok_url"] ?? ""); + if (Object.keys(otherURLS).includes("tiktok_url")) + setTikTok(otherURLS["tiktok_url"] ?? ""); + } } }, [socialData]); @@ -70,11 +71,13 @@ const MiniPreview = ({ title, desc, icon, socialData }) => { function socialIconList() { var socialIconList = [] - socialDataset.map( (socialInfo) => { + if (socialDataset) { + socialDataset.map( (socialInfo) => { !socialInfo.url || socialIconList.push(
) - }) + }) + } return socialIconList; } diff --git a/src/OnboardingSPA/components/SkipButton/index.js b/src/OnboardingSPA/components/SkipButton/index.js index 0f48ccd48..2dad4088e 100644 --- a/src/OnboardingSPA/components/SkipButton/index.js +++ b/src/OnboardingSPA/components/SkipButton/index.js @@ -22,7 +22,7 @@ const SkipButton = () => { return { previousStep: select(nfdOnboardingStore).getPreviousStep(), nextStep: select(nfdOnboardingStore).getNextStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [] diff --git a/src/OnboardingSPA/components/SocialMediaForm/index.js b/src/OnboardingSPA/components/SocialMediaForm/index.js index 01bd9206f..6b9394cec 100644 --- a/src/OnboardingSPA/components/SocialMediaForm/index.js +++ b/src/OnboardingSPA/components/SocialMediaForm/index.js @@ -49,21 +49,21 @@ const SocialMediaForm = ({ socialData, setSocialData, setIsValidSocials }) => { } useEffect(() => { - setFacebook(socialData?.facebook_site ?? ""); - setTwitter(socialData?.twitter_site ?? ""); - setInstagram(socialData?.instagram_url ?? ""); - setYouTube(socialData?.youtube_url ?? ""); - setLinkedIn(socialData?.linkedin_url ?? ""); - if (Object.keys(socialData).includes("other_social_urls")) - { - const otherURLS = socialData.other_social_urls; - if (Object.keys(otherURLS).includes("yelp_url")) - setYelp(otherURLS["yelp_url"] ?? ""); - - if (Object.keys(otherURLS).includes("tiktok_url")) - setTikTok(otherURLS["tiktok_url"] ?? ""); + if( socialData ) { + setFacebook(socialData?.facebook_site ?? ""); + setTwitter(socialData?.twitter_site ?? ""); + setInstagram(socialData?.instagram_url ?? ""); + setYouTube(socialData?.youtube_url ?? ""); + setLinkedIn(socialData?.linkedin_url ?? ""); + if (Object.keys(socialData).includes("other_social_urls")) { + const otherURLS = socialData.other_social_urls; + if (Object.keys(otherURLS).includes("yelp_url")) + setYelp(otherURLS["yelp_url"] ?? ""); + + if (Object.keys(otherURLS).includes("tiktok_url")) + setTikTok(otherURLS["tiktok_url"] ?? ""); + } } - }, [socialData]); const isValidUrl = (urlString) => { diff --git a/src/OnboardingSPA/index.js b/src/OnboardingSPA/index.js index 09e69a177..c09c913f1 100644 --- a/src/OnboardingSPA/index.js +++ b/src/OnboardingSPA/index.js @@ -1,6 +1,7 @@ import './styles/app.scss'; import { store as nfdOnboardingStore } from './store'; /* must import prior to App! */ import { getFlow } from './utils/api/flow'; +import { getSettings } from './utils/api/settings'; import { init as initializePlugins } from './utils/api/plugins'; import { init as initializeThemes } from './utils/api/themes'; import { trigger as cronTrigger } from './utils/api/cronTrigger'; @@ -41,11 +42,18 @@ export async function initializeNFDOnboarding( id, runtime ) { const DOM_TARGET = document.getElementById( id ); dispatch( nfdOnboardingStore ).setRuntime( runtime ); - const currentData = await getFlow(); - if ( currentData.error == null ) { - currentData.body = initializeFlowData( currentData.body ); - dispatch( nfdOnboardingStore ).setCurrentOnboardingData( - currentData.body + const currentFlowData = await getFlow(); + if ( currentFlowData.error == null ) { + currentFlowData.body = initializeFlowData( currentFlowData.body ); + dispatch( nfdOnboardingStore ).setCurrentOnboardingFlowData( + currentFlowData.body + ); + } + + const socialData = await getSettings(); + if (socialData.error == null) { + dispatch(nfdOnboardingStore).setCurrentOnboardingSocialData( + socialData.body ); } diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js index 35aa5cf96..0591bd8c9 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js @@ -31,13 +31,14 @@ const BasicInfoForm = () => { const [siteTitle, setSiteTitle] = useState(""); const [siteDesc, setSiteDesc] = useState(""); const [siteLogo, setSiteLogo] = useState(0); - const [socialData, setSocialData] = useState(""); + const [localSocialData, setLocalSocialData] = useState(null); const [isValidSocials, setIsValidSocials] = useState(false); - const { setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); + const { setCurrentOnboardingFlowData, setCurrentOnboardingSocialData } = useDispatch(nfdOnboardingStore); - const { currentData } = useSelect((select) => { + const { currentData, socialData } = useSelect((select) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData() }; }, []); @@ -55,7 +56,7 @@ const BasicInfoForm = () => { "siteLogo": siteLogo, "blogName": siteTitle, "blogDescription": siteDesc, - "socialData": socialData, + "socialData": localSocialData, } } return dataToSave; @@ -63,8 +64,7 @@ const BasicInfoForm = () => { useEffect(() => { async function getFlowData() { - const socialDataAPI = await getSettings(); - setSocialData(socialDataAPI.body); + setLocalSocialData(socialData); setFlowData(currentData); setDebouncedFlowData(flowData); setisLoaded(true); @@ -84,7 +84,7 @@ const BasicInfoForm = () => { return () => { clearTimeout(timerId); }; - }, [siteTitle, siteDesc, siteLogo, socialData, isValidSocials]); + }, [siteTitle, siteDesc, siteLogo, localSocialData, isValidSocials]); useEffect(() => { const saveData = async () => { @@ -92,8 +92,8 @@ const BasicInfoForm = () => { currentDataCopy.data['siteLogo'] = debouncedFlowData.data['siteLogo'] ?? currentDataCopy.data['siteLogo']; currentDataCopy.data['blogName'] = debouncedFlowData.data['blogName'] ?? currentDataCopy.data['blogName']; currentDataCopy.data['blogDescription'] = debouncedFlowData.data['blogDescription'] ?? currentDataCopy.data['blogDescription']; - currentDataCopy.data['socialData'] = debouncedFlowData.data['socialData'] ?? currentDataCopy.data['socialData']; - setCurrentOnboardingData(currentDataCopy); + setCurrentOnboardingFlowData(currentDataCopy); + setCurrentOnboardingSocialData(debouncedFlowData.data['socialData'] ?? currentDataCopy.data['socialData']); }; if (debouncedFlowData) saveData(); }, [debouncedFlowData]); @@ -122,11 +122,11 @@ const BasicInfoForm = () => { maxCharacters={__(content.siteDesc["maxCharacters"], 'wp-module-onboarding')} height="100px" textValue={siteDesc} textValueSetter={setSiteDesc} /> - +
- +
diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 33c51908e..56dfb7250 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -20,7 +20,7 @@ const StepAddress = () => { setIsDrawerOpened, setIsDrawerSuppressed, setIsSidebarOpened, - setCurrentOnboardingData, + setCurrentOnboardingFlowData, } = useDispatch(nfdOnboardingStore); useEffect(() => { @@ -35,7 +35,7 @@ const StepAddress = () => { const navigate = useNavigate(); let currentData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); const settings = useWPSettings(); @@ -48,7 +48,7 @@ const StepAddress = () => { 'woocommerce_default_country' ]; if (settings !== null && currentData.storeDetails.address === undefined) { - setCurrentOnboardingData({ + setCurrentOnboardingFlowData({ storeDetails: { ...currentData.storeDetails, address: { @@ -89,7 +89,7 @@ const StepAddress = () => { ? `${newValue}:${state}` : `${country}:${newValue}`; } - setCurrentOnboardingData({ + setCurrentOnboardingFlowData({ storeDetails: { ...currentData.storeDetails, address: { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 00732c448..682209a4f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -19,11 +19,11 @@ const StepProducts = () => { setIsDrawerOpened, setIsDrawerSuppressed, setIsSidebarOpened, - setCurrentOnboardingData, + setCurrentOnboardingFLowData, } = useDispatch(nfdOnboardingStore); let currentData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); let productInfo = currentData.storeDetails.productInfo; useEffect(() => { @@ -36,7 +36,7 @@ const StepProducts = () => { }, []); const handleCheckbox = (value, checked) => - setCurrentOnboardingData({ + setCurrentOnboardingFLowData({ storeDetails: { ...currentData.storeDetails, productInfo: { @@ -49,7 +49,7 @@ const StepProducts = () => { }); const handleProductCount = (count) => - setCurrentOnboardingData({ + setCurrentOnboardingFLowData({ storeDetails: { ...currentData.storeDetails, productInfo: { ...productInfo, product_count: count }, diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 8239a0a0e..7742c87fb 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -25,12 +25,12 @@ const StepTax = () => { setIsDrawerOpened, setIsDrawerSuppressed, setIsSidebarOpened, - setCurrentOnboardingData, + setCurrentOnboardingFlowData, } = useDispatch(nfdOnboardingStore); const navigate = useNavigate(); let currentData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); useEffect(() => { @@ -49,7 +49,7 @@ const StepTax = () => { createReverseLookup(settings) ); let tax = selectedTaxOption?.data ?? {}; - setCurrentOnboardingData({ + setCurrentOnboardingFlowData({ storeDetails: { ...currentData.storeDetails, tax: { @@ -98,7 +98,7 @@ const StepTax = () => { let selectedOption = content.stepTaxOptions.find( (option) => option.value === value ); - setCurrentOnboardingData({ + setCurrentOnboardingFlowData({ storeDetails: { ...currentData.storeDetails, tax: { diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 7730415ec..a6b2edd71 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -21,11 +21,11 @@ const GetStartedExperience = () => { const [ isLoaded, setisLoaded ] = useState( false ); const [ wpComfortLevel, setWpComfortLevel ] = useState( '0' ); - const { setCurrentOnboardingData } = useDispatch( nfdOnboardingStore ); + const { setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); const { currentData, currentStep } = useSelect( ( select ) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), }; }, [] ); @@ -56,7 +56,7 @@ const GetStartedExperience = () => { const saveData = async () => { const currentDataCopy = currentData; currentDataCopy.data.wpComfortLevel = wpComfortLevel || '0'; - setCurrentOnboardingData( currentDataCopy ); + setCurrentOnboardingFlowData( currentDataCopy ); }; if ( isLoaded ) saveData(); }, [ wpComfortLevel ] ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 04ba89845..9347fbc6c 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -22,7 +22,7 @@ const StepPrimarySetup = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, [] @@ -36,7 +36,7 @@ const StepPrimarySetup = () => { const [clickedIndex, changeCategory] = useState(-1); const [inputCategVal, changeInputCateg] = useState(''); - const { setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); + const { setCurrentOnboardingFlowData } = useDispatch(nfdOnboardingStore); const categoriesArray = content.categories; const selectedPrimaryCategoryInStore = currentData?.data?.siteType?.primary; @@ -54,7 +54,7 @@ const StepPrimarySetup = () => { changeInputCateg(''); const currentDataCopy = currentData; currentDataCopy.data.siteType['primary'] = content.categories[idxOfElm]?.name; - setCurrentOnboardingData(currentDataCopy); + setCurrentOnboardingFlowData(currentDataCopy); } /** Function which saves data in redux when category name is put-in via input box */ @@ -63,7 +63,7 @@ const StepPrimarySetup = () => { changeInputCateg(input?.target?.value); const currentDataCopy = currentData; currentDataCopy.data.siteType['primary'] = input?.target?.value; - setCurrentOnboardingData(currentDataCopy); + setCurrentOnboardingFlowData(currentDataCopy); } return ( diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index b57d6fd9d..45a4dab21 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -27,12 +27,12 @@ const StepPrimarySetup = () => { const [inputCategVal, changeInputCateg] = useState(''); - const { setCurrentOnboardingData } = useDispatch(nfdOnboardingStore); + const { setCurrentOnboardingFlowData } = useDispatch(nfdOnboardingStore); const { currentStep, currentData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, []); @@ -51,7 +51,7 @@ const StepPrimarySetup = () => { changeInputCateg(input?.target?.value); const currentDataCopy = currentData; currentDataCopy.data.siteType['secondary'] = input?.target?.value; - setCurrentOnboardingData(currentDataCopy); + setCurrentOnboardingFlowData(currentDataCopy); } /** Function which saves data in redux when category name is chosen via categories displayed */ @@ -60,7 +60,7 @@ const StepPrimarySetup = () => { changeInputCateg(''); const currentDataCopy = currentData; currentDataCopy.data.siteType['secondary'] = categoriesArray[0]?.subCategories[idxOfElm]; - setCurrentOnboardingData(currentDataCopy); + setCurrentOnboardingFlowData(currentDataCopy); } return ( diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index ce88f95e6..5e940ad78 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -45,14 +45,14 @@ const StepTopPriority = ( props ) => { setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened, - setCurrentOnboardingData, + setCurrentOnboardingFlowData, setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); const { currentStep, currentData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select( nfdOnboardingStore ).getCurrentOnboardingData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [] ); @@ -80,7 +80,7 @@ const StepTopPriority = ( props ) => { else { currentData.data.topPriority.priority1 = priorityTypes[ selected ]; - setCurrentOnboardingData( currentData ); + setCurrentOnboardingFlowData( currentData ); } } setisLoaded( true ); @@ -91,7 +91,7 @@ const StepTopPriority = ( props ) => { useEffect( () => { if ( isLoaded ) { currentData.data.topPriority.priority1 = priorityTypes[ selected ]; - setCurrentOnboardingData( currentData ); + setCurrentOnboardingFlowData( currentData ); } }, [ selected ] ); diff --git a/src/OnboardingSPA/store/actions.js b/src/OnboardingSPA/store/actions.js index 9f80cb9ee..f26be51a4 100644 --- a/src/OnboardingSPA/store/actions.js +++ b/src/OnboardingSPA/store/actions.js @@ -98,13 +98,26 @@ export function setActiveStep( path ) { * @param {*} currentData * @returns */ -export function setCurrentOnboardingData(currentData) { +export function setCurrentOnboardingFlowData(currentData) { return { - type: 'SET_CURRENT_DATA', + type: 'SET_CURRENT_FLOW_DATA', currentData, }; } +/** + * Accepts a JSON to set the social data. + * + * @param {*} currentData + * @returns + */ +export function setCurrentOnboardingSocialData(socialData) { + return { + type: 'SET_CURRENT_SOCIAL_DATA', + socialData, + }; +} + /** * Updates general settings. * diff --git a/src/OnboardingSPA/store/reducer.js b/src/OnboardingSPA/store/reducer.js index cb2213f20..c5a5a4854 100644 --- a/src/OnboardingSPA/store/reducer.js +++ b/src/OnboardingSPA/store/reducer.js @@ -71,12 +71,25 @@ export function drawer( return state; } -export function currentData( state = {}, action ) { + +export function data( state = { + currentData: null, + socialData: null +}, action ) { switch ( action.type ) { - case 'SET_CURRENT_DATA': + case 'SET_CURRENT_FLOW_DATA': + return { + ...state, + currentData: { + ...action.currentData + }, + }; + case 'SET_CURRENT_SOCIAL_DATA': return { ...state, - ...action.currentData, + socialData: { + ...action.socialData + }, }; } @@ -139,7 +152,7 @@ export function settings( state = {}, action ) { export default combineReducers( { drawer, runtime, - currentData, + data, settings, flow, sidebar, diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index ea6dd57eb..191818d7d 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -64,15 +64,26 @@ export function getHireExpertsUrl( state ) { } /** - * Gets the current Onboarding Data + * Gets the current Onboarding Flow Data * * @param {*} state * @return string */ -export function getCurrentOnboardingData( state ) { - return state.currentData; +export function getCurrentOnboardingFlowData( state ) { + return state.data.currentData; } +/** + * Gets the current Onboarding Social Data + * + * @param {*} state + * @return string + */ +export function getCurrentOnboardingSocialData(state) { + return state.data.socialData; +} + + /** * Gets current Onboarding Flow * From 1b87e2d5e59910ab6f5ac73997d00f656ad4015e Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 13:09:18 +0530 Subject: [PATCH 13/23] Refactored currentData to flowData --- .gitignore | 1 + src/OnboardingSPA/components/App/index.js | 16 +++++------ .../components/ExitToWordPress/index.js | 24 ++++++++-------- .../components/Header/step-navigation.js | 28 +++++++++---------- .../components/SkipButton/index.js | 24 ++++++++-------- src/OnboardingSPA/index.js | 8 +++--- .../pages/Steps/BasicInfo/basicInfoForm.js | 18 ++++++------ .../Steps/Ecommerce/StepAddress/index.js | 16 +++++------ .../Steps/Ecommerce/StepProducts/index.js | 8 +++--- .../pages/Steps/Ecommerce/StepTax/index.js | 14 +++++----- .../GetStarted/GetStartedExperience/index.js | 8 +++--- .../SiteTypeSetup/PrimarySite/index.js | 10 +++---- .../SiteTypeSetup/SecondarySite/index.js | 10 +++---- .../pages/Steps/TopPriority/index.js | 16 +++++------ src/OnboardingSPA/store/actions.js | 8 +++--- src/OnboardingSPA/store/reducer.js | 6 ++-- src/OnboardingSPA/store/selectors.js | 2 +- 17 files changed, 109 insertions(+), 108 deletions(-) diff --git a/.gitignore b/.gitignore index c30a19820..69e666c6d 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +build node_modules vendor .DS_Store \ No newline at end of file diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index fb0bcea8c..0695b1c88 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -32,7 +32,7 @@ const App = () => { isDrawerOpen, newfoldBrand, onboardingFlow, - currentData, + flowData, socialData, firstStep } = useSelect((select) => { @@ -40,7 +40,7 @@ const App = () => { isDrawerOpen: select(nfdOnboardingStore).isDrawerOpened(), newfoldBrand: select(nfdOnboardingStore).getNewfoldBrand(), onboardingFlow: select(nfdOnboardingStore).getOnboardingFlow(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData(), firstStep: select(nfdOnboardingStore).getFirstStep(), }; @@ -68,7 +68,7 @@ const App = () => { } async function syncStoreDetails() { - let { address, tax } = currentData?.storeDetails; + let { address, tax } = flowData?.storeDetails; let payload = {}; if (address !== undefined) { delete address.country; @@ -93,15 +93,15 @@ const App = () => { if (!isEmpty(payload)) { await updateWPSettings(payload); } - delete currentData?.storeDetails?.address; - delete currentData?.storeDetails?.tax; + delete flowData?.storeDetails?.address; + delete flowData?.storeDetails?.tax; 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 (flowData && !isFirstStep){ if(!isRequestPlaced){ setIsRequestPlaced(true); @@ -114,11 +114,11 @@ const App = () => { const socialDataToBeSaved = await syncSocialSettings(); // If Social Data is changed then Sync that also to the store - if (socialDataToBeSaved && currentData?.data) + if (socialDataToBeSaved && flowData?.data) setCurrentOnboardingSocialData(socialDataToBeSaved); } - const result = await setFlow(currentData); + const result = await setFlow(flowData); if (result?.error != null) { setIsRequestPlaced(false); console.error('Unable to Save data!'); diff --git a/src/OnboardingSPA/components/ExitToWordPress/index.js b/src/OnboardingSPA/components/ExitToWordPress/index.js index b03a5ab8a..afd52cbac 100644 --- a/src/OnboardingSPA/components/ExitToWordPress/index.js +++ b/src/OnboardingSPA/components/ExitToWordPress/index.js @@ -31,10 +31,10 @@ const ExitToWordPress = ({ const closeModal = () => setIsOpen(false); const location = useLocation(); - const { currentData } = useSelect( + const { flowData } = useSelect( (select) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [location.pathname] @@ -45,9 +45,9 @@ const ExitToWordPress = ({ 'wp-module-onboarding' ); - async function syncSocialSettingsFinish(currentData) { + async function syncSocialSettingsFinish(flowData) { const initialData = await getSettings(); - const result = await setSettings(currentData?.data?.socialData); + const result = await setSettings(flowData?.data?.socialData); if (result?.error != null) { console.error('Unable to Save Social Data!'); return initialData?.body; @@ -55,20 +55,20 @@ const ExitToWordPress = ({ return result?.body; } - async function saveData(path, currentData) { + async function saveData(path, flowData) { - if (currentData) { - currentData.hasExited = new Date().getTime(); + if (flowData) { + flowData.hasExited = new Date().getTime(); // If Social Data is changed then sync it if (path?.includes('basic-info')) { - const socialData = await syncSocialSettingsFinish(currentData); + const socialData = await syncSocialSettingsFinish(flowData); // If Social Data is changed then Sync that also to the store - if (socialData && currentData?.data) - currentData.data.socialData = socialData; + if (socialData && flowData?.data) + flowData.data.socialData = socialData; } - setFlow(currentData); + setFlow(flowData); } //Redirect to Admin Page for normal customers // and Bluehost Dashboard for ecommerce customers @@ -98,7 +98,7 @@ const ExitToWordPress = ({ diff --git a/src/OnboardingSPA/components/Header/step-navigation.js b/src/OnboardingSPA/components/Header/step-navigation.js index 8430987bd..d22a8be0a 100644 --- a/src/OnboardingSPA/components/Header/step-navigation.js +++ b/src/OnboardingSPA/components/Header/step-navigation.js @@ -47,9 +47,9 @@ const Next = ({ path }) => { ); }; -async function syncSocialSettingsFinish( currentData ) { +async function syncSocialSettingsFinish( flowData ) { const initialData = await getSettings(); - const result = await setSettings(currentData?.data?.socialData); + const result = await setSettings(flowData?.data?.socialData); if (result?.error != null) { console.error('Unable to Save Social Data!'); return initialData?.body; @@ -57,19 +57,19 @@ async function syncSocialSettingsFinish( currentData ) { return result?.body; } -async function saveData(path, currentData) { +async function saveData(path, flowData) { - if (currentData) { - currentData.isComplete = new Date().getTime(); + if (flowData) { + flowData.isComplete = new Date().getTime(); // If Social Data is changed then sync it if (path?.includes('basic-info')) { - const socialData = await syncSocialSettingsFinish(currentData); + const socialData = await syncSocialSettingsFinish(flowData); // If Social Data is changed then Sync that also to the store - if (socialData && currentData?.data) - currentData.data.socialData = socialData; + if (socialData && flowData?.data) + flowData.data.socialData = socialData; } - setFlow(currentData); + setFlow(flowData); } //Redirect to Admin Page for normal customers // and Bluehost Dashboard for ecommerce customers @@ -81,9 +81,9 @@ async function saveData(path, currentData) { * Finish step navigation button. * @returns */ -const Finish = ({ path, currentData, saveData }) => ( +const Finish = ({ path, flowData, saveData }) => ( ); diff --git a/src/OnboardingSPA/index.js b/src/OnboardingSPA/index.js index c09c913f1..1e19ac31f 100644 --- a/src/OnboardingSPA/index.js +++ b/src/OnboardingSPA/index.js @@ -23,10 +23,10 @@ const NFDOnboarding = () => ( ); -const initializeFlowData = ( currentData ) => { - currentData.hasExited = false; - currentData.isComplete = false; - return currentData; +const initializeFlowData = ( flowData ) => { + flowData.hasExited = false; + flowData.isComplete = false; + return flowData; }; /** diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js index 0591bd8c9..5c92e1a0a 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js @@ -24,7 +24,7 @@ const BasicInfoForm = () => { const navigate = useNavigate(); const [isError, setIsError] = useState(false); - const [flowData, setFlowData] = useState(); + const [localFlowData, setFlowData] = useState(); const [isLoaded, setisLoaded] = useState(false); const [debouncedFlowData, setDebouncedFlowData] = useState(); @@ -35,18 +35,18 @@ const BasicInfoForm = () => { const [isValidSocials, setIsValidSocials] = useState(false); const { setCurrentOnboardingFlowData, setCurrentOnboardingSocialData } = useDispatch(nfdOnboardingStore); - const { currentData, socialData } = useSelect((select) => { + const { flowData, socialData } = useSelect((select) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData() }; }, []); function setDefaultData() { if(isLoaded) { - setSiteLogo(flowData?.data['siteLogo']); - setSiteTitle(flowData?.data['blogName']); - setSiteDesc(flowData?.data['blogDescription']); + setSiteLogo(localFlowData?.data['siteLogo']); + setSiteTitle(localFlowData?.data['blogName']); + setSiteDesc(localFlowData?.data['blogDescription']); } } @@ -65,8 +65,8 @@ const BasicInfoForm = () => { useEffect(() => { async function getFlowData() { setLocalSocialData(socialData); - setFlowData(currentData); - setDebouncedFlowData(flowData); + setFlowData(flowData); + setDebouncedFlowData(localFlowData); setisLoaded(true); } if (!isLoaded) @@ -88,7 +88,7 @@ const BasicInfoForm = () => { useEffect(() => { const saveData = async () => { - var currentDataCopy = currentData; + var currentDataCopy = flowData; currentDataCopy.data['siteLogo'] = debouncedFlowData.data['siteLogo'] ?? currentDataCopy.data['siteLogo']; currentDataCopy.data['blogName'] = debouncedFlowData.data['blogName'] ?? currentDataCopy.data['blogName']; currentDataCopy.data['blogDescription'] = debouncedFlowData.data['blogDescription'] ?? currentDataCopy.data['blogDescription']; diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 56dfb7250..92a697227 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -34,7 +34,7 @@ const StepAddress = () => { const navigate = useNavigate(); - let currentData = useSelect((select) => + let flowData = useSelect((select) => select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); @@ -47,12 +47,12 @@ const StepAddress = () => { 'woocommerce_store_postcode', 'woocommerce_default_country' ]; - if (settings !== null && currentData.storeDetails.address === undefined) { + if (settings !== null && flowData.storeDetails.address === undefined) { setCurrentOnboardingFlowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, address: { - ...(currentData.storeDetails.address ?? {}), + ...(flowData.storeDetails.address ?? {}), ...addressKeys.reduce( (address, key) => ({ ...address, [key]: settings[key] }), {} @@ -61,9 +61,9 @@ const StepAddress = () => { }, }); } - }, [settings, currentData.storeDetails]); + }, [settings, flowData.storeDetails]); - let { address } = currentData.storeDetails; + let { address } = flowData.storeDetails; const fieldProps = { disabled: settings === null, onChange: handleFieldChange, @@ -91,9 +91,9 @@ const StepAddress = () => { } setCurrentOnboardingFlowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, address: { - ...currentData.storeDetails.address, + ...flowData.storeDetails.address, [fieldName]: newValue, ...(place !== "" && { woocommerce_default_country: place, diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 682209a4f..edaa26c31 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -22,10 +22,10 @@ const StepProducts = () => { setCurrentOnboardingFLowData, } = useDispatch(nfdOnboardingStore); - let currentData = useSelect((select) => + let flowData = useSelect((select) => select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); - let productInfo = currentData.storeDetails.productInfo; + let productInfo = flowData.storeDetails.productInfo; useEffect(() => { if (isLargeViewport) { setIsDrawerOpened(true); @@ -38,7 +38,7 @@ const StepProducts = () => { const handleCheckbox = (value, checked) => setCurrentOnboardingFLowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, productInfo: { ...productInfo, product_types: checked @@ -51,7 +51,7 @@ const StepProducts = () => { const handleProductCount = (count) => setCurrentOnboardingFLowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, productInfo: { ...productInfo, product_count: count }, }, }); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 7742c87fb..60356033f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -29,7 +29,7 @@ const StepTax = () => { } = useDispatch(nfdOnboardingStore); const navigate = useNavigate(); - let currentData = useSelect((select) => + let flowData = useSelect((select) => select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); @@ -44,16 +44,16 @@ const StepTax = () => { const settings = useWPSettings(); useEffect(() => { - if (settings !== null && currentData.storeDetails.tax === undefined) { + if (settings !== null && flowData.storeDetails.tax === undefined) { let selectedTaxOption = content.stepTaxOptions.find( createReverseLookup(settings) ); let tax = selectedTaxOption?.data ?? {}; setCurrentOnboardingFlowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, tax: { - ...(currentData.storeDetails.tax ?? {}), + ...(flowData.storeDetails.tax ?? {}), ...tax, option: selectedTaxOption?.value, isStoreDetailsFilled: settings.woocommerce_store_postcode !== null, @@ -61,8 +61,8 @@ const StepTax = () => { }, }); } - }, [settings, currentData.storeDetails]); - let { tax } = currentData.storeDetails; + }, [settings, flowData.storeDetails]); + let { tax } = flowData.storeDetails; const handleButtonClick = () => { //Commented as auto-calculate tax option is removed for MMP // let isAddressNeeded = tax?.option === "1" && !tax.isStoreDetailsFilled; @@ -100,7 +100,7 @@ const StepTax = () => { ); setCurrentOnboardingFlowData({ storeDetails: { - ...currentData.storeDetails, + ...flowData.storeDetails, tax: { ...selectedOption.data, option: selectedOption.value, diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index a6b2edd71..81a05d62c 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -23,9 +23,9 @@ const GetStartedExperience = () => { const { setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); - const { currentData, currentStep } = useSelect( ( select ) => { + const { flowData, currentStep } = useSelect( ( select ) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), }; }, [] ); @@ -44,7 +44,7 @@ const GetStartedExperience = () => { useEffect( () => { async function getFlowData() { - setWpComfortLevel( currentData.data.wpComfortLevel ); + setWpComfortLevel( flowData.data.wpComfortLevel ); setisLoaded( true ); } if ( ! isLoaded ) { @@ -54,7 +54,7 @@ const GetStartedExperience = () => { useEffect( () => { const saveData = async () => { - const currentDataCopy = currentData; + const currentDataCopy = flowData; currentDataCopy.data.wpComfortLevel = wpComfortLevel || '0'; setCurrentOnboardingFlowData( currentDataCopy ); }; diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 9347fbc6c..916fa7dad 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -18,11 +18,11 @@ const StepPrimarySetup = () => { nfdOnboardingStore ); - const { currentStep, currentData } = useSelect( + const { currentStep, flowData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, [] @@ -39,7 +39,7 @@ const StepPrimarySetup = () => { const { setCurrentOnboardingFlowData } = useDispatch(nfdOnboardingStore); const categoriesArray = content.categories; - const selectedPrimaryCategoryInStore = currentData?.data?.siteType?.primary; + const selectedPrimaryCategoryInStore = flowData?.data?.siteType?.primary; /**This condition fills the data in input box if the saved category isn't a subcategory from the content*/ if (selectedPrimaryCategoryInStore && !inputCategVal) { @@ -52,7 +52,7 @@ const StepPrimarySetup = () => { const handleCategoryClick = (idxOfElm) => { changeCategory(idxOfElm); changeInputCateg(''); - const currentDataCopy = currentData; + const currentDataCopy = flowData; currentDataCopy.data.siteType['primary'] = content.categories[idxOfElm]?.name; setCurrentOnboardingFlowData(currentDataCopy); } @@ -61,7 +61,7 @@ const StepPrimarySetup = () => { const categoryInput = input => { changeCategory(-1); changeInputCateg(input?.target?.value); - const currentDataCopy = currentData; + const currentDataCopy = flowData; currentDataCopy.data.siteType['primary'] = input?.target?.value; setCurrentOnboardingFlowData(currentDataCopy); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index 45a4dab21..09f8a782c 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -29,14 +29,14 @@ const StepPrimarySetup = () => { const { setCurrentOnboardingFlowData } = useDispatch(nfdOnboardingStore); - const { currentStep, currentData } = useSelect((select) => { + const { currentStep, flowData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, []); - const selectedCategoryInStore = currentData?.data?.siteType?.secondary; + const selectedCategoryInStore = flowData?.data?.siteType?.secondary; const categoriesArray = content.categories; const subCategories = categoriesArray[0]?.subCategories; @@ -49,7 +49,7 @@ const StepPrimarySetup = () => { const categoryInput = input => { changeCategory(-1); changeInputCateg(input?.target?.value); - const currentDataCopy = currentData; + const currentDataCopy = flowData; currentDataCopy.data.siteType['secondary'] = input?.target?.value; setCurrentOnboardingFlowData(currentDataCopy); } @@ -58,7 +58,7 @@ const StepPrimarySetup = () => { const handleCategoryClick = (idxOfElm) => { changeCategory(idxOfElm); changeInputCateg(''); - const currentDataCopy = currentData; + const currentDataCopy = flowData; currentDataCopy.data.siteType['secondary'] = categoriesArray[0]?.subCategories[idxOfElm]; setCurrentOnboardingFlowData(currentDataCopy); } diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 5e940ad78..9ac4811db 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -49,10 +49,10 @@ const StepTopPriority = ( props ) => { setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); - const { currentStep, currentData } = useSelect( ( select ) => { + const { currentStep, flowData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [] ); @@ -73,14 +73,14 @@ const StepTopPriority = ( props ) => { useEffect( () => { async function setInitialData() { - if ( currentData ) { - const val = await currentData?.data.topPriority.priority1; + if ( flowData ) { + const val = await flowData?.data.topPriority.priority1; if ( val != '' ) setSelected( parseInt( getKey( priorityTypes, val ) ) ); else { - currentData.data.topPriority.priority1 = + flowData.data.topPriority.priority1 = priorityTypes[ selected ]; - setCurrentOnboardingFlowData( currentData ); + setCurrentOnboardingFlowData( flowData ); } } setisLoaded( true ); @@ -90,8 +90,8 @@ const StepTopPriority = ( props ) => { useEffect( () => { if ( isLoaded ) { - currentData.data.topPriority.priority1 = priorityTypes[ selected ]; - setCurrentOnboardingFlowData( currentData ); + flowData.data.topPriority.priority1 = priorityTypes[ selected ]; + setCurrentOnboardingFlowData( flowData ); } }, [ selected ] ); diff --git a/src/OnboardingSPA/store/actions.js b/src/OnboardingSPA/store/actions.js index f26be51a4..b19580c8b 100644 --- a/src/OnboardingSPA/store/actions.js +++ b/src/OnboardingSPA/store/actions.js @@ -95,20 +95,20 @@ export function setActiveStep( path ) { /** * Accepts a JSON to set the current data. * - * @param {*} currentData + * @param {*} flowData * @returns */ -export function setCurrentOnboardingFlowData(currentData) { +export function setCurrentOnboardingFlowData(flowData) { return { type: 'SET_CURRENT_FLOW_DATA', - currentData, + flowData, }; } /** * Accepts a JSON to set the social data. * - * @param {*} currentData + * @param {*} socialData * @returns */ export function setCurrentOnboardingSocialData(socialData) { diff --git a/src/OnboardingSPA/store/reducer.js b/src/OnboardingSPA/store/reducer.js index c5a5a4854..ad436edd3 100644 --- a/src/OnboardingSPA/store/reducer.js +++ b/src/OnboardingSPA/store/reducer.js @@ -73,15 +73,15 @@ export function drawer( } export function data( state = { - currentData: null, + flowData: null, socialData: null }, action ) { switch ( action.type ) { case 'SET_CURRENT_FLOW_DATA': return { ...state, - currentData: { - ...action.currentData + flowData: { + ...action.flowData }, }; case 'SET_CURRENT_SOCIAL_DATA': diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index 191818d7d..eb162b5ba 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -70,7 +70,7 @@ export function getHireExpertsUrl( state ) { * @return string */ export function getCurrentOnboardingFlowData( state ) { - return state.data.currentData; + return state.data.flowData; } /** From 0027b4d1b492743d40e9293bb95e3f5f09d74ca5 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 13:22:08 +0530 Subject: [PATCH 14/23] Fixed Ecommerce steps weird deserialisation --- src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js | 2 ++ src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js | 2 ++ src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js | 2 ++ 3 files changed, 6 insertions(+) diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 92a697227..2fa864c34 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -49,6 +49,7 @@ const StepAddress = () => { ]; if (settings !== null && flowData.storeDetails.address === undefined) { setCurrentOnboardingFlowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, address: { @@ -90,6 +91,7 @@ const StepAddress = () => { : `${country}:${newValue}`; } setCurrentOnboardingFlowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, address: { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index edaa26c31..1e9d2fb2f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -37,6 +37,7 @@ const StepProducts = () => { const handleCheckbox = (value, checked) => setCurrentOnboardingFLowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, productInfo: { @@ -50,6 +51,7 @@ const StepProducts = () => { const handleProductCount = (count) => setCurrentOnboardingFLowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, productInfo: { ...productInfo, product_count: count }, diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 60356033f..0b11055a7 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -50,6 +50,7 @@ const StepTax = () => { ); let tax = selectedTaxOption?.data ?? {}; setCurrentOnboardingFlowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, tax: { @@ -99,6 +100,7 @@ const StepTax = () => { (option) => option.value === value ); setCurrentOnboardingFlowData({ + ...flowData, storeDetails: { ...flowData.storeDetails, tax: { From c069f2d96536e682faf60570e65419ea5201bcab Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 13:29:12 +0530 Subject: [PATCH 15/23] Fixed a Typo in Ecommerce/StepProducts --- .../pages/Steps/Ecommerce/StepProducts/index.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 1e9d2fb2f..f4b208085 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -19,7 +19,7 @@ const StepProducts = () => { setIsDrawerOpened, setIsDrawerSuppressed, setIsSidebarOpened, - setCurrentOnboardingFLowData, + setCurrentOnboardingFlowData, } = useDispatch(nfdOnboardingStore); let flowData = useSelect((select) => @@ -36,7 +36,7 @@ const StepProducts = () => { }, []); const handleCheckbox = (value, checked) => - setCurrentOnboardingFLowData({ + setCurrentOnboardingFlowData({ ...flowData, storeDetails: { ...flowData.storeDetails, @@ -50,7 +50,7 @@ const StepProducts = () => { }); const handleProductCount = (count) => - setCurrentOnboardingFLowData({ + setCurrentOnboardingFlowData({ ...flowData, storeDetails: { ...flowData.storeDetails, From 13815096598c3066985829b34411e64cd1f80d22 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Mon, 22 Aug 2022 16:48:06 +0530 Subject: [PATCH 16/23] Refactored name to be more general --- src/OnboardingSPA/utils/api-queuer/api-executer.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js index 42cc9d984..224c728a0 100644 --- a/src/OnboardingSPA/utils/api-queuer/api-executer.js +++ b/src/OnboardingSPA/utils/api-queuer/api-executer.js @@ -3,13 +3,13 @@ import { setSettings } from '../api/settings'; import { FLOW_SYNC, SETTINGS_SYNC } from './constants'; // This Function is responsible to execute requests in a sequence -export async function apiExecuter(storeData, requests) { +export async function apiExecuter(data, requests) { requests.forEach(request => { switch (request) { - case FLOW_SYNC: setFlow(storeData); + case FLOW_SYNC: setFlow(data); break; - case SETTINGS_SYNC: setSettings(storeData?.data?.socialData); + case SETTINGS_SYNC: setSettings(data?.data?.socialData); break; default: break; From dd63813ff99f34340fb9abbf18072c7e51cbe497 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Tue, 23 Aug 2022 12:15:56 +0530 Subject: [PATCH 17/23] refactored name from currentData to flowData --- src/OnboardingSPA/components/App/index.js | 2 +- src/OnboardingSPA/pages/Steps/BasicInfo/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/DesignThemes/index.js | 6 +++--- .../pages/Steps/Ecommerce/StepAddress/index.js | 2 +- .../pages/Steps/Ecommerce/StepProducts/index.js | 2 +- src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js | 2 +- .../pages/Steps/GetStarted/GetStartedExperience/index.js | 2 +- .../Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js | 2 +- src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/TopPriority/index.js | 2 +- 10 files changed, 16 insertions(+), 16 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index 57ae77843..79672dfd2 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -79,7 +79,7 @@ const App = () => { } async function syncStoreToDB() { - if ( currentData ){ + if ( flowData ){ if (didVisitEcommerce) { await syncStoreDetails(); } diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index 5c744ef30..5d4c2560b 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -13,18 +13,18 @@ const StepBasicInfo = () => { const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep, currentData } = useSelect( + const { currentStep, flowData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, [] ); useEffect( () => { - flushQueue(currentData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index edf258e9d..f9a340fab 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -9,14 +9,14 @@ const StepDesignThemes = () => { const { flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = useDispatch( nfdOnboardingStore ); - const { currentData } = useSelect((select) => { + const { flowData } = useSelect((select) => { return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, []); useEffect( () => { - flushQueue(currentData); + flushQueue(flowData); setIsSidebarOpened( false ); setIsDrawerOpened( true ); setDrawerActiveView( VIEW_DESIGN_THEMES ); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index f8e894eab..443bcf02b 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -25,7 +25,7 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { - flushQueue(currentData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 4cd791ee0..f7d936202 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -28,7 +28,7 @@ const StepProducts = () => { ); let productInfo = flowData.storeDetails.productInfo; useEffect(() => { - flushQueue(currentData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 40f08845f..2de89f755 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -35,7 +35,7 @@ const StepTax = () => { ); useEffect(() => { - flushQueue(currentData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 3be22ae90..73c298c9b 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -38,7 +38,7 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(currentData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 100651621..d0bcb9ca8 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -30,7 +30,7 @@ const StepPrimarySetup = () => { ); useEffect(() => { - flushQueue(currentData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 4aaba4e1b..459f7e52f 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,11 +22,11 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, currentData, brandName } = useSelect( + const { currentStep, flowData, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, @@ -40,7 +40,7 @@ const StepWelcome = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(currentData); + flushQueue(flowData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 02685c947..40b9aee09 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -66,7 +66,7 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { - flushQueue(currentData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); From c793c68e543b589e0d2857ca438cd78de665b125 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Tue, 23 Aug 2022 12:18:46 +0530 Subject: [PATCH 18/23] Refactored names for better understanding --- src/OnboardingSPA/components/App/index.js | 4 ++-- .../components/ExitToWordPress/index.js | 2 +- .../components/Header/step-navigation.js | 2 +- .../components/SkipButton/index.js | 2 +- .../pages/Steps/BasicInfo/basicInfoForm.js | 4 ++-- .../pages/Steps/BasicInfo/index.js | 2 +- .../pages/Steps/DesignThemes/index.js | 2 +- .../pages/Steps/Ecommerce/StepAddress/index.js | 2 +- .../Steps/Ecommerce/StepProducts/index.js | 2 +- .../pages/Steps/Ecommerce/StepTax/index.js | 2 +- .../GetStarted/GetStartedExperience/index.js | 2 +- .../SiteTypeSetup/PrimarySite/index.js | 2 +- .../SiteTypeSetup/SecondarySite/index.js | 2 +- .../pages/Steps/GetStarted/Welcome/index.js | 2 +- .../pages/Steps/TopPriority/index.js | 2 +- src/OnboardingSPA/store/selectors.js | 18 ++++++++++++++---- 16 files changed, 31 insertions(+), 21 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index 79672dfd2..acebd3c5e 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -38,8 +38,8 @@ const App = () => { isDrawerOpen: select(nfdOnboardingStore).isDrawerOpened(), newfoldBrand: select(nfdOnboardingStore).getNewfoldBrand(), onboardingFlow: select(nfdOnboardingStore).getOnboardingFlow(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), - socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getOnboardingSocialData(), firstStep: select(nfdOnboardingStore).getFirstStep(), }; }, []); diff --git a/src/OnboardingSPA/components/ExitToWordPress/index.js b/src/OnboardingSPA/components/ExitToWordPress/index.js index afd52cbac..847d46616 100644 --- a/src/OnboardingSPA/components/ExitToWordPress/index.js +++ b/src/OnboardingSPA/components/ExitToWordPress/index.js @@ -34,7 +34,7 @@ const ExitToWordPress = ({ const { flowData } = useSelect( (select) => { return { - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/Header/step-navigation.js b/src/OnboardingSPA/components/Header/step-navigation.js index d22a8be0a..8066133de 100644 --- a/src/OnboardingSPA/components/Header/step-navigation.js +++ b/src/OnboardingSPA/components/Header/step-navigation.js @@ -102,7 +102,7 @@ const StepNavigation = () => { return { nextStep: select(nfdOnboardingStore).getNextStep(), previousStep: select(nfdOnboardingStore).getPreviousStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/SkipButton/index.js b/src/OnboardingSPA/components/SkipButton/index.js index 66ee4219c..65af2cb0c 100644 --- a/src/OnboardingSPA/components/SkipButton/index.js +++ b/src/OnboardingSPA/components/SkipButton/index.js @@ -22,7 +22,7 @@ const SkipButton = () => { return { previousStep: select(nfdOnboardingStore).getPreviousStep(), nextStep: select(nfdOnboardingStore).getNextStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js index 5c92e1a0a..6dc99e54d 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js @@ -37,8 +37,8 @@ const BasicInfoForm = () => { const { flowData, socialData } = useSelect((select) => { return { - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), - socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getOnboardingSocialData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index 5d4c2560b..c1ede787a 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -17,7 +17,7 @@ const StepBasicInfo = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index f9a340fab..675590c5f 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -11,7 +11,7 @@ const StepDesignThemes = () => { const { flowData } = useSelect((select) => { return { - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 443bcf02b..814dba2cc 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -37,7 +37,7 @@ const StepAddress = () => { const navigate = useNavigate(); let flowData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingFlowData() + select(nfdOnboardingStore).getOnboardingFlowData() ); const settings = useWPSettings(); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index f7d936202..0e199e50f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -24,7 +24,7 @@ const StepProducts = () => { } = useDispatch(nfdOnboardingStore); let flowData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingFlowData() + select(nfdOnboardingStore).getOnboardingFlowData() ); let productInfo = flowData.storeDetails.productInfo; useEffect(() => { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 2de89f755..22501b5ca 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -31,7 +31,7 @@ const StepTax = () => { const navigate = useNavigate(); let flowData = useSelect((select) => - select(nfdOnboardingStore).getCurrentOnboardingFlowData() + select(nfdOnboardingStore).getOnboardingFlowData() ); useEffect(() => { diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 73c298c9b..86627cb70 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -26,7 +26,7 @@ const GetStartedExperience = () => { const { enqueueRequest, flushQueue, setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); const { flowData, currentStep } = useSelect( ( select ) => { return { - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), }; }, [] ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index d0bcb9ca8..d2b05b400 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -23,7 +23,7 @@ const StepPrimarySetup = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index c55ac7cff..5cb04dda7 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -26,7 +26,7 @@ const StepPrimarySetup = () => { const { currentStep, flowData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 459f7e52f..478407ecb 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -26,7 +26,7 @@ const StepWelcome = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 40b9aee09..f6357562f 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -55,7 +55,7 @@ const StepTopPriority = ( props ) => { const { currentStep, flowData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), }; }, [] ); diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index 523431af5..9a92f8cc0 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -63,14 +63,24 @@ export function getHireExpertsUrl( state ) { return hireExpertsUrl; } +/** + * Gets the current complete Onboarding Data + * + * @param {*} state + * @return string + */ +export function getOnboardingData(state) { + return state?.data; +} + /** * Gets the current Onboarding Flow Data * * @param {*} state * @return string */ -export function getCurrentOnboardingFlowData( state ) { - return state.data.flowData; +export function getOnboardingFlowData( state ) { + return state?.data?.flowData; } /** @@ -79,8 +89,8 @@ export function getCurrentOnboardingFlowData( state ) { * @param {*} state * @return string */ -export function getCurrentOnboardingSocialData(state) { - return state.data.socialData; +export function getOnboardingSocialData(state) { + return state?.data?.socialData; } From 4d81c960d6ebcc05ae410b091314c7059703f8b2 Mon Sep 17 00:00:00 2001 From: Allen Benny Date: Tue, 23 Aug 2022 12:29:17 +0530 Subject: [PATCH 19/23] Refactored to use the New API Queuing System --- src/OnboardingSPA/pages/Steps/BasicInfo/index.js | 6 +++--- .../pages/Steps/Ecommerce/StepAddress/index.js | 12 +++++++++--- .../pages/Steps/Ecommerce/StepProducts/index.js | 13 ++++++++++--- .../pages/Steps/Ecommerce/StepTax/index.js | 12 +++++++++--- .../Steps/GetStarted/GetStartedExperience/index.js | 5 +++-- .../GetStarted/SiteTypeSetup/PrimarySite/index.js | 8 +++++--- .../GetStarted/SiteTypeSetup/SecondarySite/index.js | 7 ++++--- .../pages/Steps/GetStarted/Welcome/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/TopPriority/index.js | 5 +++-- src/OnboardingSPA/utils/api-queuer/api-executer.js | 4 ++-- 10 files changed, 51 insertions(+), 27 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index c1ede787a..f8e5c1f52 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -13,18 +13,18 @@ const StepBasicInfo = () => { const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData } = useSelect( + const { currentStep, onboardingData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, [] ); useEffect( () => { - flushQueue(flowData); + flushQueue(onboardingData); enqueueRequest(FLOW_SYNC); enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 814dba2cc..78dc70ab4 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -25,7 +25,7 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { - flushQueue(flowData); + flushQueue(onboardingData); if (isLargeViewport) { setIsDrawerOpened(true); } @@ -36,8 +36,14 @@ const StepAddress = () => { const navigate = useNavigate(); - let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + const { flowData, onboardingData } = useSelect( + (select) => { + return { + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() + }; + }, + [] ); const settings = useWPSettings(); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 0e199e50f..416012f66 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -23,12 +23,19 @@ const StepProducts = () => { setCurrentOnboardingFlowData, } = useDispatch(nfdOnboardingStore); - let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + const { flowData, onboardingData } = useSelect( + (select) => { + return { + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() + }; + }, + [] ); + let productInfo = flowData.storeDetails.productInfo; useEffect(() => { - flushQueue(flowData); + flushQueue(onboardingData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 22501b5ca..ca40783ff 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -30,12 +30,18 @@ const StepTax = () => { } = useDispatch(nfdOnboardingStore); const navigate = useNavigate(); - let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + const { flowData, onboardingData } = useSelect( + (select) => { + return { + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() + }; + }, + [] ); useEffect(() => { - flushQueue(flowData); + flushQueue(onboardingData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 86627cb70..86ad1d624 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -24,10 +24,11 @@ const GetStartedExperience = () => { const [ wpComfortLevel, setWpComfortLevel ] = useState( '0' ); const { enqueueRequest, flushQueue, setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); - const { flowData, currentStep } = useSelect( ( select ) => { + const { flowData, currentStep, onboardingData } = useSelect( ( select ) => { return { flowData: select(nfdOnboardingStore).getOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, [] ); @@ -38,7 +39,7 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(flowData); + flushQueue(onboardingData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index d2b05b400..63875f5e0 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -19,18 +19,20 @@ const StepPrimarySetup = () => { nfdOnboardingStore ); - const { currentStep, flowData } = useSelect( + const { currentStep, flowData, onboardingData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() + }; }, [] ); useEffect(() => { - flushQueue(flowData); + flushQueue(onboardingData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index 5cb04dda7..82c985ec8 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -23,17 +23,18 @@ const StepPrimarySetup = () => { } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData } = useSelect((select) => { + const { currentStep, flowData, onboardingData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, []); const selectedCategoryInStore = flowData?.data?.siteType?.secondary; useEffect(() => { - flushQueue(flowData); + flushQueue(onboardingData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 478407ecb..6aec860b6 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,11 +22,11 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, flowData, brandName } = useSelect( + const { currentStep, onboardingData, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, @@ -40,7 +40,7 @@ const StepWelcome = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(flowData); + flushQueue(onboardingData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index f6357562f..23a73ac43 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -52,10 +52,11 @@ const StepTopPriority = ( props ) => { setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData } = useSelect( ( select ) => { + const { currentStep, flowData, onboardingData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, [] ); @@ -66,7 +67,7 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { - flushQueue(flowData); + flushQueue(onboardingData); enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js index 224c728a0..7cebeb8df 100644 --- a/src/OnboardingSPA/utils/api-queuer/api-executer.js +++ b/src/OnboardingSPA/utils/api-queuer/api-executer.js @@ -7,9 +7,9 @@ export async function apiExecuter(data, requests) { requests.forEach(request => { switch (request) { - case FLOW_SYNC: setFlow(data); + case FLOW_SYNC: setFlow(data?.flowData); break; - case SETTINGS_SYNC: setSettings(data?.data?.socialData); + case SETTINGS_SYNC: setSettings(data?.socialData); break; default: break; From d86222c19345f67c2be64b746df7c9538ec8d4b2 Mon Sep 17 00:00:00 2001 From: Allen Benny <48691514+officiallygod@users.noreply.github.com> Date: Wed, 1 Mar 2023 13:24:40 +0530 Subject: [PATCH 20/23] Revert "Refactored to use the New API Queuing System" This reverts commit 4d81c960d6ebcc05ae410b091314c7059703f8b2. --- src/OnboardingSPA/pages/Steps/BasicInfo/index.js | 6 +++--- .../pages/Steps/Ecommerce/StepAddress/index.js | 12 +++--------- .../pages/Steps/Ecommerce/StepProducts/index.js | 13 +++---------- .../pages/Steps/Ecommerce/StepTax/index.js | 12 +++--------- .../Steps/GetStarted/GetStartedExperience/index.js | 5 ++--- .../GetStarted/SiteTypeSetup/PrimarySite/index.js | 8 +++----- .../GetStarted/SiteTypeSetup/SecondarySite/index.js | 7 +++---- .../pages/Steps/GetStarted/Welcome/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/TopPriority/index.js | 5 ++--- src/OnboardingSPA/utils/api-queuer/api-executer.js | 4 ++-- 10 files changed, 27 insertions(+), 51 deletions(-) diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index f8e5c1f52..c1ede787a 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -13,18 +13,18 @@ const StepBasicInfo = () => { const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep, onboardingData } = useSelect( + const { currentStep, flowData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, [] ); useEffect( () => { - flushQueue(onboardingData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 78dc70ab4..814dba2cc 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -25,7 +25,7 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { - flushQueue(onboardingData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } @@ -36,14 +36,8 @@ const StepAddress = () => { const navigate = useNavigate(); - const { flowData, onboardingData } = useSelect( - (select) => { - return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() - }; - }, - [] + let flowData = useSelect((select) => + select(nfdOnboardingStore).getOnboardingFlowData() ); const settings = useWPSettings(); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 416012f66..0e199e50f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -23,19 +23,12 @@ const StepProducts = () => { setCurrentOnboardingFlowData, } = useDispatch(nfdOnboardingStore); - const { flowData, onboardingData } = useSelect( - (select) => { - return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() - }; - }, - [] + let flowData = useSelect((select) => + select(nfdOnboardingStore).getOnboardingFlowData() ); - let productInfo = flowData.storeDetails.productInfo; useEffect(() => { - flushQueue(onboardingData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index ca40783ff..22501b5ca 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -30,18 +30,12 @@ const StepTax = () => { } = useDispatch(nfdOnboardingStore); const navigate = useNavigate(); - const { flowData, onboardingData } = useSelect( - (select) => { - return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() - }; - }, - [] + let flowData = useSelect((select) => + select(nfdOnboardingStore).getOnboardingFlowData() ); useEffect(() => { - flushQueue(onboardingData); + flushQueue(flowData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 86ad1d624..86627cb70 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -24,11 +24,10 @@ const GetStartedExperience = () => { const [ wpComfortLevel, setWpComfortLevel ] = useState( '0' ); const { enqueueRequest, flushQueue, setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); - const { flowData, currentStep, onboardingData } = useSelect( ( select ) => { + const { flowData, currentStep } = useSelect( ( select ) => { return { flowData: select(nfdOnboardingStore).getOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, [] ); @@ -39,7 +38,7 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(onboardingData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 63875f5e0..d2b05b400 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -19,20 +19,18 @@ const StepPrimarySetup = () => { nfdOnboardingStore ); - const { currentStep, flowData, onboardingData } = useSelect( + const { currentStep, flowData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() - + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, [] ); useEffect(() => { - flushQueue(onboardingData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index 82c985ec8..5cb04dda7 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -23,18 +23,17 @@ const StepPrimarySetup = () => { } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData, onboardingData } = useSelect((select) => { + const { currentStep, flowData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() + flowData: select(nfdOnboardingStore).getOnboardingFlowData() }; }, []); const selectedCategoryInStore = flowData?.data?.siteType?.secondary; useEffect(() => { - flushQueue(onboardingData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 6aec860b6..478407ecb 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,11 +22,11 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, onboardingData, brandName } = useSelect( + const { currentStep, flowData, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - onboardingData: select(nfdOnboardingStore).getOnboardingData(), + flowData: select(nfdOnboardingStore).getOnboardingFlowData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, @@ -40,7 +40,7 @@ const StepWelcome = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(onboardingData); + flushQueue(flowData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 23a73ac43..f6357562f 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -52,11 +52,10 @@ const StepTopPriority = ( props ) => { setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData, onboardingData } = useSelect( ( select ) => { + const { currentStep, flowData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - onboardingData: select(nfdOnboardingStore).getOnboardingData() }; }, [] ); @@ -67,7 +66,7 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { - flushQueue(onboardingData); + flushQueue(flowData); enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js index 7cebeb8df..224c728a0 100644 --- a/src/OnboardingSPA/utils/api-queuer/api-executer.js +++ b/src/OnboardingSPA/utils/api-queuer/api-executer.js @@ -7,9 +7,9 @@ export async function apiExecuter(data, requests) { requests.forEach(request => { switch (request) { - case FLOW_SYNC: setFlow(data?.flowData); + case FLOW_SYNC: setFlow(data); break; - case SETTINGS_SYNC: setSettings(data?.socialData); + case SETTINGS_SYNC: setSettings(data?.data?.socialData); break; default: break; From 4a6956be014e01236f08a2782190e409e446a85f Mon Sep 17 00:00:00 2001 From: Allen Benny <48691514+officiallygod@users.noreply.github.com> Date: Wed, 1 Mar 2023 13:24:46 +0530 Subject: [PATCH 21/23] Revert "Refactored names for better understanding" This reverts commit c793c68e543b589e0d2857ca438cd78de665b125. --- src/OnboardingSPA/components/App/index.js | 4 ++-- .../components/ExitToWordPress/index.js | 2 +- .../components/Header/step-navigation.js | 2 +- .../components/SkipButton/index.js | 2 +- .../pages/Steps/BasicInfo/basicInfoForm.js | 4 ++-- .../pages/Steps/BasicInfo/index.js | 2 +- .../pages/Steps/DesignThemes/index.js | 2 +- .../pages/Steps/Ecommerce/StepAddress/index.js | 2 +- .../Steps/Ecommerce/StepProducts/index.js | 2 +- .../pages/Steps/Ecommerce/StepTax/index.js | 2 +- .../GetStarted/GetStartedExperience/index.js | 2 +- .../SiteTypeSetup/PrimarySite/index.js | 2 +- .../SiteTypeSetup/SecondarySite/index.js | 2 +- .../pages/Steps/GetStarted/Welcome/index.js | 2 +- .../pages/Steps/TopPriority/index.js | 2 +- src/OnboardingSPA/store/selectors.js | 18 ++++-------------- 16 files changed, 21 insertions(+), 31 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index acebd3c5e..79672dfd2 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -38,8 +38,8 @@ const App = () => { isDrawerOpen: select(nfdOnboardingStore).isDrawerOpened(), newfoldBrand: select(nfdOnboardingStore).getNewfoldBrand(), onboardingFlow: select(nfdOnboardingStore).getOnboardingFlow(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - socialData: select(nfdOnboardingStore).getOnboardingSocialData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData(), firstStep: select(nfdOnboardingStore).getFirstStep(), }; }, []); diff --git a/src/OnboardingSPA/components/ExitToWordPress/index.js b/src/OnboardingSPA/components/ExitToWordPress/index.js index 847d46616..afd52cbac 100644 --- a/src/OnboardingSPA/components/ExitToWordPress/index.js +++ b/src/OnboardingSPA/components/ExitToWordPress/index.js @@ -34,7 +34,7 @@ const ExitToWordPress = ({ const { flowData } = useSelect( (select) => { return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/Header/step-navigation.js b/src/OnboardingSPA/components/Header/step-navigation.js index 8066133de..d22a8be0a 100644 --- a/src/OnboardingSPA/components/Header/step-navigation.js +++ b/src/OnboardingSPA/components/Header/step-navigation.js @@ -102,7 +102,7 @@ const StepNavigation = () => { return { nextStep: select(nfdOnboardingStore).getNextStep(), previousStep: select(nfdOnboardingStore).getPreviousStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [location.pathname] diff --git a/src/OnboardingSPA/components/SkipButton/index.js b/src/OnboardingSPA/components/SkipButton/index.js index 65af2cb0c..66ee4219c 100644 --- a/src/OnboardingSPA/components/SkipButton/index.js +++ b/src/OnboardingSPA/components/SkipButton/index.js @@ -22,7 +22,7 @@ const SkipButton = () => { return { previousStep: select(nfdOnboardingStore).getPreviousStep(), nextStep: select(nfdOnboardingStore).getNextStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js index 6dc99e54d..5c92e1a0a 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/basicInfoForm.js @@ -37,8 +37,8 @@ const BasicInfoForm = () => { const { flowData, socialData } = useSelect((select) => { return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), - socialData: select(nfdOnboardingStore).getOnboardingSocialData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + socialData: select(nfdOnboardingStore).getCurrentOnboardingSocialData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index c1ede787a..5d4c2560b 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -17,7 +17,7 @@ const StepBasicInfo = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index 675590c5f..f9a340fab 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -11,7 +11,7 @@ const StepDesignThemes = () => { const { flowData } = useSelect((select) => { return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 814dba2cc..443bcf02b 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -37,7 +37,7 @@ const StepAddress = () => { const navigate = useNavigate(); let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); const settings = useWPSettings(); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 0e199e50f..f7d936202 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -24,7 +24,7 @@ const StepProducts = () => { } = useDispatch(nfdOnboardingStore); let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); let productInfo = flowData.storeDetails.productInfo; useEffect(() => { diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 22501b5ca..2de89f755 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -31,7 +31,7 @@ const StepTax = () => { const navigate = useNavigate(); let flowData = useSelect((select) => - select(nfdOnboardingStore).getOnboardingFlowData() + select(nfdOnboardingStore).getCurrentOnboardingFlowData() ); useEffect(() => { diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 86627cb70..73c298c9b 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -26,7 +26,7 @@ const GetStartedExperience = () => { const { enqueueRequest, flushQueue, setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); const { flowData, currentStep } = useSelect( ( select ) => { return { - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), currentStep: select(nfdOnboardingStore).getCurrentStep(), }; }, [] ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index d2b05b400..d0bcb9ca8 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -23,7 +23,7 @@ const StepPrimarySetup = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, [] diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index 5cb04dda7..c55ac7cff 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -26,7 +26,7 @@ const StepPrimarySetup = () => { const { currentStep, flowData } = useSelect((select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData() + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() }; }, []); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 478407ecb..459f7e52f 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -26,7 +26,7 @@ const StepWelcome = () => { (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index f6357562f..40b9aee09 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -55,7 +55,7 @@ const StepTopPriority = ( props ) => { const { currentStep, flowData } = useSelect( ( select ) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getOnboardingFlowData(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), }; }, [] ); diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index 9a92f8cc0..523431af5 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -63,24 +63,14 @@ export function getHireExpertsUrl( state ) { return hireExpertsUrl; } -/** - * Gets the current complete Onboarding Data - * - * @param {*} state - * @return string - */ -export function getOnboardingData(state) { - return state?.data; -} - /** * Gets the current Onboarding Flow Data * * @param {*} state * @return string */ -export function getOnboardingFlowData( state ) { - return state?.data?.flowData; +export function getCurrentOnboardingFlowData( state ) { + return state.data.flowData; } /** @@ -89,8 +79,8 @@ export function getOnboardingFlowData( state ) { * @param {*} state * @return string */ -export function getOnboardingSocialData(state) { - return state?.data?.socialData; +export function getCurrentOnboardingSocialData(state) { + return state.data.socialData; } From 750abab80f12df3f4d5ede6bae54ce8198b03f93 Mon Sep 17 00:00:00 2001 From: Allen Benny <48691514+officiallygod@users.noreply.github.com> Date: Wed, 1 Mar 2023 13:24:49 +0530 Subject: [PATCH 22/23] Revert "refactored name from currentData to flowData" This reverts commit dd63813ff99f34340fb9abbf18072c7e51cbe497. --- src/OnboardingSPA/components/App/index.js | 2 +- src/OnboardingSPA/pages/Steps/BasicInfo/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/DesignThemes/index.js | 6 +++--- .../pages/Steps/Ecommerce/StepAddress/index.js | 2 +- .../pages/Steps/Ecommerce/StepProducts/index.js | 2 +- src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js | 2 +- .../pages/Steps/GetStarted/GetStartedExperience/index.js | 2 +- .../Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js | 2 +- src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js | 6 +++--- src/OnboardingSPA/pages/Steps/TopPriority/index.js | 2 +- 10 files changed, 16 insertions(+), 16 deletions(-) diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index 79672dfd2..57ae77843 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -79,7 +79,7 @@ const App = () => { } async function syncStoreToDB() { - if ( flowData ){ + if ( currentData ){ if (didVisitEcommerce) { await syncStoreDetails(); } diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index 5d4c2560b..5c744ef30 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -13,18 +13,18 @@ const StepBasicInfo = () => { const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData } = useSelect( + const { currentStep, currentData } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + currentData: select(nfdOnboardingStore).getCurrentOnboardingData() }; }, [] ); useEffect( () => { - flushQueue(flowData); + flushQueue(currentData); enqueueRequest(FLOW_SYNC); enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index f9a340fab..edf258e9d 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -9,14 +9,14 @@ const StepDesignThemes = () => { const { flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = useDispatch( nfdOnboardingStore ); - const { flowData } = useSelect((select) => { + const { currentData } = useSelect((select) => { return { - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + currentData: select(nfdOnboardingStore).getCurrentOnboardingData() }; }, []); useEffect( () => { - flushQueue(flowData); + flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerOpened( true ); setDrawerActiveView( VIEW_DESIGN_THEMES ); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index 443bcf02b..f8e894eab 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -25,7 +25,7 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { - flushQueue(flowData); + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index f7d936202..4cd791ee0 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -28,7 +28,7 @@ const StepProducts = () => { ); let productInfo = flowData.storeDetails.productInfo; useEffect(() => { - flushQueue(flowData); + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 2de89f755..40f08845f 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -35,7 +35,7 @@ const StepTax = () => { ); useEffect(() => { - flushQueue(flowData); + flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 73c298c9b..3be22ae90 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -38,7 +38,7 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(flowData); + flushQueue(currentData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index d0bcb9ca8..100651621 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -30,7 +30,7 @@ const StepPrimarySetup = () => { ); useEffect(() => { - flushQueue(flowData); + flushQueue(currentData); enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 459f7e52f..4aaba4e1b 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,11 +22,11 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, flowData, brandName } = useSelect( + const { currentStep, currentData, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), + currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, @@ -40,7 +40,7 @@ const StepWelcome = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(flowData); + flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 40b9aee09..02685c947 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -66,7 +66,7 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { - flushQueue(flowData); + flushQueue(currentData); enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); From df5f8b4a1850d6689063b07b5fd6326f8591e5bf Mon Sep 17 00:00:00 2001 From: Allen Benny <48691514+officiallygod@users.noreply.github.com> Date: Wed, 1 Mar 2023 13:24:51 +0530 Subject: [PATCH 23/23] Revert "Merge branch 'add/PRESS2-93-Implement-API-Queuing-Sytem' into add/PRESS-2-111-Extract-Social-Media-Data-outside-CurrentData" This reverts commit 05344258291db13fd683d8580400a223e7a2fcbc, reversing changes made to c069f2d96536e682faf60570e65419ea5201bcab. --- src/OnboardingSPA/components/App/index.js | 57 +++++++++++++++++-- .../pages/Steps/BasicInfo/index.js | 11 +--- .../pages/Steps/DesignThemes/index.js | 11 +--- .../Steps/Ecommerce/StepAddress/index.js | 2 - .../Steps/Ecommerce/StepProducts/index.js | 2 - .../pages/Steps/Ecommerce/StepTax/index.js | 2 - .../GetStarted/GetStartedExperience/index.js | 7 +-- .../SiteTypeSetup/PrimarySite/index.js | 5 +- .../SiteTypeSetup/SecondarySite/index.js | 36 +++++------- .../pages/Steps/GetStarted/Welcome/index.js | 5 +- .../pages/Steps/TopPriority/index.js | 5 -- src/OnboardingSPA/store/actions.js | 20 ------- src/OnboardingSPA/store/reducer.js | 25 +------- src/OnboardingSPA/store/selectors.js | 10 ---- .../utils/api-queuer/api-executer.js | 18 ------ .../utils/api-queuer/constants.js | 2 - 16 files changed, 78 insertions(+), 140 deletions(-) delete mode 100644 src/OnboardingSPA/utils/api-queuer/api-executer.js delete mode 100644 src/OnboardingSPA/utils/api-queuer/constants.js diff --git a/src/OnboardingSPA/components/App/index.js b/src/OnboardingSPA/components/App/index.js index 57ae77843..0695b1c88 100644 --- a/src/OnboardingSPA/components/App/index.js +++ b/src/OnboardingSPA/components/App/index.js @@ -4,6 +4,8 @@ import Drawer from '../Drawer'; import Sidebar from '../Sidebar'; import classNames from 'classnames'; import { useLocation } from 'react-router-dom'; +import { setFlow } from '../../utils/api/flow'; +import { getSettings, setSettings } from '../../utils/api/settings'; import { isEmpty, updateWPSettings } from '../../utils/api/ecommerce'; import { store as nfdOnboardingStore } from '../../store'; @@ -44,8 +46,26 @@ const App = () => { }; }, []); + const [isRequestPlaced, setIsRequestPlaced] = useState(false); + const [didVisitBasicInfo, setDidVisitBasicInfo] = useState(false); const [didVisitEcommerce, setDidVisitEcommerce] = useState(false); - const { setActiveStep, setActiveFlow } = useDispatch(nfdOnboardingStore); + const { + setActiveStep, + setActiveFlow, + setCurrentOnboardingFlowData, + setCurrentOnboardingSocialData + } = useDispatch(nfdOnboardingStore); + + async function syncSocialSettings() { + const initialData = await getSettings(); + const result = await setSettings(socialData); + setDidVisitBasicInfo(false); + if (result?.error != null) { + console.error('Unable to Save Social Data!'); + return initialData?.body; + } + return result?.body; + } async function syncStoreDetails() { let { address, tax } = flowData?.storeDetails; @@ -79,12 +99,39 @@ const App = () => { } async function syncStoreToDB() { - if ( currentData ){ - if (didVisitEcommerce) { - await syncStoreDetails(); + // The First Welcome Step doesn't have any Store changes + const isFirstStep = location?.pathname === firstStep?.path; + if (flowData && !isFirstStep){ + if(!isRequestPlaced){ + setIsRequestPlaced(true); + + if (didVisitEcommerce) { + await syncStoreDetails(); + } + + // If Social Data is changed then sync it + if (didVisitBasicInfo){ + const socialDataToBeSaved = await syncSocialSettings(); + + // If Social Data is changed then Sync that also to the store + if (socialDataToBeSaved && flowData?.data) + setCurrentOnboardingSocialData(socialDataToBeSaved); + } + + const result = await setFlow(flowData); + if (result?.error != null) { + setIsRequestPlaced(false); + console.error('Unable to Save data!'); + } else { + setCurrentOnboardingFlowData(result?.body); + setIsRequestPlaced(false); + } + } } - + // Check if the Basic Info page was visited + if (location?.pathname.includes('basic-info')) + setDidVisitBasicInfo(true); if (location?.pathname.includes('ecommerce')) { setDidVisitEcommerce(true); } diff --git a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js index 5c744ef30..072a052c6 100644 --- a/src/OnboardingSPA/pages/Steps/BasicInfo/index.js +++ b/src/OnboardingSPA/pages/Steps/BasicInfo/index.js @@ -6,27 +6,22 @@ import { store as nfdOnboardingStore } from '../../../store'; import { useSelect, useDispatch } from '@wordpress/data'; import { useEffect } from '@wordpress/element'; import { useViewportMatch } from '@wordpress/compose'; -import { FLOW_SYNC, SETTINGS_SYNC } from '../../../utils/api-queuer/constants'; const StepBasicInfo = () => { const isLargeViewport = useViewportMatch( 'medium' ); - const { enqueueRequest, flushQueue, setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = + const { setIsDrawerOpened, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); - const { currentStep, currentData } = useSelect( + const { currentStep } = useSelect( (select) => { return { - currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() + currentStep: select(nfdOnboardingStore).getCurrentStep() }; }, [] ); useEffect( () => { - flushQueue(currentData); - enqueueRequest(FLOW_SYNC); - enqueueRequest(SETTINGS_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); } diff --git a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js index edf258e9d..ab6d8a9aa 100644 --- a/src/OnboardingSPA/pages/Steps/DesignThemes/index.js +++ b/src/OnboardingSPA/pages/Steps/DesignThemes/index.js @@ -2,21 +2,14 @@ import CommonLayout from '../../../components/Layouts/Common'; import StepOverview from '../../../components/StepOverview'; import { VIEW_DESIGN_THEMES } from '../../../../constants'; import { store as nfdOnboardingStore } from '../../../store'; -import { useDispatch, useSelect } from '@wordpress/data'; +import { useDispatch } from '@wordpress/data'; import { useEffect } from '@wordpress/element'; const StepDesignThemes = () => { - const { flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = + const { setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened } = useDispatch( nfdOnboardingStore ); - const { currentData } = useSelect((select) => { - return { - currentData: select(nfdOnboardingStore).getCurrentOnboardingData() - }; - }, []); - useEffect( () => { - flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerOpened( true ); setDrawerActiveView( VIEW_DESIGN_THEMES ); diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js index f8e894eab..2fa864c34 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js @@ -16,7 +16,6 @@ import { useWPSettings } from '../useWPSettings'; const StepAddress = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { - flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -25,7 +24,6 @@ const StepAddress = () => { } = useDispatch(nfdOnboardingStore); useEffect(() => { - flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js index 4cd791ee0..f4b208085 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepProducts/index.js @@ -15,7 +15,6 @@ import content from '../content.json'; const StepProducts = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { - flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -28,7 +27,6 @@ const StepProducts = () => { ); let productInfo = flowData.storeDetails.productInfo; useEffect(() => { - flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js index 40f08845f..0b11055a7 100644 --- a/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js +++ b/src/OnboardingSPA/pages/Steps/Ecommerce/StepTax/index.js @@ -21,7 +21,6 @@ function createReverseLookup(state) { const StepTax = () => { const isLargeViewport = useViewportMatch( 'medium' ); const { - flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsDrawerSuppressed, @@ -35,7 +34,6 @@ const StepTax = () => { ); useEffect(() => { - flushQueue(currentData); if (isLargeViewport) { setIsDrawerOpened(true); } diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js index 3be22ae90..81a05d62c 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/GetStartedExperience/index.js @@ -6,8 +6,6 @@ import NeedHelpTag from '../../../../components/NeedHelpTag'; import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; import { store as nfdOnboardingStore } from '../../../../store'; import content from './content.json'; -import { FLOW_SYNC } from '../../../../utils/api-queuer/constants'; - import { RadioControl } from '@wordpress/components'; import { useState, useEffect } from '@wordpress/element'; import { useDispatch, useSelect } from '@wordpress/data'; @@ -23,7 +21,8 @@ const GetStartedExperience = () => { const [ isLoaded, setisLoaded ] = useState( false ); const [ wpComfortLevel, setWpComfortLevel ] = useState( '0' ); - const { enqueueRequest, flushQueue, setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); + const { setCurrentOnboardingFlowData } = useDispatch( nfdOnboardingStore ); + const { flowData, currentStep } = useSelect( ( select ) => { return { flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData(), @@ -38,8 +37,6 @@ const GetStartedExperience = () => { } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(currentData); - enqueueRequest(FLOW_SYNC); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js index 100651621..916fa7dad 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/PrimarySite/index.js @@ -10,12 +10,11 @@ import NavCardButton from '../../../../../components/Button/NavCardButton'; import NeedHelpTag from '../../../../../components/NeedHelpTag'; import content from '../content.json'; import { translations } from '../../../../../utils/locales/translations'; -import { FLOW_SYNC } from '../../../../../utils/api-queuer/constants'; const StepPrimarySetup = () => { - const { enqueueRequest, flushQueue, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( + const { setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( nfdOnboardingStore ); @@ -30,8 +29,6 @@ const StepPrimarySetup = () => { ); useEffect(() => { - flushQueue(currentData); - enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); setDrawerActiveView(VIEW_NAV_GET_STARTED); diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js index c55ac7cff..09f8a782c 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/SiteTypeSetup/SecondarySite/index.js @@ -10,31 +10,14 @@ import NavCardButton from '../../../../../components/Button/NavCardButton'; import NeedHelpTag from '../../../../../components/NeedHelpTag'; import content from '../content.json'; import { translations } from '../../../../../utils/locales/translations'; -import { FLOW_SYNC } from '../../../../../utils/api-queuer/constants'; -const StepPrimarySetup = () => { - - const { enqueueRequest, - flushQueue, - setDrawerActiveView, - setIsSidebarOpened, - setIsDrawerSuppressed, - setCurrentOnboardingFlowData - } - = useDispatch( nfdOnboardingStore ); - const { currentStep, flowData } = useSelect((select) => { - return { - currentStep: select(nfdOnboardingStore).getCurrentStep(), - flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() - }; - }, []); - - const selectedCategoryInStore = flowData?.data?.siteType?.secondary; +const StepPrimarySetup = () => { + const { setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed } = useDispatch( + nfdOnboardingStore + ); useEffect(() => { - flushQueue(flowData); - enqueueRequest(FLOW_SYNC); setIsSidebarOpened(false); setIsDrawerSuppressed(true); setDrawerActiveView(VIEW_NAV_GET_STARTED); @@ -43,6 +26,17 @@ const StepPrimarySetup = () => { const [clickedIndex, changeCategory] = useState(-1); const [inputCategVal, changeInputCateg] = useState(''); + + const { setCurrentOnboardingFlowData } = useDispatch(nfdOnboardingStore); + + const { currentStep, flowData } = useSelect((select) => { + return { + currentStep: select(nfdOnboardingStore).getCurrentStep(), + flowData: select(nfdOnboardingStore).getCurrentOnboardingFlowData() + }; + }, []); + + const selectedCategoryInStore = flowData?.data?.siteType?.secondary; const categoriesArray = content.categories; const subCategories = categoriesArray[0]?.subCategories; diff --git a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js index 4aaba4e1b..2e1fbea6d 100644 --- a/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js +++ b/src/OnboardingSPA/pages/Steps/GetStarted/Welcome/index.js @@ -22,25 +22,22 @@ import { VIEW_NAV_GET_STARTED } from '../../../../../constants'; */ const StepWelcome = () => { const location = useLocation(); - const { currentStep, currentData, brandName } = useSelect( + const { currentStep, brandName } = useSelect( (select) => { return { currentStep: select(nfdOnboardingStore).getCurrentStep(), - currentData: select(nfdOnboardingStore).getCurrentOnboardingData(), brandName: select(nfdOnboardingStore).getNewfoldBrandName(), }; }, [location.pathname] ); const { - flushQueue, setDrawerActiveView, setIsSidebarOpened, setIsDrawerSuppressed, } = useDispatch( nfdOnboardingStore ); useEffect( () => { - flushQueue(currentData); setIsSidebarOpened( false ); setIsDrawerSuppressed( true ); setDrawerActiveView( VIEW_NAV_GET_STARTED ); diff --git a/src/OnboardingSPA/pages/Steps/TopPriority/index.js b/src/OnboardingSPA/pages/Steps/TopPriority/index.js index 02685c947..9ac4811db 100644 --- a/src/OnboardingSPA/pages/Steps/TopPriority/index.js +++ b/src/OnboardingSPA/pages/Steps/TopPriority/index.js @@ -10,7 +10,6 @@ import { store as nfdOnboardingStore } from '../../../store'; import CommonLayout from '../../../components/Layouts/Common'; import HeadingWithSubHeading from '../../../components/HeadingWithSubHeading'; import SelectableCardList from '../../../components/SelectableCardList/selectable-card-list'; -import { FLOW_SYNC } from '../../../utils/api-queuer/constants'; const StepTopPriority = ( props ) => { const priorityTypes = { @@ -43,8 +42,6 @@ const StepTopPriority = ( props ) => { const isLargeViewport = useViewportMatch( 'medium' ); const { - enqueueRequest, - flushQueue, setDrawerActiveView, setIsDrawerOpened, setIsSidebarOpened, @@ -66,8 +63,6 @@ const StepTopPriority = ( props ) => { }; useEffect( () => { - flushQueue(currentData); - enqueueRequest(FLOW_SYNC); if ( isLargeViewport ) { setIsDrawerOpened( true ); } diff --git a/src/OnboardingSPA/store/actions.js b/src/OnboardingSPA/store/actions.js index ef8d21824..b19580c8b 100644 --- a/src/OnboardingSPA/store/actions.js +++ b/src/OnboardingSPA/store/actions.js @@ -151,23 +151,3 @@ export function updatePreviewSettings( previewSettings ) { previewSettings, }; } - -export function enqueueRequest( request ) { - return { - type: 'ENQUEUE_REQUEST', - request, - }; -} - -export function dequeueRequest() { - return { - type: 'DEQUEUE_REQUEST' - }; -} - -export function flushQueue( storeData ) { - return { - type: 'FLUSH_QUEUE', - storeData, - }; -} diff --git a/src/OnboardingSPA/store/reducer.js b/src/OnboardingSPA/store/reducer.js index a9f994e08..ad436edd3 100644 --- a/src/OnboardingSPA/store/reducer.js +++ b/src/OnboardingSPA/store/reducer.js @@ -1,7 +1,6 @@ import { combineReducers } from '@wordpress/data'; import { VIEW_NAV_PRIMARY } from '../../constants'; -import { apiExecuter } from '../utils/api-queuer/api-executer'; import { routes as initialRoutes, @@ -121,25 +120,6 @@ export function sidebar( return state; } -export function queue(state = [], action) { - switch (action.type) { - // Add a new API Request to the Queue - case 'ENQUEUE_REQUEST': - return [...state, action.request]; - - // Take out the topmost Queue Item - case 'DEQUEUE_REQUEST': - return [...state.slice(1)]; - - // Make all the Queue Requests and Empty the queue - case 'FLUSH_QUEUE': - apiExecuter(action.storeData, state); - return []; - } - - return state; -} - export function runtime( state = {}, action ) { switch ( action.type ) { case 'SET_RUNTIME': @@ -169,12 +149,11 @@ export function settings( state = {}, action ) { return state; } -export default combineReducers({ +export default combineReducers( { drawer, runtime, data, settings, flow, sidebar, - queue, -}); +} ); diff --git a/src/OnboardingSPA/store/selectors.js b/src/OnboardingSPA/store/selectors.js index 523431af5..eb162b5ba 100644 --- a/src/OnboardingSPA/store/selectors.js +++ b/src/OnboardingSPA/store/selectors.js @@ -94,16 +94,6 @@ export function getOnboardingFlow( state ) { return state.runtime.currentFlow ?? 'wp-setup'; } -/** - * Gets the Queue Element on top - * - * @param {*} state - * @return string - */ -export function getQueuePeek(state) { - return state?.queue[0] ?? null; -} - /** * Gets steps to display in drawer. * diff --git a/src/OnboardingSPA/utils/api-queuer/api-executer.js b/src/OnboardingSPA/utils/api-queuer/api-executer.js deleted file mode 100644 index 224c728a0..000000000 --- a/src/OnboardingSPA/utils/api-queuer/api-executer.js +++ /dev/null @@ -1,18 +0,0 @@ -import { setFlow } from '../api/flow'; -import { setSettings } from '../api/settings'; -import { FLOW_SYNC, SETTINGS_SYNC } from './constants'; - -// This Function is responsible to execute requests in a sequence -export async function apiExecuter(data, requests) { - - requests.forEach(request => { - switch (request) { - case FLOW_SYNC: setFlow(data); - break; - case SETTINGS_SYNC: setSettings(data?.data?.socialData); - break; - default: - break; - } - }); -} diff --git a/src/OnboardingSPA/utils/api-queuer/constants.js b/src/OnboardingSPA/utils/api-queuer/constants.js deleted file mode 100644 index 9fe4bc7eb..000000000 --- a/src/OnboardingSPA/utils/api-queuer/constants.js +++ /dev/null @@ -1,2 +0,0 @@ -export const FLOW_SYNC = 'FLOW_SYNC'; -export const SETTINGS_SYNC = 'SETTINGS_SYNC';