YIPPEE

Author: suxls

apps/web/src/app/_components/search/search-filter.tsx

@@ -1,5 +1,7 @@
 "use client";
 
+import { useCallback } from "react";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
@@ -22,10 +24,24 @@ export default function SearchFilter() {
     },
   });
 
-  function onSubmit(values: z.infer<typeof formSchema>) {
-    //value is user's search info
+  const searchParams = useSearchParams()!;
+  const router = useRouter();
+  const pathName = usePathname();
 
-    console.log(values);
+  const createQueryString = useCallback(
+    (name: string, value: string) => {
+      const params = new URLSearchParams(searchParams);
+      params.set(name, value);
+      return params.toString();
+    },
+    [searchParams],
+  );
+
+  function onSubmit(values: z.infer<typeof formSchema>) {
+    // console.log(searchParams.get("search")); query the user search info
+    router.push(
+      pathName + `/?${createQueryString("search", values.searchText)}`,
+    );
   }
 
   return (

packages/api/src/router/role.ts

@@ -1,4 +1,5 @@
 import type { TRPCRouterRecord } from "@trpc/server";
+import Fuse from "fuse.js";
 import { z } from "zod";
 
 import { desc, eq } from "@cooper/db";