From 18bf77afb3505502585557af7c12e95f9c0883d9 Mon Sep 17 00:00:00 2001
From: Michel Roegl-Brunner <michel.roegl-brunner@htl-braunau.at>
Date: Tue, 18 Mar 2025 15:40:36 +0100
Subject: [PATCH] Frontend

---
 frontend/src/app/api/versions/route.ts        |  5 +--
 .../app/scripts/_components/ScriptItem.tsx    | 32 +++++++++++++------
 frontend/src/lib/types.ts                     |  1 +
 3 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/frontend/src/app/api/versions/route.ts b/frontend/src/app/api/versions/route.ts
index db89160..6dabe96 100644
--- a/frontend/src/app/api/versions/route.ts
+++ b/frontend/src/app/api/versions/route.ts
@@ -15,11 +15,12 @@ const getVersions = async () => {
   const filePath = path.resolve(jsonDir, versionsFileName);
   const fileContent = await fs.readFile(filePath, encoding);
   const versions: AppVersion[] = JSON.parse(fileContent);
-
+  console.log("Versions: ", versions);
   const modifiedVersions = versions.map(version => {
     let newName = version.name;
+    // Ensure date is included in the returned object
     newName = newName.toLowerCase().replace(/[^a-z0-9/]/g, '');
-    return { ...version, name: newName };
+    return { ...version, name: newName};
   });
 
   return modifiedVersions;
diff --git a/frontend/src/app/scripts/_components/ScriptItem.tsx b/frontend/src/app/scripts/_components/ScriptItem.tsx
index 5ab26cd..deacd17 100644
--- a/frontend/src/app/scripts/_components/ScriptItem.tsx
+++ b/frontend/src/app/scripts/_components/ScriptItem.tsx
@@ -97,19 +97,31 @@ function ScriptItem({
                                         <div className="flex gap-5">
                                             <DefaultSettings item={item} />
                                         </div>
-                                        <div>
-                                            {versions.length === 0 ? (
-                                                <p>Loading versions...</p>
-                                            ) : (
-                                                <p>Version: { versions.find((v) =>
+                                        <div>{versions.length === 0 ? (<p>Loading versions...</p>) :
+                                            (<>
+                                                <p className="text-l text-foreground">Version:</p>
+                                                <p className="text-l text-muted-foreground">{versions.find((v) =>
+                                                    v.name === item.slug.replace(/[^a-z0-9]/g, '') ||
+                                                    v.name.includes(item.slug.replace(/[^a-z0-9]/g, '')) ||
+                                                    v.name.replace(/[^a-z0-9]/g, '') === item.slug.replace(/[^a-z0-9]/g, '')
+
+                                                )?.version || "No Version information found"
+                                                }</p>
+                                            <p className="text-l text-foreground">Latest changes:</p>
+                                            <p className="text-l text-muted-foreground">
+                                                {(() => {
+                                                    const matchedVersion = versions.find((v) =>
                                                         v.name === item.slug.replace(/[^a-z0-9]/g, '') ||
                                                         v.name.includes(item.slug.replace(/[^a-z0-9]/g, '')) ||
                                                         v.name.replace(/[^a-z0-9]/g, '') === item.slug.replace(/[^a-z0-9]/g, '')
-
-                                                    )?.version || "Not found"
-                                                }</p>
-                                            )}
-
+                                                    );
+                                                    return matchedVersion?.date ?
+                                                        extractDate(matchedVersion.date as unknown as string) :
+                                                        "No date information found"
+                                                })()}
+                                            </p>
+                                            </>)
+                                        }
                                         </div>
                                     </div>
                                 </div>
diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts
index c44ba4a..fb1fd60 100644
--- a/frontend/src/lib/types.ts
+++ b/frontend/src/lib/types.ts
@@ -51,6 +51,7 @@ export type Metadata = {
 export interface AppVersion {
     name: string;
     version: string;
+    date: Date;
 }
 
 export interface Version {