feat: people search added

Signed-off-by: Varun Raj <varun@skcript.com>

src/components/people/PeopleFilters.tsx

@@ -19,7 +19,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from ".
 
 export function PeopleFilters() {
   const router = useRouter();
-  const { updateContext, page, maximumAssetCount, type = "all" } = usePeopleFilterContext();
+  const { updateContext, page, maximumAssetCount, type = "all", query ="" } = usePeopleFilterContext();
 
   const handleChange = (data: Partial<IPersonListFilters>) => {
     updateContext(data);
@@ -40,6 +40,15 @@ export function PeopleFilters() {
 
   return (
     <div className="flex gap-2">
+      <Input
+        type="text"
+        placeholder="Search by name"
+        className="w-max"
+        defaultValue={query}
+        onChange={(e) => {
+          handleChange({ query: e.target.value });
+        }}
+      />
       <Input
         type="number"
         placeholder="Max Asset Count"

src/handlers/api/people.handler.ts

@@ -13,6 +13,7 @@ export interface IPersonListFilters {
   sort?: ISortField;
   sortOrder?: "asc" | "desc";
   type?: string;
+  query?: string;
 }
 export const listPeople = (filters: IPersonListFilters): Promise<IPeopleListResponse> => {
   return API.get(LIST_PEOPLE_PATH, filters).then((response) => {

src/pages/api/people/list.ts

@@ -1,8 +1,6 @@
 // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-import { CHART_COLORS } from "@/config/constants/chart.constant";
 import { db } from "@/config/db";
 import { getCurrentUser } from "@/handlers/serverUtils/user.utils";
-import { stringToBoolean } from "@/helpers/data.helper";
 import { assetFaces, assets, exif, person } from "@/schema";
 import {
   and,
@@ -11,6 +9,7 @@ import {
   desc,
   eq,
   gte,
+  ilike,
   isNotNull,
   isNull,
   lte,
@@ -29,6 +28,7 @@ interface IQuery {
   maximumAssetCount: number;
   sort: ISortField;
   sortOrder: "asc" | "desc";
+  query: string;
 }
 export default async function handler(
   req: NextApiRequest,
@@ -42,6 +42,7 @@ export default async function handler(
       sort = "assetCount",
       sortOrder = "desc",
       type = "all",
+      query = "",
     } = req.query as any as IQuery;
 
     const currentUser = await getCurrentUser(req);
@@ -53,10 +54,11 @@ export default async function handler(
       eq(assets.isVisible, true),
       eq(assets.isArchived, false),
       eq(assets.ownerId, currentUser.id),
-      type === "all" ? undefined : (type === "nameless" ? eq(person.name, "") : ne(person.name, ""))
+      type === "all" ? undefined : (type === "nameless" ? eq(person.name, "") : ne(person.name, "")),
+      query && query.length > 0 ? ilike(person.name, `%${query}%`) : undefined
     );
 
-    let query = db
+    let dbQuery = db
       .select({
         id: person.id,
         name: person.name,
@@ -74,17 +76,17 @@ export default async function handler(
 
     let sortedQuery;
     if (sort === "assetCount") {
-      sortedQuery = query.orderBy(
+      sortedQuery = dbQuery.orderBy(
         sortOrder === "asc"
           ? asc(count(assetFaces.id))
           : desc(count(assetFaces.id))
       );
     } else if (sort === "updatedAt") {
-      sortedQuery = query.orderBy(
+      sortedQuery = dbQuery.orderBy(
         sortOrder === "asc" ? asc(person.updatedAt) : desc(person.updatedAt)
       );
     }
-    const people = await query.limit(perPage).offset((page - 1) * perPage);
+    const people = await dbQuery.limit(perPage).offset((page - 1) * perPage);
 
     return res.status(200).json({
       people,