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"
+      />
+    );
+  }
 }