refactor: trial copy

This commit is contained in:
Zack Spear
2023-07-07 14:52:15 -07:00
committed by Zack Spear
parent 9e24019d60
commit bbbdff6c60
3 changed files with 44 additions and 38 deletions

View File

@@ -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());
</script>
<template>
<div class="relative z-[99999]">
<UpcCallbackFeedback :open="callbackStatus !== 'ready'" />
<UpcPromo :open="promoVisible" />
<UpcTrial :open="showModal" />
<UpcTrial :open="trialModalVisible" />
</div>
</template>

View File

@@ -11,24 +11,7 @@ withDefaults(defineProps<Props>(), {
});
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 = () => {
<Modal
@close="close"
:open="open"
:title="heading"
:description="subheading"
:show-close-x="!loading"
:title="trialStatusCopy?.heading"
:description="trialStatusCopy?.subheading"
:show-close-x="!trialModalLoading"
max-width="max-w-640px"
>
<template #main>
<BrandLoading v-if="loading" class="w-[150px] mx-auto my-24px" />
<BrandLoading v-if="trialModalLoading" class="w-[150px] mx-auto my-24px" />
</template>
<template v-if="!loading" #footer>
<template v-if="!trialModalLoading" #footer>
<div class="w-full max-w-xs flex flex-col items-center gap-y-16px mx-auto">
<div>
<button