Improve face recognition (#15205)

* Validate faces using cosine distance and SVC * Formatting * Use opencv instead of face embedding * Update docs for training data * Adjust to score system * Set bounds * remove face embeddings * Update writing images * Add face library page * Add ability to select file * Install opencv deps * Cleanup * Use different deps * Move deps * Cleanup * Only show face library for desktop * Implement deleting * Add ability to upload image * Add support for uploading images
2026-08-01 08:32:18 +03:00 · 2025-02-08 12:47:01 -06:00
parent dd7b1be7f4
commit 0e4ff91d6b
15 changed files with 397 additions and 137 deletions
@@ -0,0 +1,88 @@
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Form, FormControl, FormField, FormItem } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useCallback } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+
+type UploadImageDialogProps = {
+  open: boolean;
+  title: string;
+  description?: string;
+  setOpen: (open: boolean) => void;
+  onSave: (file: File) => void;
+};
+export default function UploadImageDialog({
+  open,
+  title,
+  description,
+  setOpen,
+  onSave,
+}: UploadImageDialogProps) {
+  const formSchema = z.object({
+    file: z.instanceof(FileList, { message: "Please select an image file." }),
+  });
+
+  const form = useForm<z.infer<typeof formSchema>>({
+    resolver: zodResolver(formSchema),
+  });
+  const fileRef = form.register("file");
+
+  // upload handler
+
+  const onSubmit = useCallback(
+    (data: z.infer<typeof formSchema>) => {
+      if (!data["file"]) {
+        return;
+      }
+
+      onSave(data["file"]["0"]);
+    },
+    [onSave],
+  );
+
+  return (
+    <Dialog open={open} defaultOpen={false} onOpenChange={setOpen}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>{title}</DialogTitle>
+          {description && <DialogDescription>{description}</DialogDescription>}
+        </DialogHeader>
+        <Form {...form}>
+          <form onSubmit={form.handleSubmit(onSubmit)}>
+            <FormField
+              control={form.control}
+              name="file"
+              render={() => (
+                <FormItem>
+                  <FormControl>
+                    <Input
+                      className="aspect-video h-40 w-full"
+                      type="file"
+                      {...fileRef}
+                    />
+                  </FormControl>
+                </FormItem>
+              )}
+            />
+            <DialogFooter className="pt-4">
+              <Button onClick={() => setOpen(false)}>Cancel</Button>
+              <Button variant="select" type="submit">
+                Save
+              </Button>
+            </DialogFooter>
+          </form>
+        </Form>
+      </DialogContent>
+    </Dialog>
+  );
+}