From 760603da54ad87ab50f4b3803e84ea5029ff56c9 Mon Sep 17 00:00:00 2001
From: "CanbiZ (MickLesk)" <47820557+MickLesk@users.noreply.github.com>
Date: Wed, 28 Jan 2026 14:02:20 +0100
Subject: [PATCH] fix(frontend): use github-versions.json for version display

- Update AppVersion type to match new format with slug field
- Switch from versions.json to github-versions.json API
- Simplify version matching by direct slug comparison
- Remove 'Loading versions...' text - show nothing if no version found
---
 frontend/src/app/scripts/_components/script-item.tsx |  8 ++------
 frontend/src/hooks/use-versions.ts                   | 12 +++---------
 frontend/src/lib/data.ts                             |  2 +-
 frontend/src/lib/types.ts                            | 11 +++++++++--
 4 files changed, 15 insertions(+), 18 deletions(-)

diff --git a/frontend/src/app/scripts/_components/script-item.tsx b/frontend/src/app/scripts/_components/script-item.tsx
index 90ac3190e..4df85b745 100644
--- a/frontend/src/app/scripts/_components/script-item.tsx
+++ b/frontend/src/app/scripts/_components/script-item.tsx
@@ -6,7 +6,6 @@ import Image from "next/image";
 
 import type { AppVersion, Script } from "@/lib/types";
 
-import { cleanSlug } from "@/lib/utils/resource-utils";
 import { Separator } from "@/components/ui/separator";
 import { useVersions } from "@/hooks/use-versions";
 import { basePath } from "@/config/site-config";
@@ -108,13 +107,10 @@ function VersionInfo({ item }: { item: Script }) {
   const { data: versions = [], isLoading } = useVersions();
 
   if (isLoading || versions.length === 0) {
-    return <p className="text-sm text-muted-foreground">Loading versions...</p>;
+    return null;
   }
 
-  const matchedVersion = versions.find((v: AppVersion) => {
-    const cleanName = v.name.replace(/[^a-z0-9]/gi, "").toLowerCase();
-    return cleanName === cleanSlug(item.slug) || cleanName.includes(cleanSlug(item.slug));
-  });
+  const matchedVersion = versions.find((v: AppVersion) => v.slug === item.slug);
 
   if (!matchedVersion)
     return null;
diff --git a/frontend/src/hooks/use-versions.ts b/frontend/src/hooks/use-versions.ts
index 566dc5834..31de4d20d 100644
--- a/frontend/src/hooks/use-versions.ts
+++ b/frontend/src/hooks/use-versions.ts
@@ -2,7 +2,7 @@
 
 import { useQuery } from "@tanstack/react-query";
 
-import type { AppVersion } from "@/lib/types";
+import type { AppVersion, GitHubVersionsResponse } from "@/lib/types";
 
 import { fetchVersions } from "@/lib/data";
 
@@ -10,14 +10,8 @@ export function useVersions() {
   return useQuery<AppVersion[]>({
     queryKey: ["versions"],
     queryFn: async () => {
-      const fetchedVersions = await fetchVersions();
-      if (Array.isArray(fetchedVersions)) {
-        return fetchedVersions;
-      }
-      if (fetchedVersions && typeof fetchedVersions === "object") {
-        return [fetchedVersions];
-      }
-      return [];
+      const response: GitHubVersionsResponse = await fetchVersions();
+      return response.versions ?? [];
     },
   });
 }
diff --git a/frontend/src/lib/data.ts b/frontend/src/lib/data.ts
index 9119f5dfc..bd437fe02 100644
--- a/frontend/src/lib/data.ts
+++ b/frontend/src/lib/data.ts
@@ -10,7 +10,7 @@ export async function fetchCategories() {
 }
 
 export async function fetchVersions() {
-  const response = await fetch(`/ProxmoxVE/api/versions`);
+  const response = await fetch(`/ProxmoxVE/api/github-versions`);
   if (!response.ok) {
     throw new Error(`Failed to fetch versions: ${response.statusText}`);
   }
diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts
index e0c32adac..c20f1f5e4 100644
--- a/frontend/src/lib/types.ts
+++ b/frontend/src/lib/types.ts
@@ -63,7 +63,14 @@ export type OperatingSystem = {
 };
 
 export type AppVersion = {
-  name: string;
+  slug: string;
+  repo: string;
   version: string;
-  date: Date;
+  pinned: boolean;
+  date: string;
+};
+
+export type GitHubVersionsResponse = {
+  generated: string;
+  versions: AppVersion[];
 };