monitor_type query parameter in /aggregate-results (#6885)

Author: gilluminate

CHANGELOG.md

@@ -31,7 +31,7 @@ Changes can also be flagged with a GitHub label for tracking purposes. The URL o
 - Added beta feature flag for LLM classifier [#6880](https://github.com/ethyca/fides/pull/6880)
 
 ### Changed
-- Updated border radius on our design system theme [#6512](https://github.com/ethyca/fides/pull/6813)
+- Updated border radius on our design system theme [#6512](https://github.com/ethyca/fides/pull/6512)
 - Simplified data category selection logic in monitor field list items by replacing `user_assigned_data_categories` with unified `preferred_data_categories` field [#6817](https://github.com/ethyca/fides/pull/6817)
 - Custom fields are now shown in the list view of the new request manager [#6849](https://github.com/ethyca/fides/pull/6849)
 - Improved action center filters with tree-based UI and nested data categories [#6855](https://github.com/ethyca/fides/pull/6855)

clients/admin-ui/src/features/data-discovery-and-detection/action-center/action-center.slice.ts

@@ -39,7 +39,7 @@ import {
   MonitorAggregatedResults,
   MonitorSummaryPaginatedResponse,
 } from "./types";
-import { getMonitorType } from "./utils/getMonitorType";
+import { getMonitorType, MONITOR_TYPES } from "./utils/getMonitorType";
 
 interface MonitorResultSystemQueryParams {
   monitor_config_key: string;
@@ -57,12 +57,29 @@ const actionCenterApi = baseApi.injectEndpoints({
   endpoints: (build) => ({
     getAggregateMonitorResults: build.query<
       MonitorSummaryPaginatedResponse,
-      SearchQueryParams & PaginationQueryParams
+      SearchQueryParams &
+        PaginationQueryParams & {
+          monitor_type?: MONITOR_TYPES[]; // defaults to all monitor types if not provided
+        }
     >({
-      query: ({ page = 1, size = 20, search }) => ({
-        url: `/plus/discovery-monitor/aggregate-results`,
-        params: { page, size, search, diff_status: "addition" },
-      }),
+      query: ({ page = 1, size = 20, search, monitor_type }) => {
+        const params: SearchQueryParams &
+          PaginationQueryParams & { diff_status: string } = {
+          page,
+          size,
+          search,
+          diff_status: "addition",
+        };
+
+        const urlParams = buildArrayQueryParams({
+          monitor_type,
+        });
+
+        return {
+          url: `/plus/discovery-monitor/aggregate-results?${urlParams.toString()}`,
+          params,
+        };
+      },
       transformResponse: (
         response: PaginatedResponse<MonitorAggregatedResults>,
       ) => ({

clients/admin-ui/src/features/data-discovery-and-detection/action-center/components/InProgressMonitorTasksList.tsx

@@ -152,6 +152,11 @@ export const InProgressMonitorTasksList = () => {
         showSizeChanger={{
           suffixIcon: <Icons.ChevronDown />,
         }}
+        hideOnSinglePage={
+          // if we're on the smallest page size, and there's only one page, hide the pagination
+          paginationProps.pageSize?.toString() ===
+          paginationProps.pageSizeOptions?.[0]
+        }
       />
     </Flex>
   );

clients/admin-ui/src/features/data-discovery-and-detection/action-center/fields/page.tsx

@@ -427,6 +427,11 @@ const ActionCenterFields: NextPage = () => {
                 suffixIcon: <Icons.ChevronDown />,
               }}
               total={fieldsDataResponse?.total || 0}
+              hideOnSinglePage={
+                // if we're on the smallest page size, and there's only one page, hide the pagination
+                paginationProps.pageSize?.toString() ===
+                paginationProps.pageSizeOptions?.[0]
+              }
             />
           </Flex>
         </Splitter.Panel>

clients/admin-ui/src/pages/data-discovery/action-center/index.tsx

@@ -36,11 +36,18 @@ const ActionCenterPage = () => {
   const { webMonitor: webMonitorEnabled, llmClassifier: llmClassifierEnabled } =
     flags;
 
+  // Build monitor_type filter based on enabled feature flags
+  const monitorTypes: MONITOR_TYPES[] = [
+    ...(webMonitorEnabled ? [MONITOR_TYPES.WEBSITE] : []),
+    ...(llmClassifierEnabled ? [MONITOR_TYPES.DATASTORE] : []),
+  ];
+
   const { data, isError, isLoading, isFetching } =
     useGetAggregateMonitorResultsQuery({
       page: pageIndex,
       size: pageSize,
       search: searchQuery,
+      monitor_type: monitorTypes.length > 0 ? monitorTypes : undefined,
     });
 
   useEffect(() => {
@@ -58,21 +65,10 @@ const ActionCenterPage = () => {
     }
   }, [isError, toast]);
 
-  /*
-   * Filtering paginated results can lead to odd behaviors
-   * Either key should be constructed on the FE to display result, or BE should provide this functionality via the api
-   */
   const results =
-    data?.items
-      ?.flatMap((monitor) =>
-        !!monitor.key && typeof monitor.key !== "undefined" ? [monitor] : [],
-      )
-      .filter((monitor) => {
-        const isWebsite = monitor.monitorType === MONITOR_TYPES.WEBSITE;
-        // Show website monitors only if webMonitor flag is enabled
-        // Show non-website monitors only if llmClassifier flag is enabled
-        return isWebsite ? webMonitorEnabled : llmClassifierEnabled;
-      }) || [];
+    data?.items?.flatMap((monitor) =>
+      !!monitor.key && typeof monitor.key !== "undefined" ? [monitor] : [],
+    ) || [];
 
   const loadingResults = isFetching
     ? Array.from({ length: pageSize }, (_, index) => ({
@@ -193,6 +189,11 @@ const ActionCenterPage = () => {
             showSizeChanger={{
               suffixIcon: <Icons.ChevronDown />,
             }}
+            hideOnSinglePage={
+              // if we're on the smallest page size, and there's only one page, hide the pagination
+              paginationProps.pageSize?.toString() ===
+              paginationProps.pageSizeOptions?.[0]
+            }
           />
         </Flex>
       )}