feat: introduce application auth clients tab in the admin panel (#1423)

* feat: introduce application auth clients tab in the admin panel

* feat: introduce improvements

* feat: use loading state returned from useMutation

* feat: use error returned by useMutation hook

packages/web/src/hooks/useAppAuthClients.ee.ts

@@ -6,25 +6,33 @@ import { GET_APP_AUTH_CLIENTS } from 'graphql/queries/get-app-auth-clients.ee';
 
 type QueryResponse = {
   getAppAuthClients: AppAuthClient[];
-}
+};
 
-export default function useAppAuthClient(appKey: string) {
-  const [
-    getAppAuthClients,
+export default function useAppAuthClient({
+  appKey,
+  active,
+}: {
+  appKey: string;
+  active?: boolean;
+}) {
+  const [getAppAuthClients, { data, loading }] = useLazyQuery<QueryResponse>(
+    GET_APP_AUTH_CLIENTS,
     {
-      data,
-      loading
+      context: { autoSnackbar: false },
     }
-  ] = useLazyQuery<QueryResponse>(GET_APP_AUTH_CLIENTS, {
-    context: { autoSnackbar: false },
-  });
+  );
   const appAuthClients = data?.getAppAuthClients;
 
-  React.useEffect(function fetchUponAppKey() {
-    if (!appKey) return;
+  React.useEffect(
+    function fetchUponAppKey() {
+      if (!appKey) return;
 
-    getAppAuthClients({ variables: { appKey, active: true } });
-  }, [appKey]);
+      getAppAuthClients({
+        variables: { appKey, ...(typeof active === 'boolean' && { active }) },
+      });
+    },
+    [appKey]
+  );
 
   return {
     appAuthClients,