From 6745abc9da289209b38268eb11ec4682f552746d Mon Sep 17 00:00:00 2001
From: Alie <bizcochito@anartist.org>
Date: Fri, 6 Sep 2024 23:01:29 +0200
Subject: [PATCH] Fix: issue where backend is being called twice

---
 Dockerfile                                    |  2 +-
 .../ImageModerator/ImageModerator.tsx         | 40 ++++++++++---------
 2 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 70716be..f3b2767 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,4 +1,4 @@
-FROM oven/bun:1 as install
+FROM oven/bun:1 AS install
 RUN mkdir -p /temp/prod
 COPY package.json bun.lockb /temp/prod/
 RUN cd /temp/prod && bun install --frozen-lockfile
diff --git a/src/components/ImageModerator/ImageModerator.tsx b/src/components/ImageModerator/ImageModerator.tsx
index 0bb477b..887e05d 100644
--- a/src/components/ImageModerator/ImageModerator.tsx
+++ b/src/components/ImageModerator/ImageModerator.tsx
@@ -52,26 +52,28 @@ export default function ImageModerator({
   }
 
   const getNewImage = () => {
-    setImageData({ url: "", tags: [] });
-    fetch(`${middlewareUrl}/image`, {
-      method: "GET",
-    })
-      .then((response) => {
-        if (!response.ok) throw new Error("Response was not ok");
-        return response.json();
+    if (isLoading) {
+      setImageData({ url: "", tags: [] });
+      fetch(`${middlewareUrl}/image`, {
+        method: "GET",
       })
-      .then((data) => {
-        const url = data.url;
-        const tags = data.tags;
-        setImageData({ url, tags });
-      })
-      .catch((error) => {
-        setImageAlt("Error");
-        console.error(error);
-      })
-      .finally(() => {
-        setIsLoading(false);
-      });
+        .then((response) => {
+          if (!response.ok) throw new Error("Response was not ok");
+          return response.json();
+        })
+        .then((data) => {
+          const url = data.url;
+          const tags = data.tags;
+          setImageData({ url, tags });
+        })
+        .catch((error) => {
+          setImageAlt("Error");
+          console.error(error);
+        })
+        .finally(() => {
+          setIsLoading(false);
+        });
+    }
   };
 
   useEffect(getNewImage, [isLoading]);