Improve Item page

Add 500 page and dedicated 404 page
Add fake cache to tester API
Adjust some styles for better readability and usability

front/src/lib/test-api.js

@@ -1,19 +1,32 @@
 import Items from '%/lib/test-data.js';
 
+let cache = {};
+
+
 async function fakeDelay(timeout = 1000) {
     await new Promise(resolve => setTimeout(resolve, timeout));
 }
 
 export async function getAnnouncements() {
+    if (cache.announcement_banner !== undefined) {
+        return cache.announcement_banner;
+    }
+
     const data = {
         image: "/BannerExampleImage.jpg",
     };
-    await fakeDelay(2000)
+    cache.announcement_banner = data;
+    await fakeDelay(5000)
     return data;
 }
 
 export async function getPopularToday() {
+    if (cache.popular_today !== undefined) {
+        return cache.popular_today;
+    }
+
     const data = Items;
+    cache.popular_today = data;
     await fakeDelay(2000)
     return data;
 }
@@ -33,6 +46,24 @@ export async function getMenuItems() {
             items: Items,
         },
     ];
-    await fakeDelay(2000)
+    await fakeDelay(20)
     return data;
 }
+
+export async function getItemByUUID(uuid) {
+    let data;
+
+    Items.forEach((item) => {
+        if (item.uuid === uuid) {
+            data = item;
+        }
+    })
+
+    await fakeDelay(1000)
+
+    if (!data) {
+        throw new Error("Resource could not be found");
+    }
+
+    return data;
+}

front/src/lib/test-data.js

@@ -7,6 +7,7 @@ const Items = [
         name: "Bar of Soap",
         price: 69.99,
         labels: ["vegan", "spicy"],
+        detail: "Example",
     },
     // sock: {
     {
@@ -14,6 +15,7 @@ const Items = [
         name: "Sock",
         price: 21,
         labels: ["vegan", "fish", "nut", "spicy"],
+        detail: "Example",
     },
     // brick: {
     {
@@ -21,6 +23,7 @@ const Items = [
         name: "Brick",
         price: 0,
         labels: ["spicy"],
+        detail: "Example",
     },
     // toast: {
     {
@@ -28,6 +31,7 @@ const Items = [
         name: "Toast",
         price: 4382749832743,
         labels: ["gluten"],
+        detail: "Example",
     },
     // water: {
     {
@@ -35,6 +39,7 @@ const Items = [
         name: "water",
         price: 1,
         labels: ["fish"],
+        detail: "Example",
     },
     // mouldy_bread: {
     {
@@ -42,6 +47,7 @@ const Items = [
         name: "half eaten mouldy bread",
         price: -99,
         labels: ["nut"],
+        detail: "Example",
     },
     // gwagwa: {
     {
@@ -58,6 +64,7 @@ const Items = [
         price: "1111",
         labels: ["fish"],
         image: "/wathog.jpg",
+        detail: "Example",
     },
     // bluhog: {
     {
@@ -66,6 +73,7 @@ const Items = [
         price: "ARUGH",
         labels: ["nut", "gluten", "spicy"],
         image: "/sonichog.jpg",
+        detail: "Example",
     },
 ];