11<script setup lang="ts">
22import {
3+ mdiAlert ,
34 mdiArrowLeft ,
4- mdiCallReceived ,
55 mdiCallMade ,
6+ mdiCallReceived ,
67 mdiCheck ,
7- mdiAlert ,
8- mdiInvoice ,
98 mdiDownloadOutline ,
9+ mdiInvoice ,
1010} from ' @mdi/js'
1111import type {
1212 RequestsUserPaymentInvoice ,
@@ -188,9 +188,12 @@ async function loadSubscriptionInvoices() {
188188async function updateDetails() {
189189 loading .value = true
190190 try {
191- const link = await billingStore .getSubscriptionUpdateLink ()
192- window .location .href = link
191+ window .location .href = await billingStore .getSubscriptionUpdateLink ()
193192 } catch {
193+ notificationsStore .addNotification ({
194+ message: ' We could not redirect you to the subscription update portal.' ,
195+ type: ' error' ,
196+ })
194197 loading .value = false
195198 }
196199}
@@ -205,6 +208,10 @@ async function cancelPlan() {
205208 })
206209 navigateTo (' /' )
207210 } catch {
211+ notificationsStore .addNotification ({
212+ message: ' We could not cancel your subscription.' ,
213+ type: ' error' ,
214+ })
208215 loading .value = false
209216 }
210217}
@@ -358,10 +365,10 @@ onMounted(async () => {
358365 </template >
359366 <VCard >
360367 <VCardText class="pt-4">
361- <h2 class =" text-headline-medium mb-2" >
368+ <h2 class =" text-headline-medium mt-0 mb-2" >
362369 Are you sure you want to cancel your subscription?
363370 </h2 >
364- <p >
371+ <p class = " text-medium-emphasis " >
365372 You will be downgraded to the free plan at the end
366373 of the current billing period on
367374 <b >{{
@@ -371,8 +378,12 @@ onMounted(async () => {
371378 }}</b >
372379 </p >
373380 </VCardText >
374- <VCardActions >
375- <VBtn color="primary" @click =" dialog = false " >
381+ <VCardActions class="mt-n6 px-6 pb-6">
382+ <VBtn
383+ color="primary"
384+ variant="flat"
385+ @click =" dialog = false "
386+ >
376387 Keep Subscription
377388 </VBtn >
378389 <VSpacer />
@@ -408,10 +419,10 @@ onMounted(async () => {
408419 Pro Plan
409420 </h1 >
410421 <p class =" text-medium-emphasis" >
411- Send and receive up to 20,000 messages per month
422+ Send and receive 5,000 to 20,000 messages per month
412423 </p >
413424 </VCol >
414- <VCol class="flex-grow-0 flex-shrink-0">
425+ <VCol class="flex-grow-0 flex-shrink-0 text-center ">
415426 <span class =" text-headline-medium" >$10</span >/month
416427 </VCol >
417428 </VRow >
@@ -429,10 +440,11 @@ onMounted(async () => {
429440 Enterprise Plan
430441 </h1 >
431442 <p class =" text-medium-emphasis" >
432- Send and receive up to 200,000 messages per month
443+ Send and receive 50,000 to 200,000 messages per
444+ month
433445 </p >
434446 </VCol >
435- <VCol class="flex-grow-0 flex-shrink-0">
447+ <VCol class="flex-grow-0 flex-shrink-0 text-center ">
436448 <span class =" text-headline-medium" >$89</span >/month
437449 </VCol >
438450 </VRow >
0 commit comments