Switch from Pocketbase data retrieval to JSON

.github/workflows/deploy-pages.yml

@@ -9,6 +9,7 @@ on:
     branches: ["main"]
     paths:
       - frontend/**
+      - json/**
 
   workflow_dispatch:
 
@@ -57,14 +58,6 @@ jobs:
         uses: actions/configure-pages@v5
         with:
           static_site_generator: next
-      - name: Restore cache
-        uses: actions/cache@v4
-        with:
-          path: |
-            frontend/.next/cache
-          key: ${{ runner.os }}-nextjs-${{ hashFiles('frontend/**/package-lock.json', 'frontend/**/yarn.lock') }}-${{ hashFiles('frontend/**.[jt]s', 'frontend/**.[jt]sx') }}
-          restore-keys: |
-            ${{ runner.os }}-nextjs-${{ hashFiles('frontend/**/package-lock.json', 'frontend/**/yarn.lock') }}-
       - name: Install dependencies
         run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }} --legacy-peer-deps
       - name: Build with Next.js

frontend/next.config.mjs

@@ -15,11 +15,11 @@ const nextConfig = {
   },
 
   env: {
-    NEXT_PUBLIC_BUILD_TIME: `${Date.now()}`,
+    BASE_PATH: "ProxmoxVE",
   },
 
   output: "export",
-  basePath: "/ProxmoxVE",
+  basePath: `/${process.env.BASE_PATH}`,
 };
 
 export default nextConfig;

frontend/package.json

@@ -22,6 +22,7 @@
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
+    "@radix-ui/react-icons": "^1.3.1",
     "@radix-ui/react-navigation-menu": "^1.1.4",
     "@radix-ui/react-separator": "^1.1.0",
     "@radix-ui/react-slot": "^1.1.0",
@@ -31,7 +32,7 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "cmdk": "^1.0.0",
-    "framer-motion": "^11.11.10",
+    "framer-motion": "^11.11.11",
     "fuse.js": "^7.0.0",
     "lucide-react": "^0.453.0",
     "mini-svg-data-uri": "^1.4.4",

frontend/src/app/api/categories/route.ts

@@ -1,23 +1,45 @@
-import { pb } from "@/lib/pocketbase";
-import { Category } from "@/lib/types";
+import { basePath } from "@/config/siteConfig";
+import { Category, Script } from "@/lib/types";
 import { NextResponse } from "next/server";
 
 export const dynamic = "force-static";
 
+const fetchCategories = async (): Promise<Category[]> => {
+  const response = await fetch(
+    `https://raw.githubusercontent.com/community-scripts/${basePath}/refs/heads/main/json/metadata.json`,
+  );
+  const data = await response.json();
+  return data.categories;
+};
+
+const fetchScripts = async (): Promise<Script[]> => {
+  const response = await fetch(
+    `https://api.github.com/repos/community-scripts/${basePath}/contents/json`,
+  );
+  const files: { download_url: string }[] = await response.json();
+  const scripts = await Promise.all(
+    files.map(async (file) : Promise<Script> => {
+      const response = await fetch(file.download_url);
+      const script = await response.json();
+      return script;
+    }),
+  );
+  return scripts;
+};
+
 export async function GET() {
   try {
-    const response = await pb.collection("categories").getFullList<Category>({
-      expand: "items.alerts,items.alpine_script,items.default_login",
-      sort: "order",
-    });
-
-    return NextResponse.json(response);
+    const categories = await fetchCategories();
+    const scripts = await fetchScripts();
+    for (const category of categories) {
+      category.scripts = scripts.filter((script) => script.categories.includes(category.id));
+    }
+    return NextResponse.json(categories);
   } catch (error) {
-    console.error("Error fetching categories:", error);
+    console.error(error as Error);
     return NextResponse.json(
       { error: "Failed to fetch categories" },
       { status: 500 },
     );
   }
 }
-

frontend/src/app/layout.tsx

@@ -6,6 +6,7 @@ import "@/styles/globals.css";
 import { Inter } from "next/font/google";
 import React from "react";
 import { NuqsAdapter } from "nuqs/adapters/next/app";
