From 557cff37ab260cebef3780c52b6724cc3ac88581 Mon Sep 17 00:00:00 2001
From: Tim <47184194+imgde@users.noreply.github.com>
Date: Thu, 5 Jun 2025 10:50:09 +0200
Subject: [PATCH] Adopt frontend to take in base64 images

---
 .../de/htwsaar/webshop/controller/ImageController.java   | 2 +-
 01-frontend/src/helper/homepage/ItemCard.tsx             | 9 +++++----
 01-frontend/src/helper/productpage/ProductInfo.tsx       | 7 ++++---
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/00-backend/src/main/java/de/htwsaar/webshop/controller/ImageController.java b/00-backend/src/main/java/de/htwsaar/webshop/controller/ImageController.java
index 9824ab8..9126a5e 100644
--- a/00-backend/src/main/java/de/htwsaar/webshop/controller/ImageController.java
+++ b/00-backend/src/main/java/de/htwsaar/webshop/controller/ImageController.java
@@ -45,7 +45,7 @@ public class ImageController {
         return ResponseEntity.ok(images_base);
     }
 
-    @RequestMapping(path = IMAGE_BASE, method = RequestMethod.GET, produces = "image/*")
+    @RequestMapping(path = IMAGE_BASE, method = RequestMethod.GET, produces = "text/plain")
     public ResponseEntity<String> getFirst(HttpServletRequest request,
                                              @RequestParam(value = PARAM_UUID) UUID uuid) {
         logRequest(request);
diff --git a/01-frontend/src/helper/homepage/ItemCard.tsx b/01-frontend/src/helper/homepage/ItemCard.tsx
index 57f64d7..237f2bc 100644
--- a/01-frontend/src/helper/homepage/ItemCard.tsx
+++ b/01-frontend/src/helper/homepage/ItemCard.tsx
@@ -26,11 +26,12 @@ export default function ItemCard({ item }: { item: Item }) {
     useEffect(() => {
         const fetchImage = async () => {
             try {
-                const response = await fetch(`http://localhost:8085/image?uuid=${item.uuid}`);
-                const data = await response.json();
-                if (data.uri) {
-                    setImageUrl(data.uri); // Bild-URL setzen
+                const response = await fetch(`http://localhost:8085/image?uuid=${item.uuid}`); //image/* as base64
+                const data = await response.text();
+                if(data.length == 0) {
+                    console.error("Got emtpy picture for article ", item.uuid);
                 }
+                setImageUrl("data:image/jpeg;base64," + data);
             } catch (error) {
                 console.error("Fehler beim Laden des Bildes:", error);
             }
diff --git a/01-frontend/src/helper/productpage/ProductInfo.tsx b/01-frontend/src/helper/productpage/ProductInfo.tsx
index 00234cc..98f556c 100644
--- a/01-frontend/src/helper/productpage/ProductInfo.tsx
+++ b/01-frontend/src/helper/productpage/ProductInfo.tsx
@@ -59,10 +59,11 @@ export default function ProductInfo({ item }: { item: Item }) {
         const fetchImage = async () => {
             try {
                 const response = await fetch(`http://localhost:8085/image?uuid=${item.uuid}`);
-                const data = await response.json();
-                if (data.uri) {
-                    setImageUrl(data.uri); // Bild-URL setzen
+                const data = await response.text();
+                if(data.length == 0) {
+                    console.error("Got emtpy picture for article ", item.uuid);
                 }
+                setImageUrl("data:image/jpeg;base64," + data);
             } catch (error) {
                 console.error("Fehler beim Laden des Bildes:", error);
             }