Rename frontend directory (#472)

* Rename directory

* Cleanup

* Recover lost images

* remove lint

frontend/src/hooks/useAlertError.ts

@@ -0,0 +1,10 @@
+import { useContext } from "react";
+import { ErrorModalContext } from "../context/ErrorModalContext";
+
+function useAlertError() {
+  const { setShowErrorModal, shouldShowErrorModal } =
+    useContext(ErrorModalContext);
+  return { setShowErrorModal, shouldShowErrorModal };
+}
+
+export default useAlertError;

frontend/src/hooks/useCustomSearchParams.ts

@@ -0,0 +1,34 @@
+import { useCallback } from "react";
+import { useSearchParams } from "react-router-dom";
+
+const useCustomSearchParams = () => {
+  const [search, setSearch] = useSearchParams();
+  const searchAsObject: { [key: string]: string } = Object.fromEntries(
+    new URLSearchParams(search)
+  );
+
+  const upsertSearchParams = useCallback(
+    (k: string, value: string) => {
+      const copySearchParams = new URLSearchParams(search);
+      copySearchParams.set(k, value);
+      setSearch(copySearchParams);
+      return copySearchParams;
+    },
+    [search, setSearch]
+  );
+
+  const removeSearchParam = (k: string) => {
+    const copySearchParams = new URLSearchParams(search);
+    copySearchParams.delete(k);
+    setSearch(copySearchParams);
+  };
+
+  return {
+    searchParamsObject: searchAsObject,
+    setSearchParams: setSearch,
+    upsertSearchParams,
+    removeSearchParam,
+  };
+};
+
+export default useCustomSearchParams;

frontend/src/hooks/useDebounce.tsx

@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+
+function useDebounce<T>(value: T, delay : number) {
+    const [debouncedValue, setDebouncedValue] = useState(value);
+
+    useEffect(() => {
+        const handler = setTimeout(() => {
+            setDebouncedValue(value);
+        }, delay);
+
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [value, delay]);
+
+    return debouncedValue;
+}
+
+export default useDebounce;

frontend/src/hooks/useNavigateWithSearchParams.ts

@@ -0,0 +1,13 @@
+import { useLocation, useNavigate } from "react-router-dom";
+
+const useNavigateWithSearchParams = () => {
+  const navigate = useNavigate();
+  const { search } = useLocation();
+  const navigateWithSearchParams = (url: string, ...restArgs: any[]) => {
+    navigate(url + search, ...restArgs);
+  };
+
+  return navigateWithSearchParams;
+};
+
+export default useNavigateWithSearchParams;