feat: rebuild app using vike

hooks/useCommandKey.ts

@@ -0,0 +1,20 @@
+import { useEffect } from "react";
+
+const useCommandKey = (key: string, callback: () => void) => {
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if ((e.ctrlKey || e.metaKey) && e.key === key) {
+        e.preventDefault();
+        e.stopPropagation();
+        callback();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [key, callback]);
+};
+
+export default useCommandKey;

hooks/useDebounce.ts

@@ -0,0 +1,26 @@
+import { useCallback, useRef } from "react";
+
+export const useDebounce = (fn: Function, delay = 500) => {
+  const timerRef = useRef<any>(null);
+
+  const cancel = useCallback(() => {
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+      timerRef.current = null;
+    }
+  }, []);
+
+  const debounce = useCallback(
+    (...params: any[]) => {
+      cancel();
+
+      timerRef.current = setTimeout(() => {
+        fn(...params);
+        timerRef.current = null;
+      }, delay);
+    },
+    [fn, delay, cancel]
+  );
+
+  return [debounce, cancel] as [typeof debounce, typeof cancel];
+};

hooks/useDisclose.ts

@@ -0,0 +1,22 @@
+import { useCallback, useState } from "react";
+
+export const useDisclose = <T = any>() => {
+  const [isOpen, setOpen] = useState(false);
+  const [data, setData] = useState<T | null | undefined>(null);
+
+  const onOpen = useCallback(
+    (_data?: T | null) => {
+      setOpen(true);
+      setData(_data);
+    },
+    [setOpen]
+  );
+
+  const onClose = useCallback(() => {
+    setOpen(false);
+  }, [setOpen]);
+
+  return { isOpen, onOpen, onClose, onChange: setOpen, data };
+};
+
+export type UseDiscloseReturn<T = any> = ReturnType<typeof useDisclose<T>>;

hooks/useForm.ts

@@ -0,0 +1,22 @@
+import { z } from "zod";
+import { useForm as useHookForm, FieldValues } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+
+export const useForm = <T extends FieldValues>(
+  schema: z.ZodSchema<T>,
+  initialValues?: Partial<T>
+) => {
+  const form = useHookForm<T>({
+    resolver: zodResolver(schema),
+    defaultValues: initialValues as never,
+  });
+
+  useEffect(() => {
+    if (initialValues) {
+      form.reset(initialValues as never);
+    }
+  }, [initialValues, form.reset]);
+
+  return form;
+};

hooks/usePortrait.ts

@@ -0,0 +1,8 @@
+import { useScreen } from "usehooks-ts";
+
+export const usePortrait = () => {
+  const screen = useScreen();
+  const isPortrait = screen?.width < screen?.height;
+
+  return isPortrait;
+};