bug fix + cleaner code/logic

hooks/useLinks.tsx

@@ -4,41 +4,38 @@ import useDetectPageBottom from "./useDetectPageBottom";
 import { useRouter } from "next/router";
 import useLinkStore from "@/store/links";
 
-export default function useLinks({
+export default function useLinks(
+  {
     sort,
     searchFilter,
     searchQuery,
     pinnedOnly,
     collectionId,
     tagId,
-}: Omit<LinkRequestQuery, "cursor"> = {}) {
+  }: Omit<LinkRequestQuery, "cursor"> = { sort: 0 }
+) {
   const { links, setLinks, resetLinks } = useLinkStore();
   const router = useRouter();
 
   const hasReachedBottom = useDetectPageBottom();
 
   const getLinks = async (isInitialCall: boolean, cursor?: number) => {
+    const requestBody: LinkRequestQuery = {
+      cursor,
+      sort,
+      searchFilter,
+      searchQuery,
+      pinnedOnly,
+      collectionId,
+      tagId,
+    };
+
+    const encodedData = encodeURIComponent(JSON.stringify(requestBody));
+
+    console.log(encodedData);
+
     const response = await fetch(
-      `/api/routes/links?cursor=${cursor}${
+      `/api/routes/links?body=${encodeURIComponent(encodedData)}`
-        (sort ? "&sort=" + sort : "") +
-        (searchQuery && searchFilter
-          ? "&searchQuery=" +
-            searchQuery +
-            "&searchFilter=" +
-            searchFilter.name +
-            "-" +
-            searchFilter.url +
-            "-" +
-            searchFilter.description +
-            "-" +
-            searchFilter.collection +
-            "-" +
-            searchFilter.tags
-          : "") +
-        (collectionId ? "&collectionId=" + collectionId : "") +
-        (tagId ? "&tagId=" + tagId : "") +
-        (pinnedOnly ? "&pinnedOnly=" + pinnedOnly : "")
-      }`
     );
 
     const data = await response.json();

lib/api/controllers/links/getLinks.ts

@@ -1,25 +1,9 @@
 import { prisma } from "@/lib/api/db";
-import { LinkRequestQuery, LinkSearchFilter, Sort } from "@/types/global";
+import { LinkRequestQuery, Sort } from "@/types/global";
 
-export default async function getLink(userId: number, query: LinkRequestQuery) {
+export default async function getLink(userId: number, body: string) {
-  query.sort = Number(query.sort) || 0;
+  const query: LinkRequestQuery = JSON.parse(decodeURIComponent(body));
-  query.pinnedOnly = query.pinnedOnly
+  console.log(query);
-    ? JSON.parse(query.pinnedOnly as unknown as string)
-    : undefined;
-
-  if (query.searchFilter) {
-    const filterParams = (query.searchFilter as unknown as string).split("-");
-
-    query.searchFilter = {} as LinkSearchFilter;
-
-    query.searchFilter.name = JSON.parse(filterParams[0]);
-    query.searchFilter.url = JSON.parse(filterParams[1]);
-    query.searchFilter.description = JSON.parse(filterParams[2]);
-    query.searchFilter.collection = JSON.parse(filterParams[3]);
-    query.searchFilter.tags = JSON.parse(filterParams[4]);
-  }
-
-  console.log(query.searchFilter);
 
   // Sorting logic
   let order: any;
@@ -48,33 +32,28 @@ export default async function getLink(userId: number, query: LinkRequestQuery) {
       name: "desc",
     };
 
-  const links =
+  const links = await prisma.link.findMany({
-    // Searching logic
-    query.searchFilter && query.searchQuery
-      ? await prisma.link.findMany({
     take: Number(process.env.PAGINATION_TAKE_COUNT),
-          skip: query.cursor !== "undefined" ? 1 : undefined,
+    skip: query.cursor ? 1 : undefined,
-          cursor:
+    cursor: query.cursor
-            query.cursor !== "undefined"
       ? {
-                  id: Number(query.cursor),
+          id: query.cursor,
         }
       : undefined,
     where: {
-            OR: [
+      [query.searchQuery ? "OR" : "AND"]: [
+        {
+          pinnedBy: query.pinnedOnly ? { some: { id: userId } } : undefined,
+        },
         {
           name: {
-                  contains: query.searchFilter?.name
+            contains: query.searchFilter?.name ? query.searchQuery : undefined,
-                    ? query.searchQuery
-                    : undefined,
             mode: "insensitive",
           },
         },
         {
           url: {
-                  contains: query.searchFilter?.url
+            contains: query.searchFilter?.url ? query.searchQuery : undefined,
-                    ? query.searchQuery
-                    : undefined,
             mode: "insensitive",
           },
         },
@@ -88,13 +67,16 @@ export default async function getLink(userId: number, query: LinkRequestQuery) {
         },
         {
           collection: {
-                  name: {
+            id: query.collectionId ? query.collectionId : undefined, // If collectionId was defined, filter by collection
-                    contains: query.searchFilter?.collection
+            name: query.searchFilter?.collection
-                      ? query.searchQuery
+              ? {
-                      : undefined,
+                  contains: query.searchQuery,
                   mode: "insensitive",
-                  },
+                }
-                  OR: [
+              : undefined,
+            OR: query.searchQuery
+              ? undefined
+              : [
                   {
                     ownerId: userId,
                   },
@@ -109,15 +91,18 @@ export default async function getLink(userId: number, query: LinkRequestQuery) {
           },
         },
         {
-                tags: {
+          tags:
-                  // If tagId was defined, search by tag
+            query.searchQuery && !query.searchFilter?.tags
+              ? undefined
+              : {
                   some: {
-                    name: {
+                    id: query.tagId ? query.tagId : undefined, // If tagId was defined, filter by tag
-                      contains: query.searchFilter?.tags
+                    name: query.searchFilter?.tags
-                        ? query.searchQuery
+                      ? {
-                        : undefined,
+                          contains: query.searchQuery,
                           mode: "insensitive",
-                    },
+                        }
+                      : undefined,
                     OR: [
                       { ownerId: userId }, // Tags owned by the user
                       {
@@ -153,76 +138,9 @@ export default async function getLink(userId: number, query: LinkRequestQuery) {
         select: { id: true },
       },
     },
-          orderBy: order || undefined,
+    orderBy: order || {
-        })
+      createdAt: "desc",
-      : // If not searching
-        await prisma.link.findMany({
-          take: Number(process.env.PAGINATION_TAKE_COUNT),
-          skip: query.cursor !== "undefined" ? 1 : undefined,
-          cursor:
-            query.cursor !== "undefined"
-              ? {
-                  id: Number(query.cursor),
-                }
-              : undefined,
-          where: {
-            pinnedBy: query.pinnedOnly ? { some: { id: userId } } : undefined,
-            collection: {
-              id: query.collectionId && Number(query.collectionId), // If collectionId was defined, search by collection
-
-              OR: [
-                {
-                  ownerId: userId,
     },
-                {
-                  members: {
-                    some: {
-                      userId,
-                    },
-                  },
-                },
-              ],
-            },
-            tags: {
-              some: query.tagId // If tagId was defined, search by tag
-                ? {
-                    id: Number(query.tagId),
-                    OR: [
-                      { ownerId: userId }, // Tags owned by the user
-                      {
-                        links: {
-                          some: {
-                            collection: {
-                              members: {
-                                some: {
-                                  userId, // Tags from collections where the user is a member
-                                },
-                              },
-                            },
-                          },
-                        },
-                      },
-                    ],
-                  }
-                : undefined,
-            },
-          },
-          include: {
-            tags: true,
-            collection: {
-              select: {
-                id: true,
-                ownerId: true,
-                name: true,
-                color: true,
-              },
-            },
-            pinnedBy: {
-              where: { id: userId },
-              select: { id: true },
-            },
-          },
-          orderBy: order || undefined,
   });
 
   return { response: links, status: 200 };

lib/api/controllers/public/getCollection.ts

@@ -1,7 +1,10 @@
 import { prisma } from "@/lib/api/db";
 import { PublicLinkRequestQuery } from "@/types/global";
 
-export default async function getCollection(query: PublicLinkRequestQuery) {
+export default async function getCollection(body: string) {
+  const query: PublicLinkRequestQuery = JSON.parse(decodeURIComponent(body));
+  console.log(query);
+
   let data;
 
   const collection = await prisma.collection.findFirst({
@@ -14,9 +17,8 @@ export default async function getCollection(query: PublicLinkRequestQuery) {
   if (collection) {
     const links = await prisma.link.findMany({
       take: Number(process.env.PAGINATION_TAKE_COUNT),
-      skip: query.cursor !== "undefined" ? 1 : undefined,
+      skip: query.cursor ? 1 : undefined,
-      cursor:
+      cursor: query.cursor
-        query.cursor !== "undefined"
         ? {
             id: Number(query.cursor),
           }

lib/client/getPublicCollectionData.ts

@@ -1,16 +1,23 @@
-import { PublicCollectionIncludingLinks } from "@/types/global";
+import {
+  PublicCollectionIncludingLinks,
+  PublicLinkRequestQuery,
+} from "@/types/global";
 import { Dispatch, SetStateAction } from "react";
 
 const getPublicCollectionData = async (
-  collectionId: string,
+  collectionId: number,
   prevData: PublicCollectionIncludingLinks,
   setData: Dispatch<SetStateAction<PublicCollectionIncludingLinks | undefined>>
 ) => {
+  const requestBody: PublicLinkRequestQuery = {
+    cursor: prevData?.links?.at(-1)?.id,
+    collectionId,
+  };
+
+  const encodedData = encodeURIComponent(JSON.stringify(requestBody));
+
   const res = await fetch(
-    "/api/public/routes/collections?collectionId=" +
+    "/api/public/routes/collections?body=" + encodeURIComponent(encodedData)
-      collectionId +
-      "&cursor=" +
-      prevData?.links?.at(-1)?.id
   );
 
   const data = await res.json();

pages/api/public/routes/collections.ts

@@ -1,21 +1,18 @@
 import getCollection from "@/lib/api/controllers/public/getCollection";
-import { PublicLinkRequestQuery } from "@/types/global";
 import type { NextApiRequest, NextApiResponse } from "next";
 
 export default async function collections(
   req: NextApiRequest,
   res: NextApiResponse
 ) {
-  const query: PublicLinkRequestQuery = req.query;
+  if (!req?.query?.body) {
-
-  if (!query) {
     return res
       .status(401)
       .json({ response: "Please choose a valid collection." });
   }
 
   if (req.method === "GET") {
-    const collection = await getCollection(query);
+    const collection = await getCollection(req?.query?.body as string);
     return res
       .status(collection.status)
       .json({ response: collection.response });

pages/api/routes/links/index.ts

@@ -14,7 +14,7 @@ export default async function links(req: NextApiRequest, res: NextApiResponse) {
   }
 
   if (req.method === "GET") {
-    const links = await getLinks(session.user.id, req.query);
+    const links = await getLinks(session.user.id, req?.query?.body as string);
     return res.status(links.status).json({ response: links.response });
   } else if (req.method === "POST") {
     const newlink = await postLink(req.body, session.user.id);

pages/collections/[id].tsx

@@ -221,7 +221,9 @@ export default function Index() {
           </div>
         </div>
         <div className="grid 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
-          {links.map((e, i) => {
+          {links
+            .filter((e) => e.collectionId === Number(router.query.id))
+            .map((e, i) => {
               return <LinkCard key={i} link={e} count={i} />;
             })}
         </div>

pages/dashboard.tsx

@@ -35,7 +35,7 @@ export default function Dashboard() {
     return storedValue ? storedValue === "true" : true;
   });
 
-  useLinks({ pinnedOnly: true });
+  useLinks({ pinnedOnly: true, sort: 0 });
 
   useEffect(() => {
     localStorage.setItem(
@@ -134,7 +134,9 @@ export default function Dashboard() {
                 leaveTo="transform opacity-0 -translate-y-3"
               >
                 <Disclosure.Panel className="flex flex-col gap-5 w-full">
-                  {links.map((e, i) => (
+                  {links
+                    .filter((e) => e.pinnedBy)
+                    .map((e, i) => (
                       <LinkCard key={i} link={e} count={i} />
                     ))}
                 </Disclosure.Panel>

pages/public/collections/[id].tsx

@@ -14,7 +14,7 @@ export default function PublicCollections() {
   useEffect(() => {
     if (router.query.id) {
       getPublicCollectionData(
-        router.query.id as string,
+        Number(router.query.id),
         data as PublicCollectionIncludingLinks,
         setData
       );
@@ -33,7 +33,7 @@ export default function PublicCollections() {
   useEffect(() => {
     if (hasReachedBottom && router.query.id) {
       getPublicCollectionData(
-        router.query.id as string,
+        Number(router.query.id),
         data as PublicCollectionIncludingLinks,
         setData
       );

pages/tags/[id].tsx

@@ -67,7 +67,9 @@ export default function Index() {
           </div>
         </div>
         <div className="grid 2xl:grid-cols-3 xl:grid-cols-2 gap-5">
-          {links.map((e, i) => {
+          {links
+            .filter((e) => e.tags.some((e) => e.id === Number(router.query.id)))
+            .map((e, i) => {
               return <LinkCard key={i} link={e} count={i} />;
             })}
         </div>

types/global.ts

@@ -66,16 +66,16 @@ export type LinkSearchFilter = {
 };
 
 export type LinkRequestQuery = {
-  cursor?: string;
+  cursor?: number;
   collectionId?: number;
   tagId?: number;
-  sort?: Sort;
+  sort: Sort;
   searchFilter?: LinkSearchFilter;
   searchQuery?: string;
   pinnedOnly?: boolean;
 };
 
 export type PublicLinkRequestQuery = {
-  cursor?: string;
+  cursor?: number;
-  collectionId?: number;
+  collectionId: number;
 };