final touch

components/InputSelect/CollectionSelection.tsx

@@ -4,6 +4,7 @@ import { useEffect, useState } from "react";
 import { styles } from "./styles";
 import { Options } from "./types";
 import CreatableSelect from "react-select/creatable";
+import Select from "react-select";
 
 type Props = {
   onChange: any;
@@ -14,12 +15,14 @@ type Props = {
         value?: number;
       }
     | undefined;
+  creatable?: boolean;
 };
 
 export default function CollectionSelection({
   onChange,
   defaultValue,
   showDefaultValue = true,
+  creatable = true,
 }: Props) {
   const { collections } = useCollectionStore();
   const router = useRouter();
@@ -47,16 +50,31 @@ export default function CollectionSelection({
     setOptions(formatedCollections);
   }, [collections]);
 
-  return (
-    <CreatableSelect
-      isClearable={false}
-      className="react-select-container"
-      classNamePrefix="react-select"
-      onChange={onChange}
-      options={options}
-      styles={styles}
-      defaultValue={showDefaultValue ? defaultValue : null}
-      // menuPosition="fixed"
-    />
-  );
+  if (creatable) {
+    return (
+      <CreatableSelect
+        isClearable={false}
+        className="react-select-container"
+        classNamePrefix="react-select"
+        onChange={onChange}
+        options={options}
+        styles={styles}
+        defaultValue={showDefaultValue ? defaultValue : null}
+        // menuPosition="fixed"
+      />
+    );
+  } else {
+    return (
+      <Select
+        isClearable={false}
+        className="react-select-container"
+        classNamePrefix="react-select"
+        onChange={onChange}
+        options={options}
+        styles={styles}
+        defaultValue={showDefaultValue ? defaultValue : null}
+        // menuPosition="fixed"
+      />
+    );
+  }
 }

components/ModalContent/BulkEditLinksModal.tsx

@@ -20,6 +20,7 @@ export default function BulkEditLinksModal({ onClose }: Props) {
 
   const setCollection = (e: any) => {
     const collectionId = e?.value || null;
+    console.log(updatedValues);
     setUpdatedValues((prevValues) => ({ ...prevValues, collectionId }));
   };
 
@@ -66,6 +67,7 @@ export default function BulkEditLinksModal({ onClose }: Props) {
             <CollectionSelection
               showDefaultValue={false}
               onChange={setCollection}
+              creatable={false}
             />
           </div>
 
@@ -74,7 +76,7 @@ export default function BulkEditLinksModal({ onClose }: Props) {
             <TagSelection onChange={setTags} />
           </div>
         </div>
-        <div className="ml-auto w-1/2 p-3">
+        <div className="sm:ml-auto w-1/2 p-3">
           <label className="flex items-center gap-2 ">
             <input
               type="checkbox"

components/ModalContent/EditLinkModal.tsx

@@ -124,6 +124,7 @@ export default function EditLinkModal({ onClose, activeLink }: Props) {
                         label: "Unorganized",
                       }
                 }
+                creatable={false}
               />
             ) : null}
           </div>