refactor: move abort controller into useLazyApps hook

packages/web/src/hooks/useLazyApps.js

@@ -1,25 +1,26 @@
 import { useMutation } from '@tanstack/react-query';
 
 import api from 'helpers/api';
+import React from 'react';
+
+export default function useLazyApps({ appName, onSuccess }) {
+  const abortControllerRef = React.useRef(new AbortController());
+
+  React.useEffect(() => {
+    abortControllerRef.current = new AbortController();
+
+    return () => {
+      abortControllerRef.current?.abort();
+    };
+  }, [appName]);
 
-export default function useLazyApps({
-  appName,
-  onSuccess,
-  abortControllerRef,
-}) {
   const query = useMutation({
-    mutationFn: async ({ payload, signal }) => {
-      abortControllerRef.current = new AbortController();
-
+    mutationFn: async ({ payload }) => {
       const { data } = await api.get('/v1/apps', {
         params: { name: appName },
         signal: abortControllerRef.current.signal,
       });
 
-      if (abortControllerRef.current.signal.aborted) {
-        return;
-      }
-
       return data;
     },
     onSuccess,