Merge pull request #444 from DataRecce/feature/drc-682-add-informatio…

…n-in-checklist [Feature] Rename checks tab to checklist
DataRecce · Oct 7, 2024 · 5bd28a8 · 5bd28a8
2 parents cbb0a83 + 16253d0
commit 5bd28a8
Showing 1 changed file with 14 additions and 13 deletions.
diff --git a/js/app/page.tsx b/js/app/page.tsx
@@ -191,6 +191,7 @@ function TopBar() {
 interface TabProps {
   name: string;
   href: string;
+  badge?: ReactNode;
 }
 
 function TabBadge<T, R extends number>({
@@ -236,22 +237,28 @@ function NavBar() {
   const { isDemoSite, cloudMode, isLoading } = useLineageGraphContext();
   const [location, setLocation] = useLocation();
 
+  const checklistBadge = (
+    <TabBadge<Check[], number>
+      queryKey={cacheKeys.checks()}
+      fetchCallback={listChecks}
+      selectCallback={(checks: Check[]) => {
+        return checks.filter((check) => !check.is_checked).length;
+      }}
+    />
+  );
+
   const tabs: TabProps[] = [
     { name: "Lineage", href: "/lineage" },
     { name: "Query", href: "/query" },
-    { name: "Checks", href: "/checks" },
+    { name: "Checklist", href: "/checks", badge: checklistBadge },
   ];
 
-  const calPendingChecks = (checks: Check[]) => {
-    return checks.filter((check) => !check.is_checked).length;
-  };
-
   const tabIndex = _.findIndex(tabs, ({ href }) => location.startsWith(href));
 
   return (
     <Tabs index={tabIndex}>
       <TabList>
-        {tabs.map(({ name, href }) => {
+        {tabs.map(({ name, href, badge }) => {
           return (
             <Tab
               key={name}
@@ -260,13 +267,7 @@ function NavBar() {
               }}
             >
               {name}
-              {name === "Checks" && (
-                <TabBadge<Check[], number>
-                  queryKey={cacheKeys.checks()}
-                  fetchCallback={listChecks}
-                  selectCallback={calPendingChecks}
-                />
-              )}
+              {badge}
             </Tab>
           );
         })}