PROD-2332 dataset page to use the new table component

CHANGELOG.md

@@ -25,6 +25,8 @@ The types of changes are:
 - Serve GVL languages as they are requested [#5112](https://github.com/ethyca/fides/pull/5112)
 - Changed text on system integrations tab to direct to new integration management [#5097](https://github.com/ethyca/fides/pull/5097)
 - Updates to consent experience styling [#5085](https://github.com/ethyca/fides/pull/5085)
+- Updated the dataset page to display the new table and support pagination [#5130](https://github.com/ethyca/fides/pull/5130)
+
 
 ### Developer Experience
 - Add `.syncignore` to reduce file sync size with new volumes [#5104](https://github.com/ethyca/fides/pull/5104)

clients/admin-ui/src/features/common/nav/v2/routes.ts

@@ -11,6 +11,7 @@ export const SYSTEM_ROUTE = "/systems";
 export const EDIT_SYSTEM_ROUTE = "/systems/configure/[id]";
 export const CLASSIFY_SYSTEMS_ROUTE = "/classify-systems";
 export const DATASET_ROUTE = "/dataset";
+export const DATASET_EDIT_ROUTE = "/dataset/[id]";
 
 // Detection and discovery
 export const DETECTION_DISCOVERY_ACTIVITY_ROUTE = "/data-discovery/activity";

clients/admin-ui/src/features/dataset/dataset.slice.ts

@@ -7,7 +7,10 @@ import {
   Dataset,
   GenerateRequestPayload,
   GenerateResponse,
+  Page_Dataset_,
 } from "~/types/api";
+import { PaginationQueryParams } from "~/types/common/PaginationQueryParams";
+import { SearchQueryParams } from "~/types/common/SearchQueryParams";
 
 import { EditableType } from "./types";
 
@@ -27,8 +30,24 @@ interface DatasetDeleteResponse {
   resource: Dataset;
 }
 
+interface DatasetFiltersQueryParams {
+  exclude_saas_datasets?: boolean;
+  only_unlinked_datasets?: boolean;
+}
+
 const datasetApi = baseApi.injectEndpoints({
   endpoints: (build) => ({
+    getDatasets: build.query<
+      Page_Dataset_,
+      PaginationQueryParams & SearchQueryParams & DatasetFiltersQueryParams
+    >({
+      query: (params) => ({
+        method: "GET",
+        url: `dataset`,
+        params,
+      }),
+      providesTags: () => ["Datasets"],
+    }),
     getAllDatasets: build.query<Dataset[], void>({
       query: () => ({ url: `dataset` }),
       providesTags: () => ["Datasets"],
@@ -99,6 +118,7 @@ const datasetApi = baseApi.injectEndpoints({
 });
 
 export const {
+  useGetDatasetsQuery,
   useGetAllDatasetsQuery,
   useGetAllFilteredDatasetsQuery,
   useGetDatasetByKeyQuery,

clients/admin-ui/src/features/system/system.slice.ts

@@ -11,6 +11,8 @@ import {
   SystemResponse,
   TestStatusMessage,
 } from "~/types/api";
+import { PaginationQueryParams } from "~/types/common/PaginationQueryParams";
+import { SearchQueryParams } from "~/types/common/SearchQueryParams";
 
 interface SystemDeleteResponse {
   message: string;
@@ -23,14 +25,6 @@ interface UpsertResponse {
   updated: number;
 }
 
-interface PaginationParams {
-  page: number;
-  size: number;
-}
-interface SearchParams {
-  search?: string;
-}
-
 export type ConnectionConfigSecretsRequest = {
   systemFidesKey: string;
   secrets: {
@@ -42,7 +36,7 @@ const systemApi = baseApi.injectEndpoints({
   endpoints: (build) => ({
     getSystems: build.query<
       Page_BasicSystemResponse_,
-      PaginationParams & SearchParams
+      PaginationQueryParams & SearchQueryParams
     >({
       query: (params) => ({
         method: "GET",