Fix risk controls tab missing pagination

The controls tab used useRefetchableFragment which only showed the
first 20 controls with no "Show more" button, while the tab badge
displayed the actual total count. Switch to usePaginationFragment
to enable proper pagination via the SortableTable component.

Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>

apps/console/src/pages/organizations/risks/tabs/RiskControlsTab.tsx

@@ -14,9 +14,11 @@
 
 import { useTranslate } from "@probo/i18n";
 import { Badge, Tbody, Td, Th, Thead, Tr } from "@probo/ui";
-import { graphql, useRefetchableFragment } from "react-relay";
+import type { ComponentProps } from "react";
+import { graphql, usePaginationFragment } from "react-relay";
 import { useOutletContext } from "react-router";
 
+import type { RiskControlsTabControlsQuery } from "#/__generated__/core/RiskControlsTabControlsQuery.graphql";
 import type { RiskControlsTabFragment$key } from "#/__generated__/core/RiskControlsTabFragment.graphql";
 import { SortableTable, SortableTh } from "#/components/SortableTable";
 import { useOrganizationId } from "#/hooks/useOrganizationId";
@@ -60,13 +62,20 @@ export default function RiskControlsTab() {
     risk: RiskControlsTabFragment$key & { id: string };
   }>();
   const { __ } = useTranslate();
-  // eslint-disable-next-line relay/generated-typescript-types
-  const [data, refetch] = useRefetchableFragment(controlsFragment, risk);
-  const controls = data.controls.edges.map(edge => edge.node);
+  const pagination = usePaginationFragment<
+    RiskControlsTabControlsQuery,
+    RiskControlsTabFragment$key
+  >(controlsFragment, risk);
+  const controls = pagination.data.controls.edges.map(edge => edge.node);
   const organizationId = useOrganizationId();
 
   return (
-    <SortableTable refetch={refetch}>
+    <SortableTable
+      {...pagination}
+      refetch={
+        pagination.refetch as ComponentProps<typeof SortableTable>["refetch"]
+      }
+    >
       <Thead>
         <Tr>
           <SortableTh field="SECTION_TITLE">{__("Reference")}</SortableTh>