Refactor compliange page access code

Signed-off-by: Bryan Frimin <bryan@getprobo.com>

apps/console/src/__generated__/core/CompliancePageAccessEditDialogQuery.graphql.ts

@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<88767d7e81f9900c5bd01a14ffb14bfa>>
+ * @generated SignedSource<<6356fdb9136b757a766816656cdf9eea>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -12,10 +12,10 @@ import { ConcreteRequest } from 'relay-runtime';
 import { FragmentRefs } from "relay-runtime";
 export type DocumentType = "ISMS" | "OTHER" | "POLICY" | "PROCEDURE";
 export type TrustCenterDocumentAccessStatus = "GRANTED" | "REJECTED" | "REQUESTED" | "REVOKED";
-export type TrustCenterAccessGraphLoadDocumentAccessesQuery$variables = {
+export type CompliancePageAccessEditDialogQuery$variables = {
   accessId: string;
 };
-export type TrustCenterAccessGraphLoadDocumentAccessesQuery$data = {
+export type CompliancePageAccessEditDialogQuery$data = {
   readonly node: {
     readonly availableDocumentAccesses?: {
       readonly edges: ReadonlyArray<{
@@ -51,9 +51,9 @@ export type TrustCenterAccessGraphLoadDocumentAccessesQuery$data = {
     } | null | undefined;
   };
 };
-export type TrustCenterAccessGraphLoadDocumentAccessesQuery = {
+export type CompliancePageAccessEditDialogQuery = {
-  response: TrustCenterAccessGraphLoadDocumentAccessesQuery$data;
+  response: CompliancePageAccessEditDialogQuery$data;
-  variables: TrustCenterAccessGraphLoadDocumentAccessesQuery$variables;
+  variables: CompliancePageAccessEditDialogQuery$variables;
 };
 
 const node: ConcreteRequest = (function(){
@@ -165,7 +165,7 @@ return {
     "argumentDefinitions": (v0/*: any*/),
     "kind": "Fragment",
     "metadata": null,
-    "name": "TrustCenterAccessGraphLoadDocumentAccessesQuery",
+    "name": "CompliancePageAccessEditDialogQuery",
     "selections": [
       {
         "alias": null,
@@ -284,7 +284,7 @@ return {
   "operation": {
     "argumentDefinitions": (v0/*: any*/),
     "kind": "Operation",
-    "name": "TrustCenterAccessGraphLoadDocumentAccessesQuery",
+    "name": "CompliancePageAccessEditDialogQuery",
     "selections": [
       {
         "alias": null,
@@ -450,16 +450,16 @@ return {
     ]
   },
   "params": {
-    "cacheID": "175c4de41f02ea26f9a4ebc2124d6a51",
+    "cacheID": "2c1a84490b7c138adbd06cd36a247f8b",
     "id": null,
     "metadata": {},
-    "name": "TrustCenterAccessGraphLoadDocumentAccessesQuery",
+    "name": "CompliancePageAccessEditDialogQuery",
     "operationKind": "query",
-    "text": "query TrustCenterAccessGraphLoadDocumentAccessesQuery(\n  $accessId: ID!\n) {\n  node(id: $accessId) {\n    __typename\n    ... on TrustCenterAccess {\n      id\n      ndaSignature {\n        ...ElectronicSignatureSectionFragment\n        id\n      }\n      availableDocumentAccesses(first: 100, orderBy: {field: CREATED_AT, direction: DESC}) {\n        edges {\n          node {\n            id\n            status\n            document {\n              id\n              title\n              documentType\n            }\n            report {\n              id\n              filename\n              audit {\n                id\n                framework {\n                  name\n                  id\n                }\n              }\n            }\n            trustCenterFile {\n              id\n              name\n              category\n            }\n          }\n        }\n      }\n    }\n    id\n  }\n}\n\nfragment ElectronicSignatureSectionFragment on ElectronicSignature {\n  status\n  signedAt\n  certificateFileUrl\n  events {\n    id\n    eventType\n    actorEmail\n    occurredAt\n  }\n}\n"
+    "text": "query CompliancePageAccessEditDialogQuery(\n  $accessId: ID!\n) {\n  node(id: $accessId) {\n    __typename\n    ... on TrustCenterAccess {\n      id\n      ndaSignature {\n        ...ElectronicSignatureSectionFragment\n        id\n      }\n      availableDocumentAccesses(first: 100, orderBy: {field: CREATED_AT, direction: DESC}) {\n        edges {\n          node {\n            id\n            status\n            document {\n              id\n              title\n              documentType\n            }\n            report {\n              id\n              filename\n              audit {\n                id\n                framework {\n                  name\n                  id\n                }\n              }\n            }\n            trustCenterFile {\n              id\n              name\n              category\n            }\n          }\n        }\n      }\n    }\n    id\n  }\n}\n\nfragment ElectronicSignatureSectionFragment on ElectronicSignature {\n  status\n  signedAt\n  certificateFileUrl\n  events {\n    id\n    eventType\n    actorEmail\n    occurredAt\n  }\n}\n"
   }
 };
 })();
 
-(node as any).hash = "d104626a4915648265550778f1ce6606";
+(node as any).hash = "22c0951e589902a84654ef96af8887a7";
 
 export default node;

apps/console/src/__generated__/core/CompliancePageAccessEditDialogUpdateMutation.graphql.ts

@@ -0,0 +1,180 @@
+/**
+ * @generated SignedSource<<7c575bd72e0d697cf92b9dd57038995c>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
+/* tslint:disable */
+/* eslint-disable */
+// @ts-nocheck
+
+import { ConcreteRequest } from 'relay-runtime';
+export type TrustCenterAccessState = "ACTIVE" | "INACTIVE";
+export type TrustCenterDocumentAccessStatus = "GRANTED" | "REJECTED" | "REQUESTED" | "REVOKED";
+export type UpdateTrustCenterAccessInput = {
+  documents?: ReadonlyArray<TrustCenterDocumentAccessInput> | null | undefined;
+  id: string;
+  name?: string | null | undefined;
+  reports?: ReadonlyArray<TrustCenterDocumentAccessInput> | null | undefined;
+  state?: TrustCenterAccessState | null | undefined;
+  trustCenterFiles?: ReadonlyArray<TrustCenterDocumentAccessInput> | null | undefined;
+};
+export type TrustCenterDocumentAccessInput = {
+  id: string;
+  status: TrustCenterDocumentAccessStatus;
+};
+export type CompliancePageAccessEditDialogUpdateMutation$variables = {
+  input: UpdateTrustCenterAccessInput;
+};
+export type CompliancePageAccessEditDialogUpdateMutation$data = {
+  readonly updateTrustCenterAccess: {
+    readonly trustCenterAccess: {
+      readonly activeCount: number;
+      readonly createdAt: string;
+      readonly email: string;
+      readonly hasAcceptedNonDisclosureAgreement: boolean;
+      readonly id: string;
+      readonly name: string;
+      readonly pendingRequestCount: number;
+      readonly state: TrustCenterAccessState;
+      readonly updatedAt: string;
+    };
+  };
+};
+export type CompliancePageAccessEditDialogUpdateMutation = {
+  response: CompliancePageAccessEditDialogUpdateMutation$data;
+  variables: CompliancePageAccessEditDialogUpdateMutation$variables;
+};
+
+const node: ConcreteRequest = (function(){
+var v0 = [
+  {
+    "defaultValue": null,
+    "kind": "LocalArgument",
+    "name": "input"
+  }
+],
+v1 = [
+  {
+    "alias": null,
+    "args": [
+      {
+        "kind": "Variable",
+        "name": "input",
+        "variableName": "input"
+      }
+    ],
+    "concreteType": "UpdateTrustCenterAccessPayload",
+    "kind": "LinkedField",
+    "name": "updateTrustCenterAccess",
+    "plural": false,
+    "selections": [
+      {
+        "alias": null,
+        "args": null,
+        "concreteType": "TrustCenterAccess",
+        "kind": "LinkedField",
+        "name": "trustCenterAccess",
+        "plural": false,
+        "selections": [
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "id",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "email",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "name",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "state",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "hasAcceptedNonDisclosureAgreement",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "createdAt",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "updatedAt",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "pendingRequestCount",
+            "storageKey": null
+          },
+          {
+            "alias": null,
+            "args": null,
+            "kind": "ScalarField",
+            "name": "activeCount",
+            "storageKey": null
+          }
+        ],
+        "storageKey": null
+      }
+    ],
+    "storageKey": null
+  }
+];
+return {
+  "fragment": {
+    "argumentDefinitions": (v0/*: any*/),
+    "kind": "Fragment",
+    "metadata": null,
+    "name": "CompliancePageAccessEditDialogUpdateMutation",
+    "selections": (v1/*: any*/),
+    "type": "Mutation",
+    "abstractKey": null
+  },
+  "kind": "Request",
+  "operation": {
+    "argumentDefinitions": (v0/*: any*/),
+    "kind": "Operation",
+    "name": "CompliancePageAccessEditDialogUpdateMutation",
+    "selections": (v1/*: any*/)
+  },
+  "params": {
+    "cacheID": "e8401f17211bce414eee9048b939235a",
+    "id": null,
+    "metadata": {},
+    "name": "CompliancePageAccessEditDialogUpdateMutation",
+    "operationKind": "mutation",
+    "text": "mutation CompliancePageAccessEditDialogUpdateMutation(\n  $input: UpdateTrustCenterAccessInput!\n) {\n  updateTrustCenterAccess(input: $input) {\n    trustCenterAccess {\n      id\n      email\n      name\n      state\n      hasAcceptedNonDisclosureAgreement\n      createdAt\n      updatedAt\n      pendingRequestCount\n      activeCount\n    }\n  }\n}\n"
+  }
+};
+})();
+
+(node as any).hash = "e511d9060cc29db26cd6ff281fe2722b";
+
+export default node;

apps/console/src/__generated__/core/CompliancePageAccessListItemUpdateMutation.graphql.ts

@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<8060916e92063b503b064a3ce7675e1a>>
+ * @generated SignedSource<<ca74f6c0f80146a4ed4e90bcee385300>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -23,10 +23,10 @@ export type TrustCenterDocumentAccessInput = {
   id: string;
   status: TrustCenterDocumentAccessStatus;
 };
-export type TrustCenterAccessGraphUpdateMutation$variables = {
+export type CompliancePageAccessListItemUpdateMutation$variables = {
   input: UpdateTrustCenterAccessInput;
 };
-export type TrustCenterAccessGraphUpdateMutation$data = {
+export type CompliancePageAccessListItemUpdateMutation$data = {
   readonly updateTrustCenterAccess: {
     readonly trustCenterAccess: {
       readonly activeCount: number;
@@ -41,9 +41,9 @@ export type TrustCenterAccessGraphUpdateMutation$data = {
     };
   };
 };
-export type TrustCenterAccessGraphUpdateMutation = {
+export type CompliancePageAccessListItemUpdateMutation = {
-  response: TrustCenterAccessGraphUpdateMutation$data;
+  response: CompliancePageAccessListItemUpdateMutation$data;
-  variables: TrustCenterAccessGraphUpdateMutation$variables;
+  variables: CompliancePageAccessListItemUpdateMutation$variables;
 };
 
 const node: ConcreteRequest = (function(){
@@ -152,7 +152,7 @@ return {
     "argumentDefinitions": (v0/*: any*/),
     "kind": "Fragment",
     "metadata": null,
-    "name": "TrustCenterAccessGraphUpdateMutation",
+    "name": "CompliancePageAccessListItemUpdateMutation",
     "selections": (v1/*: any*/),
     "type": "Mutation",
     "abstractKey": null
@@ -161,20 +161,20 @@ return {
   "operation": {
     "argumentDefinitions": (v0/*: any*/),
     "kind": "Operation",
-    "name": "TrustCenterAccessGraphUpdateMutation",
+    "name": "CompliancePageAccessListItemUpdateMutation",
     "selections": (v1/*: any*/)
   },
   "params": {
-    "cacheID": "bfc1209ce4d692ddb3692305aff7a33d",
+    "cacheID": "a943d051a8be76541af43131995defbe",
     "id": null,
     "metadata": {},
-    "name": "TrustCenterAccessGraphUpdateMutation",
+    "name": "CompliancePageAccessListItemUpdateMutation",
     "operationKind": "mutation",
-    "text": "mutation TrustCenterAccessGraphUpdateMutation(\n  $input: UpdateTrustCenterAccessInput!\n) {\n  updateTrustCenterAccess(input: $input) {\n    trustCenterAccess {\n      id\n      email\n      name\n      state\n      hasAcceptedNonDisclosureAgreement\n      createdAt\n      updatedAt\n      pendingRequestCount\n      activeCount\n    }\n  }\n}\n"
+    "text": "mutation CompliancePageAccessListItemUpdateMutation(\n  $input: UpdateTrustCenterAccessInput!\n) {\n  updateTrustCenterAccess(input: $input) {\n    trustCenterAccess {\n      id\n      email\n      name\n      state\n      hasAcceptedNonDisclosureAgreement\n      createdAt\n      updatedAt\n      pendingRequestCount\n      activeCount\n    }\n  }\n}\n"
   }
 };
 })();
 
-(node as any).hash = "750e100701bf905c8fff08f3f5155b5b";
+(node as any).hash = "82b5fb2e5d6ff48f7cf660007b4366ed";
 
 export default node;

apps/console/src/hooks/graph/TrustCenterAccessGraph.ts

@@ -1,65 +0,0 @@
-import { graphql } from "react-relay";
-
-export const updateTrustCenterAccessMutation = graphql`
-  mutation TrustCenterAccessGraphUpdateMutation(
-    $input: UpdateTrustCenterAccessInput!
-  ) {
-    updateTrustCenterAccess(input: $input) {
-      trustCenterAccess {
-        id
-        email
-        name
-        state
-        hasAcceptedNonDisclosureAgreement
-        createdAt
-        updatedAt
-        pendingRequestCount
-        activeCount
-      }
-    }
-  }
-`;
-
-export const loadTrustCenterAccessDocumentAccessesQuery = graphql`
-  query TrustCenterAccessGraphLoadDocumentAccessesQuery($accessId: ID!) {
-    node(id: $accessId) {
-      ... on TrustCenterAccess {
-        id
-        ndaSignature {
-          ...ElectronicSignatureSectionFragment
-        }
-        availableDocumentAccesses(
-          first: 100
-          orderBy: { field: CREATED_AT, direction: DESC }
-        ) {
-          edges {
-            node {
-              id
-              status
-              document {
-                id
-                title
-                documentType
-              }
-              report {
-                id
-                filename
-                audit {
-                  id
-                  framework {
-                    name
-                  }
-                }
-              }
-              trustCenterFile {
-                id
-                name
-                category
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-`;

apps/console/src/pages/organizations/compliance-page/access/_components/CompliancePageAccessEditDialog.tsx

@@ -18,39 +18,96 @@ import {
   usePreloadedQuery,
   useQueryLoader,
 } from "react-relay";
+import { graphql } from "relay-runtime";
 import { z } from "zod";
 
+import type { CompliancePageAccessEditDialogQuery as CompliancePageAccessEditDialogQueryType } from "#/__generated__/core/CompliancePageAccessEditDialogQuery.graphql";
+import type { CompliancePageAccessEditDialogUpdateMutation } from "#/__generated__/core/CompliancePageAccessEditDialogUpdateMutation.graphql";
 import type { CompliancePageAccessListItemFragment$data } from "#/__generated__/core/CompliancePageAccessListItemFragment.graphql";
-import type { TrustCenterAccessGraphLoadDocumentAccessesQuery } from "#/__generated__/core/TrustCenterAccessGraphLoadDocumentAccessesQuery.graphql";
-import {
-  loadTrustCenterAccessDocumentAccessesQuery,
-  updateTrustCenterAccessMutation,
-} from "#/hooks/graph/TrustCenterAccessGraph";
 import { useFormWithSchema } from "#/hooks/useFormWithSchema";
 import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
-
+import { CompliancePageDocumentAccessList } from "#/pages/organizations/compliance-page/access/_components/CompliancePageDocumentAccessList";
 import { ElectronicSignatureSection } from "#/pages/organizations/compliance-page/access/_components/ElectronicSignatureSection";
-import { TrustCenterDocumentAccessList } from "./TrustCenterDocumentAccessList";
 
-interface TrustCenterAccessEditDialogProps {
+const compliancePageAccessEditDialogQuery = graphql`
+  query CompliancePageAccessEditDialogQuery($accessId: ID!) {
+    node(id: $accessId) {
+      ... on TrustCenterAccess {
+        id
+        ndaSignature {
+          ...ElectronicSignatureSectionFragment
+        }
+        availableDocumentAccesses(
+          first: 100
+          orderBy: { field: CREATED_AT, direction: DESC }
+        ) {
+          edges {
+            node {
+              id
+              status
+              document {
+                id
+                title
+                documentType
+              }
+              report {
+                id
+                filename
+                audit {
+                  id
+                  framework {
+                    name
+                  }
+                }
+              }
+              trustCenterFile {
+                id
+                name
+                category
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+
+const updateAccessMutation = graphql`
+  mutation CompliancePageAccessEditDialogUpdateMutation(
+    $input: UpdateTrustCenterAccessInput!
+  ) {
+    updateTrustCenterAccess(input: $input) {
+      trustCenterAccess {
+        id
+        email
+        name
+        state
+        hasAcceptedNonDisclosureAgreement
+        createdAt
+        updatedAt
+        pendingRequestCount
+        activeCount
+      }
+    }
+  }
+`;
+
+export function CompliancePageAccessEditDialog(props: {
   access: CompliancePageAccessListItemFragment$data;
   onClose: () => void;
-}
+}) {
-
-export function TrustCenterAccessEditDialog(
-  props: TrustCenterAccessEditDialogProps,
-) {
   const { access, onClose } = props;
 
   const { __ } = useTranslate();
 
-  const [queryRef, loadDocumentAccessesQuery]
+  const [queryRef, loadQuery]
-    = useQueryLoader<TrustCenterAccessGraphLoadDocumentAccessesQuery>(
+    = useQueryLoader<CompliancePageAccessEditDialogQueryType>(
-      loadTrustCenterAccessDocumentAccessesQuery,
+      compliancePageAccessEditDialogQuery,
     );
 
   useEffect(() => {
-    loadDocumentAccessesQuery(
+    loadQuery(
       {
         accessId: access.id,
       },
@@ -58,13 +115,13 @@ export function TrustCenterAccessEditDialog(
         fetchPolicy: "network-only",
       },
     );
-  }, [access.id, loadDocumentAccessesQuery]);
+  }, [access.id, loadQuery]);
 
   return (
     <Dialog defaultOpen={true} title={__("Edit Access")} onClose={onClose}>
       {queryRef && (
         <Suspense>
-          <TrustCenterAccessEditForm
+          <CompliancePageAccessEditForm
             access={access}
             queryRef={queryRef}
             onSubmit={onClose}
@@ -75,21 +132,17 @@ export function TrustCenterAccessEditDialog(
   );
 }
 
-interface TrustCenterAccessEditFormProps {
+function CompliancePageAccessEditForm(props: {
   access: CompliancePageAccessListItemFragment$data;
   onSubmit: () => void;
-  queryRef: PreloadedQuery<TrustCenterAccessGraphLoadDocumentAccessesQuery>;
+  queryRef: PreloadedQuery<CompliancePageAccessEditDialogQueryType>;
-}
+}) {
-
-export function TrustCenterAccessEditForm(
-  props: TrustCenterAccessEditFormProps,
-) {
   const { access, onSubmit, queryRef } = props;
 
   const { __ } = useTranslate();
   const data
-    = usePreloadedQuery<TrustCenterAccessGraphLoadDocumentAccessesQuery>(
+    = usePreloadedQuery<CompliancePageAccessEditDialogQueryType>(
-      loadTrustCenterAccessDocumentAccessesQuery,
+      compliancePageAccessEditDialogQuery,
       queryRef,
     );
 
@@ -154,8 +207,8 @@ export function TrustCenterAccessEditForm(
     defaultValues: { name: access.name, active: access.state === "ACTIVE" },
   });
 
-  const [updateTrustCenterAccess, isUpdating] = useMutationWithToasts(
+  const [updateTrustCenterAccess, isUpdating] = useMutationWithToasts<CompliancePageAccessEditDialogUpdateMutation>(
-    updateTrustCenterAccessMutation,
+    updateAccessMutation,
     {
       successMessage: __("Access updated successfully"),
       errorMessage: __("Failed to update access"),
@@ -228,7 +281,7 @@ export function TrustCenterAccessEditForm(
           <ElectronicSignatureSection fragmentRef={data.node.ndaSignature} />
         )}
 
-        <TrustCenterDocumentAccessList
+        <CompliancePageDocumentAccessList
           documentAccesses={documentAccesses}
           initialStatusByID={initialStatusByID}
           onGrantAll={handleGrantAllDocumentAccess}

apps/console/src/pages/organizations/compliance-page/access/_components/CompliancePageAccessListItem.tsx

@@ -6,11 +6,10 @@ import { useFragment } from "react-relay";
 import { graphql } from "relay-runtime";
 
 import type { CompliancePageAccessListItemFragment$key } from "#/__generated__/core/CompliancePageAccessListItemFragment.graphql";
-import type { TrustCenterAccessGraphUpdateMutation } from "#/__generated__/core/TrustCenterAccessGraphUpdateMutation.graphql";
+import type { CompliancePageAccessListItemUpdateMutation } from "#/__generated__/core/CompliancePageAccessListItemUpdateMutation.graphql";
-import { updateTrustCenterAccessMutation } from "#/hooks/graph/TrustCenterAccessGraph";
 import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
-import { TrustCenterAccessEditDialog } from "#/pages/organizations/trustCenter/TrustCenterAccessTab/TrustCenterAccessEditDialog";
 
+import { CompliancePageAccessEditDialog } from "./CompliancePageAccessEditDialog";
 import { NdaSignatureBadge } from "./NdaSignatureBadge";
 
 const fragment = graphql`
@@ -29,6 +28,26 @@ const fragment = graphql`
   }
 `;
 
+const toggleAccessStateMutation = graphql`
+  mutation CompliancePageAccessListItemUpdateMutation(
+    $input: UpdateTrustCenterAccessInput!
+  ) {
+    updateTrustCenterAccess(input: $input) {
+      trustCenterAccess {
+        id
+        email
+        name
+        state
+        hasAcceptedNonDisclosureAgreement
+        createdAt
+        updatedAt
+        pendingRequestCount
+        activeCount
+      }
+    }
+  }
+`;
+
 export function CompliancePageAccessListItem(props: {
   fragmentRef: CompliancePageAccessListItemFragment$key;
   dialogOpen: boolean;
@@ -42,8 +61,8 @@ export function CompliancePageAccessListItem(props: {
 
   const isActive = access.state === "ACTIVE";
 
-  const [updateAccess, isUpdating] = useMutationWithToasts<TrustCenterAccessGraphUpdateMutation>(
+  const [toggleAccessState, isToggling] = useMutationWithToasts<CompliancePageAccessListItemUpdateMutation>(
-    updateTrustCenterAccessMutation,
+    toggleAccessStateMutation,
     {
       successMessage: isActive
         ? __("Access deactivated successfully")
@@ -55,7 +74,7 @@ export function CompliancePageAccessListItem(props: {
   );
 
   const handleToggleState = useCallback(() => {
-    void updateAccess({
+    void toggleAccessState({
       variables: {
         input: {
           id: access.id,
@@ -64,7 +83,7 @@ export function CompliancePageAccessListItem(props: {
         },
       },
     });
-  }, [updateAccess, access.id, access.name, isActive]);
+  }, [toggleAccessState, access.id, access.name, isActive]);
 
   return (
     <>
@@ -109,7 +128,7 @@ export function CompliancePageAccessListItem(props: {
                 <DropdownItem
                   icon={isActive ? IconArchive : IconRotateCw}
                   onClick={handleToggleState}
-                  disabled={isUpdating}
+                  disabled={isToggling}
                   variant={isActive ? "danger" : "primary"}
                 >
                   {isActive ? __("Deactivate") : __("Activate")}
@@ -121,7 +140,7 @@ export function CompliancePageAccessListItem(props: {
       </Tr>
 
       {access.canUpdate && isActive && dialogOpen && (
-        <TrustCenterAccessEditDialog
+        <CompliancePageAccessEditDialog
           access={access}
           onClose={() => setDialogOpen(false)}
         />

apps/console/src/pages/organizations/compliance-page/access/_components/CompliancePageDocumentAccessList.tsx

@@ -3,7 +3,7 @@ import { getTrustCenterDocumentAccessStatusBadgeVariant, getTrustCenterDocumentA
 import { useTranslate } from "@probo/i18n";
 import { Badge, Button, Table, Tbody, Td, Th, Thead, Tr } from "@probo/ui";
 
-interface TrustCenterDocumentAccessListProps {
+interface CompliancePageDocumentAccessListProps {
   documentAccesses: TrustCenterDocumentAccessInfo[];
   initialStatusByID: Record<string, TrustCenterDocumentAccessStatus>;
   onGrantAll: () => void;
@@ -11,7 +11,7 @@ interface TrustCenterDocumentAccessListProps {
   onUpdateStatus: (docAccess: TrustCenterDocumentAccessInfo, status: TrustCenterDocumentAccessStatus) => void;
 }
 
-export function TrustCenterDocumentAccessList(props: TrustCenterDocumentAccessListProps) {
+export function CompliancePageDocumentAccessList(props: CompliancePageDocumentAccessListProps) {
   const { documentAccesses, initialStatusByID, onGrantAll, onRejectOrRevokeAll, onUpdateStatus } = props;
 
   const { __ } = useTranslate();