docs

saadeghi · Aug 13, 2024 · cb75501 · cb75501
1 parent 31c1754
commit cb75501
Show file tree

Hide file tree

Showing 4 changed files with 458 additions and 401 deletions.
diff --git a/src/docs/src/lib/data/store.js b/src/docs/src/lib/data/store.js
@@ -1,68 +1,83 @@
-export const productCustomAttributes = {
-  284327: {
+export const productCustomAttributes = [
+  {
+    id: 244268,
+    screenshot: "https://img.daisyui.com/images/store/screenshots/nexus.webp",
+    tech: ["react", "nextjs"],
+    preveiw_url: "https://nexus.daisyui.com/",
+  },
+  {
+    id: 284327,
     screenshot: "https://img.daisyui.com/images/store/screenshots/documentation-template.webp",
     originalprice: 4900,
     displayprice: 2900,
     // displaypricenote: "with discount",
-    tech: ["astro", "mdx", "daisyui"],
+    tech: ["astro", "mdx"],
     // tags: ['Use code "JUNE40" for 40% discount'],
   },
-  244268: {
-    screenshot: "https://img.daisyui.com/images/store/screenshots/nexus.webp",
-    tech: ["react", "nextjs", "daisyui"],
-    preveiw_url: "https://nexus.daisyui.com/",
-  },
-  208203: {
+  {
+    id: 208203,
     screenshot: "https://img.daisyui.com/images/store/screenshots/blog-template.webp",
-    tech: ["astro", "mdx", "daisyui"],
+    tech: ["astro", "mdx"],
     tags: ["v1.1 released with new design"],
   },
-  185227: {
+  {
+    id: 185227,
     screenshot: "https://img.daisyui.com/images/store/screenshots/app-landingpage.webp",
-    tech: ["html", "react", "svelte", "vue", "alpine", "daisyui"],
+    tech: ["html", "react", "svelte", "vue", "alpine"],
     // tags: ["React + Svelte + Vue versions added"],
   },
-  144550: {
+  {
+    id: 144550,
     screenshot: "https://img.daisyui.com/images/store/screenshots/agency-landingpage-react.webp",
-    tech: ["react", "svelte", "vite", "framer", "daisyui"],
+    tech: ["react", "svelte", "vite", "framer"],
     // originalprice: 1900,
     // displayprice: 1400,
     // displaypricenote: "with discount",
     // tags: ["Svelte version added"],
   },
-  142623: {
+  {
+    id: 142623,
     screenshot: "https://img.daisyui.com/images/store/screenshots/saas-landingpage.webp",
-    tech: ["html", "react", "svelte", "vue", "alpine", "daisyui"],
+    tech: ["html", "react", "svelte", "vue", "alpine"],
     // tags: ["React + Svelte + Vue versions added"],
   },
-  130237: {
+  {
+    id: 130237,
     screenshot: "https://img.daisyui.com/images/store/screenshots/auth.webp",
-    tech: ["html", "daisyui"],
+    tech: ["html"],
     // ref: "VMAme",
   },
-  120591: {
+  {
+    id: 120591,
     screenshot: "https://img.daisyui.com/images/store/screenshots/dashboard.webp",
-    tech: ["html", "webcomponents", "daisyui"],
+    tech: ["html", "webcomponents"],
     // tags: ["Best Seller"],
     originalprice: 2900,
     displayprice: 2600,
     displaypricenote: "with discount",
     tags: ['Use code "DASHBOARD10" for 10% discount'],
   },
-}
+]
 
 export const tech = {
-  html: "HTML",
-  alpine: "Alpine.js",
-  react: "React",
-  svelte: "Svelte",
-  vue: "Vue",
-  vite: "Vite",
-  framer: "Framer Motion",
-  daisyui: "daisyUI",
-  tailwind: "Tailwind CSS",
-  webcomponents: "Web Components",
-  mdx: "MDX",
-  astro: "Astro",
-  nextjs: "Next.js",
+  html: { title: "HTML", bg: "#E54C20", fg: "#FFF" },
+  alpine: { title: "Alpine.js", bg: "#77C1D2", fg: "#000" },
+  react: { title: "React", bg: "#232730", fg: "#58C4DC" },
+  svelte: { title: "Svelte", bg: "#FF3E00", fg: "#FFF" },
+  vue: { title: "Vue", bg: "#3EB27F", fg: "#FFF" },
+  vite: { title: "Vite", bg: "#FFCE2B", fg: "#000" },
+  framer: { title: "Framer Motion", bg: "#000", fg: "#FFF" },
+  tailwind: { title: "Tailwind CSS", bg: "#38BDF9", fg: "#FFF" },
+  webcomponents: { title: "Web Components", bg: "#CDE23B", fg: "#000" },
+  mdx: { title: "MDX", bg: "#0A69DA", fg: "#FFF" },
+  astro: { title: "Astro", bg: "#E944B0", fg: "#FFF" },
+  nextjs: { title: "Next.js", bg: "#000", fg: "#FFF" },
 }
+
+export const techFilters = ["all", "html", "react", "vue", "svelte", "astro"]
+
+export const futureProducts = [
+  "Official daisyUI Figma Library",
+  "Headless UI + daisyUI component pack for React",
+  "Headless UI + daisyUI component pack for Vue",
+]
diff --git a/src/docs/src/routes/(docs)/store/+layout.server.js b/src/docs/src/routes/(docs)/store/+layout.server.js
@@ -1,5 +1,5 @@
 import { LEMONSQUEEZY_API_KEY } from "$env/static/private"
-import { productCustomAttributes, tech } from "$lib/data/store.js"
+import { productCustomAttributes, tech, techFilters, futureProducts } from "$lib/data/store.js"
 
 const LSParams = {
   headers: {
@@ -10,43 +10,30 @@ const LSParams = {
 }
 
 export async function load({ params }) {
-  const storeInfo = {
-    products: { data: [] },
-    discounts: { data: [] },
-  }
   const productsResponse = await fetch(
     "https://api.lemonsqueezy.com/v1/products?page[size]=100",
     LSParams
   )
-  const discountsResponse = await fetch(
-    "https://api.lemonsqueezy.com/v1/discounts?page[size]=100",
-    LSParams
-  )
-  if (productsResponse.ok) {
-    storeInfo.products = await productsResponse.json()
+  let sortedData
+  if (!productsResponse.ok) {
+    sortedData = []
+  } else {
+    const originalData = await productsResponse.json()
+    const additionalInfoMap = new Map(productCustomAttributes.map((item) => [item.id, item]))
+    sortedData = productCustomAttributes
+      .map(({ id }) => {
+        // Find the item in the original data by ID
+        const originalItem = originalData.data.find((item) => Number.parseInt(item.id) === id)
 
-    // sort products by id
-    storeInfo.products.data.sort((a, b) => {
-      return Number.parseInt(b.id) - Number.parseInt(a.id)
-    })
-    // add additional product data
-    for (const item of storeInfo.products.data) {
-      const itemId = item.id
-      if (productCustomAttributes[itemId]) {
-        item.customattributes = productCustomAttributes[itemId]
-      }
-    }
-  }
-  if (discountsResponse.ok) {
-    storeInfo.discounts = await discountsResponse.json()
-    // sort discounts by id
-    storeInfo.discounts.data.sort((a, b) => {
-      return Number.parseInt(b.id) - Number.parseInt(a.id)
-    })
+        // If found, merge the original item with the additional info
+        return originalItem ? { ...originalItem, ...additionalInfoMap.get(id) } : null
+      })
+      .filter((item) => item !== null) // Filter out null values
   }
   return {
     tech,
-    products: storeInfo.products,
-    discounts: storeInfo.discounts,
+    techFilters,
+    products: sortedData,
+    futureProducts,
   }
 }
diff --git a/src/docs/src/routes/(docs)/store/+layout.svelte b/src/docs/src/routes/(docs)/store/+layout.svelte
@@ -10,14 +10,6 @@ export let data
   <script src="https://lmsqueezy.com/affiliate.js" defer></script>
 </svelte:head>
 <div class="w-full px-4 pt-20 md:px-20" dir="ltr">
-  <div class="flex flex-col items-center gap-6">
-    <h1 class="font-title text-base-content text-3xl font-extrabold lg:text-4xl xl:text-6xl">
-      daisyUI store
-    </h1>
-    <p class="text-base-content/60 text-xs italic">Official templates made by daisyUI</p>
-  </div>
-  <div>
-    <slot />
-  </div>
+  <slot />
 </div>
 <Footer />