Fix merge conflicts

frontend/src/hooks/api/secrets/queries.tsx

@@ -54,13 +54,14 @@ export const useGetProjectSecrets = ({
   env,
   decryptFileKey,
   isPaused,
-  folderId
+  folderId,
+  secretPath
 }: GetProjectSecretsDTO) =>
   useQuery({
     // wait for all values to be available
     enabled: Boolean(decryptFileKey && workspaceId && env) && !isPaused,
-    queryKey: secretKeys.getProjectSecret(workspaceId, env, folderId),
-    queryFn: () => fetchProjectEncryptedSecrets(workspaceId, env, folderId),
+    queryKey: secretKeys.getProjectSecret(workspaceId, env, folderId || secretPath),
+    queryFn: () => fetchProjectEncryptedSecrets(workspaceId, env, folderId, secretPath),
     select: useCallback(
       (data: EncryptedSecret[]) => {
         const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;

frontend/src/hooks/index.ts

@@ -1,3 +1,4 @@
+export { useDebounce } from "./useDebounce";
 export { useLeaveConfirm } from "./useLeaveConfirm";
 export { usePersistentState } from "./usePersistentState";
 export { usePopUp } from "./usePopUp";

frontend/src/hooks/useDebounce.tsx

@@ -0,0 +1,26 @@
+import { useEffect, useState } from "react";
+
+// Ref: https://usehooks.com/useDebounce/
+export const useDebounce = <T extends unknown>(value: T, delay = 500): T => {
+  // State and setters for debounced value
+  const [debouncedValue, setDebouncedValue] = useState(value);
+
+  useEffect(
+    () => {
+      // Update debounced value after delay
+      const handler = setTimeout(() => {
+        setDebouncedValue(value);
+      }, delay);
+
+      // Cancel the timeout if value changes (also on delay change or unmount)
+      // This is how we prevent debounced value from updating if value is changed ...
+      // .. within the delay period. Timeout gets cleared and restarted.
+      return () => {
+        clearTimeout(handler);
+      };
+    },
+    [value, delay] // Only re-call effect if value or delay changes
+  );
+
+  return debouncedValue;
+};