Poll for classification updates (#1908)

Co-authored-by: Sean Preston <[email protected]>

CHANGELOG.md

@@ -25,6 +25,7 @@ The types of changes are:
 * Add function to poll privacy request for completion [#1860](https://github.com/ethyca/fides/pull/1860)
 * Added rescan flow for the data flow scanner [#1844](https://github.com/ethyca/fides/pull/1844)
 * Add Fides connector to support parent-child Fides deployments [#1861](https://github.com/ethyca/fides/pull/1861)
+* Classification UI now polls for updates to classifications [#1908](https://github.com/ethyca/fides/pull/1908)
 
 ### Changed
 

clients/admin-ui/src/pages/classify-systems/index.tsx

@@ -2,7 +2,7 @@ import { Button, Heading, HStack, Spinner, Stack, Text } from "@fidesui/react";
 import type { NextPage } from "next";
 import NextLink from "next/link";
 import { useRouter } from "next/router";
-import { ReactNode, useEffect } from "react";
+import { ReactNode, useEffect, useState } from "react";
 import { useDispatch } from "react-redux";
 
 import { useAppSelector } from "~/app/hooks";
@@ -20,6 +20,8 @@ import {
 import ClassifySystemsTable from "~/features/system/ClassifySystemsTable";
 import { ClassificationStatus, GenerateTypes } from "~/types/api";
 
+const POLL_INTERVAL_SECONDS = 3;
+
 const ClassifySystemsLayout = ({ children }: { children: ReactNode }) => (
   <Layout title="Classify Systems">
     <Stack spacing={4}>
@@ -56,13 +58,18 @@ const ClassifySystems: NextPage = () => {
     }
   }, [dispatch, allSystems]);
 
+  // Poll for updates to classification until all classifications are finished
+  const [shouldPoll, setShouldPoll] = useState(true);
   const { isLoading: isLoadingClassifications, data: classifications } =
     useGetAllClassifyInstancesQuery(
       {
         resource_type: GenerateTypes.SYSTEMS,
         fides_keys: systems?.map((s) => s.fides_key),
       },
-      { skip: !hasPlus }
+      {
+        skip: !hasPlus,
+        pollingInterval: shouldPoll ? POLL_INTERVAL_SECONDS * 1000 : undefined,
+      }
     );
 
   useEffect(() => {
@@ -82,6 +89,12 @@ const ClassifySystems: NextPage = () => {
       )
     : false;
 
+  useEffect(() => {
+    if (isClassificationFinished) {
+      setShouldPoll(false);
+    }
+  }, [isClassificationFinished]);
+
   if (isLoading) {
     return (
       <ClassifySystemsLayout>