From 8c8dd637e10659388a2c242765e9a429199355ff Mon Sep 17 00:00:00 2001 From: Dean Date: Tue, 28 Feb 2023 16:38:11 +0000 Subject: [PATCH] Enable the feature tour window and extend the invite duration to 1 week --- .../src/components/deploy/AppActions.svelte | 7 +++- .../portal/onboarding/TourWrap.svelte | 9 ++-- .../src/components/portal/onboarding/tours.js | 25 +++++++++-- .../builder/app/[application]/_layout.svelte | 42 ++++++++++++------- packages/worker/src/utilities/redis.ts | 2 +- 5 files changed, 61 insertions(+), 24 deletions(-) diff --git a/packages/builder/src/components/deploy/AppActions.svelte b/packages/builder/src/components/deploy/AppActions.svelte index 582b5ab8f0..daed564204 100644 --- a/packages/builder/src/components/deploy/AppActions.svelte +++ b/packages/builder/src/components/deploy/AppActions.svelte @@ -20,6 +20,7 @@ import { apps } from "stores/portal" import { store } from "builderStore" import TourWrap from "components/portal/onboarding/TourWrap.svelte" + import { TOUR_STEP_KEYS } from "components/portal/onboarding/tours.js" export let application @@ -179,7 +180,11 @@ /> {/if} - + { if (!$store.tourKey) return - currentTour = TOURS[$store.tourKey].find(step => step.id === tourStepKey) + currentTourStep = TOURS[$store.tourKey].find( + step => step.id === tourStepKey + ) + if (!currentTourStep) return - const elem = document.querySelector(currentTour.query) + const elem = document.querySelector(currentTourStep.query) handler = tourHandler(elem, tourStepKey) ready = true }) diff --git a/packages/builder/src/components/portal/onboarding/tours.js b/packages/builder/src/components/portal/onboarding/tours.js index 7975f11bb5..e28c638a4a 100644 --- a/packages/builder/src/components/portal/onboarding/tours.js +++ b/packages/builder/src/components/portal/onboarding/tours.js @@ -65,7 +65,7 @@ const getTours = () => { id: TOUR_STEP_KEYS.BUILDER_USER_MANAGEMENT, title: "Users", query: ".toprightnav #builder-app-users-button", - body: "Choose which users you want to see to have access to your app and control what level of access they have.", + body: "Add users to your app and control what level of access they have.", onLoad: () => { tourEvent(TOUR_STEP_KEYS.BUILDER_USER_MANAGEMENT) }, @@ -107,11 +107,30 @@ const getTours = () => { id: TOUR_STEP_KEYS.FEATURE_USER_MANAGEMENT, title: "Users", query: ".toprightnav #builder-app-users-button", - body: "Choose which users you want to have access to your app and control what level of access they have.", + body: "Add users to your app and control what level of access they have.", onLoad: () => { tourEvent(TOUR_STEP_KEYS.FEATURE_USER_MANAGEMENT) }, - align: "left", + onComplete: async () => { + // Push the onboarding forward + if (get(auth).user) { + await users.save({ + ...get(auth).user, + onboardedAt: new Date().toISOString(), + }) + + // Update the cached user + await auth.getSelf() + + store.update(state => ({ + ...state, + tourNodes: undefined, + tourKey: undefined, + tourKeyStep: undefined, + onboarding: false, + })) + } + }, }, ], } diff --git a/packages/builder/src/pages/builder/app/[application]/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/_layout.svelte index abf70a84c0..a4b4982fca 100644 --- a/packages/builder/src/pages/builder/app/[application]/_layout.svelte +++ b/packages/builder/src/pages/builder/app/[application]/_layout.svelte @@ -68,22 +68,32 @@ } const initTour = async () => { - if ( - !$auth.user?.onboardedAt && - isEnabled(TENANT_FEATURE_FLAGS.ONBOARDING_TOUR) - ) { - // Determine the correct step - const activeNav = $layout.children.find(c => $isActive(c.path)) - const onboardingTour = TOURS[TOUR_KEYS.TOUR_BUILDER_ONBOARDING] - const targetStep = activeNav - ? onboardingTour.find(step => step.route === activeNav?.path) - : null - await store.update(state => ({ - ...state, - onboarding: true, - tourKey: TOUR_KEYS.TOUR_BUILDER_ONBOARDING, - tourStepKey: targetStep?.id, - })) + // Check if onboarding is enabled. + if (isEnabled(TENANT_FEATURE_FLAGS.ONBOARDING_TOUR)) { + if (!$auth.user?.onboardedAt) { + // Determine the correct step + const activeNav = $layout.children.find(c => $isActive(c.path)) + const onboardingTour = TOURS[TOUR_KEYS.TOUR_BUILDER_ONBOARDING] + const targetStep = activeNav + ? onboardingTour.find(step => step.route === activeNav?.path) + : null + await store.update(state => ({ + ...state, + onboarding: true, + tourKey: TOUR_KEYS.TOUR_BUILDER_ONBOARDING, + tourStepKey: targetStep?.id, + })) + } else { + // Feature tour date + const release_date = new Date("2023-03-01T00:00:00.000Z") + const onboarded = new Date($auth.user?.onboardedAt) + if (onboarded < release_date) { + await store.update(state => ({ + ...state, + tourKey: TOUR_KEYS.FEATURE_ONBOARDING, + })) + } + } } } diff --git a/packages/worker/src/utilities/redis.ts b/packages/worker/src/utilities/redis.ts index 1e0d0beb97..ecfc027cad 100644 --- a/packages/worker/src/utilities/redis.ts +++ b/packages/worker/src/utilities/redis.ts @@ -7,7 +7,7 @@ function getExpirySecondsForDB(db: string) { return 3600 case redis.utils.Databases.INVITATIONS: // a day - return 86400 + return 604800 } }