fix: ensure initialNamespaceFilters filter's the initial sitemap (#585

) * fix: ensure `initialNamespaceFilters` filter's the initial sitemap * fix: only show filter bar if there are multiple namespaces on sitemap
jpmorganchase · Mar 14, 2024 · d79533a · d79533a
1 parent 8ba714e
commit d79533a
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 19 deletions.
diff --git a/.changeset/shy-zoos-suffer.md b/.changeset/shy-zoos-suffer.md
@@ -0,0 +1,5 @@
+---
+'@jpmorganchase/mosaic-sitemap-component': patch
+---
+
+`initialNamespaceFilters` should filter the initial Sitemap view
diff --git a/packages/sitemap-component/src/SitemapToolbar.tsx b/packages/sitemap-component/src/SitemapToolbar.tsx
@@ -48,23 +48,25 @@ export const SitemapToolbar: React.FC<SitemapToolbarProps> = ({
       {!loading ? (
         <>
           <Caption2 className={styles.pageCount}>Number of pages: {pageCount}</Caption2>
-          <Dropdown<string, 'multiple'>
-            aria-label={isOpen ? 'close filters menu' : 'open filters menu'}
-            className={styles.filterDropdown}
-            onOpenChange={setIsOpen}
-            onSelectionChange={handleSelect}
-            selected={filters}
-            selectionStrategy="multiple"
-            source={namespaces}
-            triggerComponent={
-              <span className={styles.filterDropdownTriggerRoot}>
-                <Icon name="filter" />
-                <DropdownButton label={defaultButtonLabel(filters)} />
-              </span>
-            }
-            width={200}
-            {...rest}
-          />
+          {namespaces?.length >= 1 ? (
+            <Dropdown<string, 'multiple'>
+              aria-label={isOpen ? 'close filters menu' : 'open filters menu'}
+              className={styles.filterDropdown}
+              onOpenChange={setIsOpen}
+              onSelectionChange={handleSelect}
+              selected={filters}
+              selectionStrategy="multiple"
+              source={namespaces}
+              triggerComponent={
+                <span className={styles.filterDropdownTriggerRoot}>
+                  <Icon name="filter" />
+                  <DropdownButton label={defaultButtonLabel(filters)} />
+                </span>
+              }
+              width={200}
+              {...rest}
+            />
+          ) : null}
         </>
       ) : null}
     </div>

diff --git a/packages/sitemap-component/src/SitemapTree.tsx b/packages/sitemap-component/src/SitemapTree.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { Spinner } from '@salt-ds/core';
-import { useToolbarState } from '@jpmorganchase/mosaic-components';
+import { useToolbarState, ToolbarProvider } from '@jpmorganchase/mosaic-components';
 
 import drawTree from './drawTree';
 import styles from './styles.css';
@@ -64,7 +64,7 @@ function getAllNamespaces(routes): string[] {
   }, []);
 }
 
-export const SitemapTree: React.FC<SitemapTreeProps> = ({
+export const Sitemap: React.FC<SitemapTreeProps> = ({
   d3,
   href = '/sitemap.xml',
   initialNamespaceFilters = [],
@@ -175,3 +175,14 @@ export const SitemapTree: React.FC<SitemapTreeProps> = ({
     </div>
   );
 };
+
+export const SitemapTree: React.FC<SitemapTreeProps> = ({
+  initialNamespaceFilters = [],
+  ...props
+}) => {
+  return (
+    <ToolbarProvider initialState={{ filters: initialNamespaceFilters }}>
+      <Sitemap {...props} />
+    </ToolbarProvider>
+  );
+};