feat: option filter people based on visibility

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

src/components/people/PeopleFilters.tsx

@@ -15,20 +15,27 @@ import {
 import { Input } from "../ui/input";
 import { IPersonListFilters } from "@/handlers/api/people.handler";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../ui/select";
+import { removeNullOrUndefinedProperties } from "@/helpers/data.helper";
+import { ParsedUrlQueryInput } from "querystring";
 
 export function PeopleFilters() {
   const router = useRouter();
-  const { updateContext, page, maximumAssetCount, type = "all", query ="" } = usePeopleFilterContext();
+  const { updateContext, page, maximumAssetCount, type = "all", query = "", visibility = "all" } = usePeopleFilterContext();
 
   const handleChange = (data: Partial<IPersonListFilters>) => {
     updateContext(data);
     router.push({
       pathname: router.pathname,
-      query: { 
+      query: {
         ...router.query,
-        ...data,
+        ...data,  
         page: data.page || undefined,
         type: data.type || undefined,
+        visibility: data.visibility || undefined,
+        query: data.query || undefined,
+        maximumAssetCount: data.maximumAssetCount || undefined,
+        sort: data.sort || undefined,
+        sortOrder: data.sortOrder || undefined,
       },
     });
   }
@@ -73,6 +80,17 @@ export function PeopleFilters() {
         </SelectContent>
       </Select>
 
+      <Select value={visibility} onValueChange={(value) => handleChange({ visibility: value as "all" | "visible" | "hidden" })}>
+        <SelectTrigger>
+          <SelectValue placeholder="Visibility" />
+        </SelectTrigger>
+        <SelectContent>
+          <SelectItem value="all">All</SelectItem>
+          <SelectItem value="visible">Visible</SelectItem>
+          <SelectItem value="hidden">Hidden</SelectItem>
+        </SelectContent>
+      </Select>
+
       <Button
         disabled={prevPage < 1}
         onClick={() => handleChange({ page: prevPage })}

src/components/people/PersonItem.tsx

@@ -107,7 +107,7 @@ export default function PersonItem({ person, onRemove }: IProps) {
           <Button variant="outline" className="!py-0.5 !px-2 text-xs h-7" onClick={() => {
             handleHide(!formData.isHidden);
           }}>
-          Hide
+          {formData.isHidden ? "Show" : "Hide"}
         </Button>
         <ShareAssetsTrigger filters={{ personIds: [person.id] }} buttonProps={{ variant: "outline", className: "!py-0.5 !px-2 text-xs h-7" }} />
         </div>

src/handlers/api/people.handler.ts

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

src/pages/api/people/list.ts

@@ -29,6 +29,7 @@ interface IQuery {
   sort: ISortField;
   sortOrder: "asc" | "desc";
   query: string;
+  visibility: "all" | "visible" | "hidden";
 }
 export default async function handler(
   req: NextApiRequest,
@@ -43,19 +44,21 @@ export default async function handler(
       sortOrder = "desc",
       type = "all",
       query = "",
+      visibility = "all",
     } = req.query as any as IQuery;
 
     const currentUser = await getCurrentUser(req);
 
     const maximumAssetCount = !maxValue || maxValue <= 0 ? 1000000 : maxValue;
+
     const whereClause = and(
-      eq(person.isHidden, false),
       isNull(assets.duplicateId),
       eq(assets.isVisible, true),
       eq(assets.isArchived, false),
       eq(assets.ownerId, currentUser.id),
       type === "all" ? undefined : (type === "nameless" ? eq(person.name, "") : ne(person.name, "")),
-      query && query.length > 0 ? ilike(person.name, `%${query}%`) : undefined
+      query && query.length > 0 ? ilike(person.name, `%${query}%`) : undefined,
+      visibility === "visible" ? eq(person.isHidden, false) : visibility === "hidden" ? eq(person.isHidden, true) : undefined
     );
 
     let dbQuery = db