From 75df7d64135444ecd5dff9c9d36dced23f2aebf2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C4=B1dvan=20Akca?= <akca.ridvann@gmail.com>
Date: Thu, 14 Mar 2024 13:54:51 +0300
Subject: [PATCH] refactor: rewrite parameters of RQ hooks

---
 .../src/components/AddNewAppConnection/index.jsx | 12 +++++++-----
 packages/web/src/components/FlowStep/index.jsx   | 16 ++++++++--------
 packages/web/src/hooks/useActionSubsteps.js      |  2 +-
 packages/web/src/hooks/useApps.js                |  8 ++++++--
 packages/web/src/hooks/useLazyApps.js            |  4 ++--
 packages/web/src/hooks/useTriggerSubsteps.js     |  2 +-
 6 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/packages/web/src/components/AddNewAppConnection/index.jsx b/packages/web/src/components/AddNewAppConnection/index.jsx
index 0ba62b66..4ed2146f 100644
--- a/packages/web/src/components/AddNewAppConnection/index.jsx
+++ b/packages/web/src/components/AddNewAppConnection/index.jsx
@@ -40,12 +40,14 @@ function AddNewAppConnection(props) {
   const [appName, setAppName] = React.useState('');
   const [isLoading, setIsLoading] = React.useState(false);
 
-  const { data: apps, mutate } = useLazyApps({
-    appName,
-    onSuccess: () => {
-      setIsLoading(false);
+  const { data: apps, mutate } = useLazyApps(
+    { appName },
+    {
+      onSuccess: () => {
+        setIsLoading(false);
+      },
     },
-  });
+  );
 
   const fetchData = React.useMemo(() => debounce(mutate, 300), [mutate]);
 
diff --git a/packages/web/src/components/FlowStep/index.jsx b/packages/web/src/components/FlowStep/index.jsx
index b999ec4f..b7c8f222 100644
--- a/packages/web/src/components/FlowStep/index.jsx
+++ b/packages/web/src/components/FlowStep/index.jsx
@@ -161,17 +161,17 @@ function FlowStep(props) {
     ({ key }) => key === step.key,
   );
 
-  const { data: triggerSubsteps } = useTriggerSubsteps(
-    app?.key,
-    actionOrTrigger?.key,
-  );
+  const { data: triggerSubsteps } = useTriggerSubsteps({
+    appKey: app?.key,
+    triggerKey: actionOrTrigger?.key,
+  });
 
   const triggerSubstepsData = triggerSubsteps?.data || [];
 
-  const { data: actionSubsteps } = useActionSubsteps(
-    app?.key,
-    actionOrTrigger?.key,
-  );
+  const { data: actionSubsteps } = useActionSubsteps({
+    appKey: app?.key,
+    actionKey: actionOrTrigger?.key,
+  });
 
   const actionSubstepsData = actionSubsteps?.data || [];
 
diff --git a/packages/web/src/hooks/useActionSubsteps.js b/packages/web/src/hooks/useActionSubsteps.js
index f54fb38e..267c872a 100644
--- a/packages/web/src/hooks/useActionSubsteps.js
+++ b/packages/web/src/hooks/useActionSubsteps.js
@@ -2,7 +2,7 @@ import { useQuery } from '@tanstack/react-query';
 
 import api from 'helpers/api';
 
-export default function useActionSubsteps(appKey, actionKey) {
+export default function useActionSubsteps({ appKey, actionKey }) {
   const query = useQuery({
     queryKey: ['actionSubsteps', appKey, actionKey],
     queryFn: async ({ signal }) => {
diff --git a/packages/web/src/hooks/useApps.js b/packages/web/src/hooks/useApps.js
index 871d856d..9ea31a77 100644
--- a/packages/web/src/hooks/useApps.js
+++ b/packages/web/src/hooks/useApps.js
@@ -3,11 +3,15 @@ import { useQuery } from '@tanstack/react-query';
 import api from 'helpers/api';
 
 export default function useApps(variables) {
+  const trueOnlyVariables = Object.fromEntries(
+    Object.entries(variables).filter(([_, value]) => value === true),
+  );
+
   const query = useQuery({
-    queryKey: ['apps', variables],
+    queryKey: ['apps', trueOnlyVariables],
     queryFn: async ({ signal }) => {
       const { data } = await api.get('/v1/apps', {
-        params: variables,
+        params: trueOnlyVariables,
         signal,
       });
 
diff --git a/packages/web/src/hooks/useLazyApps.js b/packages/web/src/hooks/useLazyApps.js
index 291ffcc2..33fab2c1 100644
--- a/packages/web/src/hooks/useLazyApps.js
+++ b/packages/web/src/hooks/useLazyApps.js
@@ -3,7 +3,7 @@ import { useMutation } from '@tanstack/react-query';
 import api from 'helpers/api';
 import React from 'react';
 
-export default function useLazyApps({ appName, onSuccess }) {
+export default function useLazyApps({ appName } = {}, { onSuccess }) {
   const abortControllerRef = React.useRef(new AbortController());
 
   React.useEffect(() => {
@@ -15,7 +15,7 @@ export default function useLazyApps({ appName, onSuccess }) {
   }, [appName]);
 
   const query = useMutation({
-    mutationFn: async ({ payload }) => {
+    mutationFn: async () => {
       const { data } = await api.get('/v1/apps', {
         params: { name: appName },
         signal: abortControllerRef.current.signal,
diff --git a/packages/web/src/hooks/useTriggerSubsteps.js b/packages/web/src/hooks/useTriggerSubsteps.js
index 725a7f6a..6af75e01 100644
--- a/packages/web/src/hooks/useTriggerSubsteps.js
+++ b/packages/web/src/hooks/useTriggerSubsteps.js
@@ -2,7 +2,7 @@ import { useQuery } from '@tanstack/react-query';
 
 import api from 'helpers/api';
 
-export default function useTriggerSubsteps(appKey, triggerKey) {
+export default function useTriggerSubsteps({ appKey, triggerKey }) {
   const query = useQuery({
     queryKey: ['triggerSubsteps', appKey, triggerKey],
     queryFn: async ({ signal }) => {