chore: Expose private API to disable breadcrumbs globalization (#2892)

cloudscape-design · Oct 18, 2024 · b7c90b6 · b7c90b6
1 parent 11df6c3
commit b7c90b6
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 2 deletions.
diff --git a/src/app-layout/__tests__/global-breadcrumbs.test.tsx b/src/app-layout/__tests__/global-breadcrumbs.test.tsx
@@ -248,6 +248,19 @@ describeEachAppLayout({ themes: ['refresh-toolbar'], sizes: ['desktop'] }, () =>
       expect(findRootBreadcrumb().getElement()).toHaveTextContent('Static');
     });
   });
+
+  test('allows opt-out from this behavior', async () => {
+    render(
+      <AppLayout
+        breadcrumbs={<BreadcrumbGroup items={defaultBreadcrumbs} />}
+        content={<BreadcrumbGroup items={[{ text: 'Local', href: '' }]} {...{ __disableGlobalization: true }} />}
+      />
+    );
+    await waitFor(() =>
+      expect(wrapper.findAppLayout()!.find('[data-awsui-discovered-breadcrumbs="true"]')).toBeTruthy()
+    );
+    expect(findAllBreadcrumbsInstances()).toHaveLength(2);
+  });
 });
 
 describe('without feature flag', () => {

diff --git a/src/internal/plugins/helpers/use-global-breadcrumbs.ts b/src/internal/plugins/helpers/use-global-breadcrumbs.ts
@@ -7,11 +7,17 @@ import { BreadcrumbGroupProps } from '../../../breadcrumb-group/interfaces';
 import { awsuiPluginsInternal } from '../api';
 import { BreadcrumbsGlobalRegistration } from '../controllers/breadcrumbs';
 
-function useSetGlobalBreadcrumbsImplementation(props: BreadcrumbGroupProps<any>) {
+function useSetGlobalBreadcrumbsImplementation({
+  __disableGlobalization,
+  ...props
+}: BreadcrumbGroupProps<any> & { __disableGlobalization?: boolean }) {
   const registrationRef = useRef<BreadcrumbsGlobalRegistration<BreadcrumbGroupProps> | null>();
   const [registered, setRegistered] = useState(false);
 
   useEffect(() => {
+    if (__disableGlobalization) {
+      return;
+    }
     const registration = awsuiPluginsInternal.breadcrumbs.registerBreadcrumbs(props, () => setRegistered(true));
     registrationRef.current = registration;
 
@@ -20,7 +26,7 @@ function useSetGlobalBreadcrumbsImplementation(props: BreadcrumbGroupProps<any>)
     };
     // subsequent prop changes are handled by another effect
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [__disableGlobalization]);
 
   useLayoutEffect(() => {
     registrationRef.current?.update(props);