From a67cafeb4db4d56ebf940b157c42f45b44bd5f88 Mon Sep 17 00:00:00 2001
From: sembauke <semboot699@gmail.com>
Date: Wed, 22 Nov 2023 16:16:21 +0100
Subject: [PATCH] fix: be able to delete image

---
 .../frontend/src/components/editor-drawer.jsx |  3 +++
 apps/frontend/src/components/post-form.jsx    | 24 +++++++++++++++----
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/apps/frontend/src/components/editor-drawer.jsx b/apps/frontend/src/components/editor-drawer.jsx
index 34c4118a7..8a462ff2e 100644
--- a/apps/frontend/src/components/editor-drawer.jsx
+++ b/apps/frontend/src/components/editor-drawer.jsx
@@ -83,6 +83,8 @@ const EditorDrawer = ({
   const handleFileInputChange = async (event) => {
     const file = event.target.files[0];
 
+    if (!file) return;
+
     const apiBase = process.env.NEXT_PUBLIC_STRAPI_BACKEND_URL;
 
     const formData = new FormData();
@@ -99,6 +101,7 @@ const EditorDrawer = ({
 
     if (response.status === 200) {
       const data = await response.json();
+
       handleFeatureImageChange(new URL(data[0].url, apiBase), data[0].id);
     }
   };
diff --git a/apps/frontend/src/components/post-form.jsx b/apps/frontend/src/components/post-form.jsx
index 233f25814..a1005923f 100644
--- a/apps/frontend/src/components/post-form.jsx
+++ b/apps/frontend/src/components/post-form.jsx
@@ -46,6 +46,7 @@ const PostForm = ({ tags, user, authors, post }) => {
 
   useEffect(() => {
     if (post) {
+      const apiBase = process.env.NEXT_PUBLIC_STRAPI_BACKEND_URL;
       const { title, body, slug, tags, feature_image } = post.attributes;
       const tagIds = tags.data.map((tag) => tag.id);
 
@@ -56,9 +57,12 @@ const PostForm = ({ tags, user, authors, post }) => {
       setPostId(post.id);
       setPostTagId(tagIds);
 
-      setFeatureImageUrl(feature_image);
-
-      console.log(post.attributes);
+      if (feature_image.data) {
+        setFeatureImageUrl(
+          new URL(feature_image.data[0].attributes.url, apiBase),
+        );
+        setFeatureImageId(feature_image.data[0].id);
+      }
     }
   }, [post]);
 
@@ -100,7 +104,7 @@ const PostForm = ({ tags, user, authors, post }) => {
       const data = {
         data: {
           title: title,
-          feature_image: [featureImageId],
+          feature_image: featureImageId !== null ? [featureImageId] : [],
           slug: slugify(
             postUrl != "" ? postUrl : title != "(UNTITLED)" ? title : nonce,
             {
@@ -176,7 +180,17 @@ const PostForm = ({ tags, user, authors, post }) => {
         });
       }
     },
-    [toast, title, postUrl, postTagId, content, author, postId, user],
+    [
+      toast,
+      title,
+      postUrl,
+      postTagId,
+      featureImageId,
+      content,
+      author,
+      postId,
+      user,
+    ],
   );
 
   useEffect(() => {