diff --git a/components/Modals.ce.vue b/components/Modals.ce.vue index 55061c845..5e2466cde 100644 --- a/components/Modals.ce.vue +++ b/components/Modals.ce.vue @@ -9,14 +9,14 @@ import { useTrialStore } from '~/store/trial'; const { callbackStatus } = storeToRefs(useCallbackActionsStore()); const { promoVisible } = storeToRefs(usePromoStore()); -const { showModal } = storeToRefs(useTrialStore()); +const { trialModalVisible } = storeToRefs(useTrialStore()); - + diff --git a/components/UserProfile/Trial.vue b/components/UserProfile/Trial.vue index 554b119be..4b233f967 100644 --- a/components/UserProfile/Trial.vue +++ b/components/UserProfile/Trial.vue @@ -11,24 +11,7 @@ withDefaults(defineProps(), { }); const trialStore = useTrialStore(); -const { trialStatus } = storeToRefs(trialStore); - -const heading = computed(() => { - if (trialStatus.value === 'failed') return 'Failed to start your free 30 day trial'; - if (trialStatus.value === 'trialExtend') return 'Extending your free trial by 15 days'; - if (trialStatus.value === 'trialStart') return 'Starting your free 30 day trial…'; - if (trialStatus.value === 'success') return 'Free 30 Day Trial Created'; - return ''; -}); -const subheading = computed(() => { - /** @todo show response error */ - if (trialStatus.value === 'failed') return 'Key server did not return a trial key. Please try again later.'; - if (trialStatus.value === 'trialExtend' || trialStatus.value === 'trialStart') return 'Please keep this window open'; - if (trialStatus.value === 'success') return 'Please wait while the page reloads to install your trial key'; - return ''; -}); - -const loading = computed(() => trialStatus.value === 'trialExtend' || trialStatus.value === 'trialStart'); +const { trialModalLoading, trialStatus, trialStatusCopy } = storeToRefs(trialStore); const close = () => { if (trialStatus.value === 'trialStart') return console.debug("[close] not allowed"); @@ -40,16 +23,16 @@ const close = () => { - + - + { type TrialStatus = 'failed' | 'ready' | TrialExtend | TrialStart | 'success'; const trialStatus = ref('ready'); - const showModal = computed(() => trialStatus.value === 'failed' || trialStatus.value === 'trialExtend' || trialStatus.value === 'trialStart'); - - // const extend = () => { - // console.debug('[extend]'); - // callbackStore.send('https://localhost:8008/connect', [{ - // server: { - // ...serverStore.serverAccountPayload, - // }, - // type: 'trialExtend', - // }]); - // }; + const trialModalLoading = computed(() => trialStatus.value === 'trialExtend' || trialStatus.value === 'trialStart'); + const trialModalVisible = computed(() => trialStatus.value === 'failed' || trialStatus.value === 'trialExtend' || trialStatus.value === 'trialStart'); + interface TrialStatusCopy { + heading: string; + subheading?: string; + } + const trialStatusCopy = computed((): TrialStatusCopy | null => { + switch (trialStatus.value) { + case 'failed': + return { + heading: 'Trial Key Creation Failed', + subheading: 'Key server did not return a trial key. Please try again later.', + } + case 'trialExtend': + return { + heading: 'Extending your free trial by 15 days', + subheading: 'Please keep this window open', + } + case 'trialStart': + return { + heading: 'Starting your free 30 day trial', + subheading: 'Please keep this window open', + } + case 'success': + return { + heading: 'Trial Key Created', + subheading: 'Please wait while the page reloads to install your trial key', + } + case 'ready': + return null; + }; + }); const requestTrial = async (type?: TrialExtend | TrialStart) => { console.debug('[requestTrial]'); @@ -88,10 +109,12 @@ export const useTrialStore = defineStore('trial', () => { return { // State - showModal, + trialModalLoading, + trialModalVisible, trialStatus, + // Getters + trialStatusCopy, // Actions - // extend, requestTrial, setTrialStatus, };