+import { analytics, basePath } from "@/config/siteConfig";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -34,15 +35,15 @@ export const metadata = {
     address: false,
     telephone: false,
   },
-  metadataBase: new URL("https://community-scripts.github.io/Proxmox/"),
+  metadataBase: new URL(`https://community-scripts.github.io/${basePath}/`),
   openGraph: {
     title: "Proxmox VE Helper-Scripts",
     description:
       "A Front-end for the Proxmox VE Helper-Scripts (Community) Repository. Featuring over 200+ scripts to help you manage your Proxmox VE environment.",
     url: "/defaultimg.png",
     images: [
       {
-        url: "https://community-scripts.github.io/Proxmox/defaultimg.png",
+        url: `https://community-scripts.github.io/${basePath}/defaultimg.png`,
       },
     ],
     locale: "en_US",
@@ -60,15 +61,20 @@ export default function RootLayout({
       <head>
         <script
           defer
-          src={`https://${process.env.NEXT_PUBLIC_ANALYTICS_URL}/script.js`}
-          data-website-id={process.env.NEXT_PUBLIC_ANALYTICS_TOKEN}
+          src={`https://${analytics.url}/script.js`}
+          data-website-id={analytics.token}
         ></script>
         <link rel="manifest" href="manifest.webmanifest" />
         <link rel="preconnect" href={process.env.NEXT_PUBLIC_POCKETBASE_URL} />
         <link rel="preconnect" href="https://api.github.com" />
       </head>
       <body className={inter.className}>
-        <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
+        <ThemeProvider
+          attribute="class"
+          defaultTheme="dark"
+          enableSystem
+          disableTransitionOnChange
+        >
           <div className="flex w-full flex-col justify-center">
             <Navbar />
             <div className="flex min-h-screen flex-col justify-center">

frontend/src/app/manifest.ts

@@ -1,3 +1,4 @@
+import { basePath } from "@/config/siteConfig";
 import type { MetadataRoute } from "next";
 
 export const generateStaticParams = () => {
@@ -9,13 +10,13 @@ export default function manifest(): MetadataRoute.Manifest {
     name: "Proxmox VE Helper-Scripts",
     short_name: "Proxmox VE Helper-Scripts",
     description:
-      "A Re-designed Front-end for the Proxmox VE Helper-Scripts Repository. Featuring over 150+ scripts to help you manage your Proxmox VE environment.",
+      "A Re-designed Front-end for the Proxmox VE Helper-Scripts Repository. Featuring over 200+ scripts to help you manage your Proxmox VE environment.",
     theme_color: "#030712",
     background_color: "#030712",
     display: "standalone",
     orientation: "portrait",
-    scope: "/Proxmox/",
-    start_url: "/Proxmox/",
+    scope: `${basePath}`,
+    start_url: `${basePath}`,
     icons: [
       {
         src: "logo.png",

frontend/src/app/page.tsx

@@ -11,6 +11,7 @@ import { useEffect, useState } from "react";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
 import { CardFooter } from "@/components/ui/card";
 import { FaGithub } from "react-icons/fa";
+import { basePath } from "@/config/siteConfig";
 
 function CustomArrowRightIcon() {
   return <ArrowRightIcon className="h-4 w-4" width={1} />;
@@ -80,7 +81,7 @@ export default function Page() {
                 </Button>
                 <Button className="w-full" asChild>
                   <a
-                    href="https://github.com/community-scripts/ProxmoxVE"
+                    href={`https://github.com/community-scripts/${basePath}`}
                     target="_blank"
                     rel="noopener noreferrer"
                     className="flex items-center justify-center"

frontend/src/app/robots.ts

@@ -1,3 +1,4 @@
+import { basePath } from "@/config/siteConfig";
 import type { MetadataRoute } from "next";
 
 export const dynamic = "force-static";
@@ -8,6 +9,6 @@ export default function robots(): MetadataRoute.Robots {
       userAgent: "*",
       allow: "/",
     },
-    sitemap: "https://community-scripts.github.io/Proxmox/sitemap.xml",
+    sitemap: `https://community-scripts.github.io/${basePath}/sitemap.xml`,
   };
 }