From a0a7ccc9526057f148fecebee9b85936c3636136 Mon Sep 17 00:00:00 2001
From: Daniel <daniel31x13@gmail.com>
Date: Sat, 27 May 2023 18:37:30 +0330
Subject: [PATCH] bug fixed

---
 components/CollectionCard.tsx        |  2 +-
 components/Modal/CollectionModal.tsx | 45 +++++++++++++++++-----------
 2 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/components/CollectionCard.tsx b/components/CollectionCard.tsx
index 34c8cd0..edbd678 100644
--- a/components/CollectionCard.tsx
+++ b/components/CollectionCard.tsx
@@ -85,7 +85,7 @@ export default function ({
                 .slice(0, 4)}
               {collection.members.length - 4 > 0 ? (
                 <div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-500 border-sky-100 -mr-3">
-                  +{collection.members.length - 3}
+                  +{collection.members.length - 4}
                 </div>
               ) : null}
             </div>
diff --git a/components/Modal/CollectionModal.tsx b/components/Modal/CollectionModal.tsx
index 989ea72..4938c52 100644
--- a/components/Modal/CollectionModal.tsx
+++ b/components/Modal/CollectionModal.tsx
@@ -8,6 +8,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import {
   faClose,
   faPenToSquare,
+  faPlus,
   faTrashCan,
   faUser,
   faUserPlus,
@@ -80,8 +81,8 @@ export default function CollectionModal({
 
     let response = null;
 
-    if (method === "CREATE") response = await updateCollection(collection);
-    else if (method === "UPDATE") response = await addCollection(collection);
+    if (method === "CREATE") response = await addCollection(collection);
+    else if (method === "UPDATE") response = await updateCollection(collection);
     else console.log("Unknown method.");
 
     if (response) toggleCollectionModal();
@@ -324,26 +325,36 @@ export default function CollectionModal({
           className="bg-sky-500 text-white flex items-center gap-2 py-2 px-5 rounded-md select-none font-bold cursor-pointer duration-100 hover:bg-sky-400"
           onClick={submit}
         >
-          <FontAwesomeIcon icon={faPenToSquare} className="h-5" />
-          Edit Collection
+          <FontAwesomeIcon
+            icon={method === "CREATE" ? faPlus : faPenToSquare}
+            className="h-5"
+          />
+          {method === "CREATE" ? "Add Collection" : "Edit Collection"}
         </div>
 
-        <div className="flex items-center justify-center gap-2">
-          <hr className="w-16 border" />
+        {method === "UPDATE" ? (
+          <>
+            <div className="flex items-center justify-center gap-2">
+              <hr className="w-16 border" />
 
-          <p className="text-gray-400 font-bold">OR</p>
+              <p className="text-gray-400 font-bold">OR</p>
 
-          <hr className="w-16 border" />
-        </div>
+              <hr className="w-16 border" />
+            </div>
 
-        <div
-          onClick={() => {
-            toggleDeleteCollectionModal();
-          }}
-          className="w-fit inline-flex rounded-md cursor-pointer bg-red-500 hover:bg-red-400 duration-100 p-2"
-        >
-          <FontAwesomeIcon icon={faTrashCan} className="w-4 h-4 text-white" />
-        </div>
+            <div
+              onClick={() => {
+                toggleDeleteCollectionModal();
+              }}
+              className="w-fit inline-flex rounded-md cursor-pointer bg-red-500 hover:bg-red-400 duration-100 p-2"
+            >
+              <FontAwesomeIcon
+                icon={faTrashCan}
+                className="w-4 h-4 text-white"
+              />
+            </div>
+          </>
+        ) : null}
       </div>
 
       {deleteCollectionModal ? (