final touch

components/InputSelect/CollectionSelection.tsx

@@ -10,11 +10,11 @@ type Props = {
   onChange: any;
   showDefaultValue?: boolean;
   defaultValue?:
-  | {
+    | {
-    label: string;
+        label: string;
-    value?: number;
+        value?: number;
-  }
+      }
-  | undefined;
+    | undefined;
   creatable?: boolean;
 };
 
@@ -44,7 +44,13 @@ export default function CollectionSelection({
 
   useEffect(() => {
     const formatedCollections = collections.map((e) => {
-      return { value: e.id, label: e.name, ownerId: e.ownerId, count: e._count, parentId: e.parentId };
+      return {
+        value: e.id,
+        label: e.name,
+        ownerId: e.ownerId,
+        count: e._count,
+        parentId: e.parentId,
+      };
     });
 
     setOptions(formatedCollections);
@@ -63,26 +69,22 @@ export default function CollectionSelection({
 
     // Have the top level parent at beginning
     return parentNames.reverse();
-  }
+  };
 
   const customOption = ({ data, innerProps }: any) => {
     return (
       <div
         {...innerProps}
-        className='px-2 py-2 last:border-0 border-b border-neutral-content hover:bg-primary/20 cursor-pointer'
+        className="px-2 py-2 last:border-0 border-b border-neutral-content hover:bg-neutral-content cursor-pointer"
       >
         <div className="flex w-full justify-between items-center">
-          <span>
+          <span>{data.label}</span>
-            {data.label}
+          <span className="text-sm text-neutral">{data.count?.links}</span>
-          </span>
-          <span>
-            {data.count?.links}
-          </span>
         </div>
         <div className="text-xs text-gray-600 dark:text-gray-300">
           {getParentNames(data?.parentId).length > 0 ? (
             <>
-              {getParentNames(data.parentId).join(' > ')} {'>'} {data.label}
+              {getParentNames(data.parentId).join(" > ")} {">"} {data.label}
             </>
           ) : (
             data.label
@@ -105,7 +107,7 @@ export default function CollectionSelection({
         components={{
           Option: customOption,
         }}
-      // menuPosition="fixed"
+        // menuPosition="fixed"
       />
     );
   } else {
@@ -118,7 +120,10 @@ export default function CollectionSelection({
         options={options}
         styles={styles}
         defaultValue={showDefaultValue ? defaultValue : null}
-      // menuPosition="fixed"
+        components={{
+          Option: customOption,
+        }}
+        // menuPosition="fixed"
       />
     );
   }

components/Sidebar.tsx

@@ -5,7 +5,7 @@ import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 import { Disclosure, Transition } from "@headlessui/react";
 import SidebarHighlightLink from "@/components/SidebarHighlightLink";
-import CollectionSelection from "@/components/CollectionSelection";
+import CollectionListing from "@/components/CollectionListing";
 
 export default function Sidebar({ className }: { className?: string }) {
   const [tagDisclosure, setTagDisclosure] = useState<boolean>(() => {
@@ -99,7 +99,7 @@ export default function Sidebar({ className }: { className?: string }) {
           leaveTo="transform opacity-0 -translate-y-3"
         >
           <Disclosure.Panel>
-            <CollectionSelection links={true} />
+            <CollectionListing links={true} />
           </Disclosure.Panel>
         </Transition>
       </Disclosure>

lib/api/controllers/links/postLink.ts

@@ -22,8 +22,69 @@ export default async function postLink(
     };
   }
 
-  if (!link.collection.name) {
+  if (!link.collection.id && link.collection.name) {
+    link.collection.name = link.collection.name.trim();
+
+    // find the collection with the name and the user's id
+    const findCollection = await prisma.collection.findFirst({
+      where: {
+        name: link.collection.name,
+        ownerId: userId,
+        parentId: link.collection.parentId,
+      },
+    });
+
+    if (findCollection) {
+      const collectionIsAccessible = await getPermission({
+        userId,
+        collectionId: findCollection.id,
+      });
+
+      const memberHasAccess = collectionIsAccessible?.members.some(
+        (e: UsersAndCollections) => e.userId === userId && e.canCreate
+      );
+
+      if (!(collectionIsAccessible?.ownerId === userId || memberHasAccess))
+        return { response: "Collection is not accessible.", status: 401 };
+
+      link.collection.id = findCollection.id;
+    } else {
+      const collection = await prisma.collection.create({
+        data: {
+          name: link.collection.name,
+          ownerId: userId,
+        },
+      });
+
+      link.collection.id = collection.id;
+    }
+  } else if (link.collection.id) {
+    const collectionIsAccessible = await getPermission({
+      userId,
+      collectionId: link.collection.id,
+    });
+
+    const memberHasAccess = collectionIsAccessible?.members.some(
+      (e: UsersAndCollections) => e.userId === userId && e.canCreate
+    );
+
+    if (!(collectionIsAccessible?.ownerId === userId || memberHasAccess))
+      return { response: "Collection is not accessible.", status: 401 };
+  } else if (!link.collection.id) {
     link.collection.name = "Unorganized";
+    link.collection.parentId = null;
+
+    // find the collection with the name "Unorganized" and the user's id
+    const unorganizedCollection = await prisma.collection.findFirst({
+      where: {
+        name: "Unorganized",
+        ownerId: userId,
+      },
+    });
+
+    link.collection.id = unorganizedCollection?.id;
+  } else {
+    return { response: "Uncaught error.", status: 500 };
   }
 
   const numberOfLinksTheUserHas = await prisma.link.count({
@@ -42,22 +103,6 @@ export default async function postLink(
 
   link.collection.name = link.collection.name.trim();
 
-  if (link.collection.id) {
-    const collectionIsAccessible = await getPermission({
-      userId,
-      collectionId: link.collection.id,
-    });
-
-    const memberHasAccess = collectionIsAccessible?.members.some(
-      (e: UsersAndCollections) => e.userId === userId && e.canCreate
-    );
-
-    if (!(collectionIsAccessible?.ownerId === userId || memberHasAccess))
-      return { response: "Collection is not accessible.", status: 401 };
-  } else {
-    link.collection.ownerId = userId;
-  }
-
   const description =
     link.description && link.description !== ""
       ? link.description
@@ -86,14 +131,8 @@ export default async function postLink(
       description,
       type: linkType,
       collection: {
-        connectOrCreate: {
+        connect: {
-          where: {
+          id: link.collection.id,
-            id: link.collection.id ?? 0,
-          },
-          create: {
-            name: link.collection.name.trim(),
-            ownerId: userId
-          },
         },
       },
       tags: {

prisma/schema.prisma

@@ -163,4 +163,3 @@ model AccessToken {
   createdAt  DateTime  @default(now())
   updatedAt  DateTime  @default(now()) @updatedAt
 }
-