add LTD counter

src/lib/components/DiscountBanner.svelte

@@ -18,7 +18,7 @@
             <div class="card bg-[#000] w-full">
                 <figure><img class="rounded-xl" src={discountBanner} alt="discount" /></figure>
                 <div class="card-body">
-                    <h2 class="card-title">Limited Offer: </h2>
+                    <h2 class="card-title">Only 100 Slots left: </h2>
                     <p>If a dog chews shoes whose shoes does he choose?</p>
                     <div class="card-actions justify-end">
                     <a href="/pricing" class="btn btn-primary">Buy Now</a>

src/lib/components/Pricing.svelte

@@ -309,7 +309,7 @@ onMount(async () => {
                     <li class="flex items-center space-x-3 ">
                         
                         <svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><mask id="ipSSuccess0"><g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#fff" stroke="#fff" d="m24 4l5.253 3.832l6.503-.012l1.997 6.188l5.268 3.812L41 24l2.021 6.18l-5.268 3.812l-1.997 6.188l-6.503-.012L24 44l-5.253-3.832l-6.503.012l-1.997-6.188l-5.268-3.812L7 24l-2.021-6.18l5.268-3.812l1.997-6.188l6.503.012L24 4Z"/><path stroke="#09090B" d="m17 24l5 5l10-10"/></g></mask><path fill="#10db06" d="M0 0h48v48H0z" mask="url(#ipSSuccess0)"/></svg>
-                        <span class="text-white text-[1rem] font-semibold">Only Limited Offer.</span>
+                        <span class="text-white text-[1rem] font-semibold">Only Only 100 Slots left.</span>
                     </li>
                 </ol>
 

src/routes/+page.server.ts

@@ -3,17 +3,31 @@ import { validateData } from "$lib/utils";
 import { loginUserSchema, registerUserSchema } from "$lib/schemas";
 
 
-/*
+export const load = async () => {
-export const load = ({ cookies }) => {
 
-	const subscribeToPro = cookies?.get('pricing-model')
+	const apiKey = import.meta.env.VITE_LEMON_SQUEEZY_API_KEY;
-  
+	
-	return {
+	const getLTDCount = async () => {
-		subscribeToPro: subscribeToPro ?? undefined,
+		  // make the POST request to the endpoint
+		  const response = await fetch('https://api.lemonsqueezy.com/v1/order-items?page[size]=100', {
+			headers: {
+				'Accept': 'application/vnd.api+json',
+				'Content-Type': 'application/vnd.api+json',
+				'Authorization': `Bearer ${apiKey}`
+			}
+		});
+		const output = await response.json();
+		const filteredData = output?.data?.filter(item => item?.attributes?.product_name === 'Pro Subscription (Life Time Access)');
+		const count = filteredData?.length || 0;
+		
+		return count;
 	};
+
+	return {
+		getLTDCount: await getLTDCount(),
+	  };
   };
 
-*/
 
 async function checkDisposableEmail(email) {
 	const url = `https://disposable.debounce.io/?email=${encodeURIComponent(email)}`;

src/routes/+page.ts

@@ -5,7 +5,7 @@ import { redirect } from '@sveltejs/kit';
 export const load = async ({parent}) => {
 
   const { user } = await parent();
-
+  
   if (user) {
 		redirect(303, '/home');
 	}

src/routes/pricing/+page.server.ts

@@ -3,18 +3,34 @@ import { validateData } from "$lib/utils";
 import { loginUserSchema, registerUserSchema } from "$lib/schemas";
 
 
-/*
-export const load = ({ cookies }) => {
 
-	const subscribeToPro = cookies?.get('pricing-model')
+export const load = async () => {
-  
+
-	return {
+	const apiKey = import.meta.env.VITE_LEMON_SQUEEZY_API_KEY;
-		subscribeToPro: subscribeToPro ?? undefined,
+	
+	const getLTDCount = async () => {
+		  // make the POST request to the endpoint
+		  const response = await fetch('https://api.lemonsqueezy.com/v1/order-items?page[size]=100', {
+			headers: {
+				'Accept': 'application/vnd.api+json',
+				'Content-Type': 'application/vnd.api+json',
+				'Authorization': `Bearer ${apiKey}`
+			}
+		});
+		const output = await response.json();
+		const filteredData = output?.data?.filter(item => item?.attributes?.product_name === 'Pro Subscription (Life Time Access)');
+		const count = filteredData?.length || 0;
+		
+		return count;
 	};
+
+	return {
+		getLTDCount: await getLTDCount(),
+	  };
   };
 
-*/
 
+  
 
 export const actions = {
 	

src/routes/pricing/+page.svelte

@@ -377,7 +377,7 @@ async function purchasePlan(subscriptionType:string='') {
 
                 <div class="absolute top-0 left-1/2 transform -translate-x-1/2 rounded-b-2xl flex flex-row border border-gray-300 items-center p-2">
                     <span class="text-white text-md font-semibold px-3">
-                        Limited Offer
+                        Only {100-data?.getLTDCount} Slots left
                     </span>
                 </div>          
 
@@ -411,7 +411,7 @@ async function purchasePlan(subscriptionType:string='') {
                     <li class="flex items-center space-x-3 ">
                         
                         <svg class="flex-shrink-0 w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><mask id="ipSSuccess0"><g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path fill="#fff" stroke="#fff" d="m24 4l5.253 3.832l6.503-.012l1.997 6.188l5.268 3.812L41 24l2.021 6.18l-5.268 3.812l-1.997 6.188l-6.503-.012L24 44l-5.253-3.832l-6.503.012l-1.997-6.188l-5.268-3.812L7 24l-2.021-6.18l5.268-3.812l1.997-6.188l6.503.012L24 4Z"/><path stroke="#09090B" d="m17 24l5 5l10-10"/></g></mask><path fill="#10db06" d="M0 0h48v48H0z" mask="url(#ipSSuccess0)"/></svg>
-                        <span class="text-white text-[1rem] font-semibold">Only Limited Offer.</span>
+                        <span class="text-white text-[1rem] font-semibold">Only Only 100 Slots left.</span>
                     </li>
                 </ol>