feat: dashboard billing (#193)

* feat: move plans into sharable json * remove unused code * update pnpm lock * update plans.json * implement early adopter pricing * docs: update meta title and description * Finished the UI for upgrading plans * Updated the pricing plans * Updated the cards ui * use relative import * improve styling of upgrade plan card * styling improvements, lemonsqueezy setup * trigger lemonsqueezy payment and add webhook * update pnpm lock * add logout route * feat: complete billing functionality * generate lock file * make crypto false on browser * feat: adding upgrade prompts to org * chore: add upgrade icon to upload video * feat: add upgrade prompt to certificate and settings * feat: implement onboarding setup page (#229) * working on the onboarding setup * working on the onboarding page * Almost done with the onboarding UI * finished the UI of the onBoarding setup * finished the UI of the onBoarding setup * Implementing the functions to carryout the logic of updating the UI onmount if a user has carried out a certain step or not * Implementing the functions to carryout the logic of updating the UI onmount if a user has carried out a certain step or not * making some chnages * finished the onBoarding task * updated some logic * Removed the uneeded svg from the static folder * fixed isCoursePublished not returning a boolean * improved the setup link protection * chore: make menuItems reactive * improve formatting * format supabase queries --------- Co-authored-by: Rotimi Best <best@classroomio.com> * revamp setup * improve the upgrade experience * migration * feat: add lemonsqueezy customer portal --------- Co-authored-by: emmanuel <chifez1@gmail.com>
2024-04-07 06:08:34 +01:00
parent 136e057954
commit fcd0bcc656
105 changed files with 1743 additions and 463 deletions
@@ -0,0 +1,46 @@
+<script>
+  import { Grid, Row, Column } from 'carbon-components-svelte';
+  import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
+  import { VARIANTS } from '$lib/components/PrimaryButton/constants';
+  import { currentOrgPlan, isFreePlan } from '$lib/utils/store/org';
+  import SectionTitle from '../SectionTitle.svelte';
+
+  let isRedirecting = false;
+
+  async function onOpenBilling() {
+    console.log({
+      plan: $currentOrgPlan
+    });
+
+    if ($currentOrgPlan?.subscriptionId) {
+      isRedirecting = true;
+      fetch('/api/lmz/subscriptions?subscriptionId=' + $currentOrgPlan?.subscriptionId)
+        .then((response) => response.json())
+        .then((res) => {
+          isRedirecting = false;
+          window.open(res.customerPortal, '_blank');
+        });
+    }
+  }
+</script>
+
+<Grid class="border-c rounded border-gray-200 dark:border-neutral-600 w-full mt-5">
+  <Row class="flex lg:flex-row flex-col py-7 border-bottom-c">
+    <Column sm={4} md={4} lg={4}><SectionTitle>Billing details</SectionTitle></Column>
+    <Column sm={8} md={8} lg={8}>
+      <h4 class="dark:text-white lg:mt-0">Manage your billing</h4>
+      {#if $isFreePlan}
+        You don't have any active billing
+      {:else}
+        <p class="mb-3">We use Lemonsqueezy to help manage your billing</p>
+
+        <PrimaryButton
+          label="Open billing"
+          variant={VARIANTS.CONTAINED_DARK}
+          onClick={onOpenBilling}
+          isLoading={isRedirecting}
+        />
+      {/if}
+    </Column>
+  </Row>
+</Grid>