box-ui-elements 23.4.0-beta.19 → 23.4.0-beta.20

package/src/elements/content-sidebar/versions/VersionsSidebarContainer.js

@@ -24,6 +24,7 @@ import { withAPIContext } from '../../common/api-context';
 import type { FeatureConfig } from '../../common/feature-checking';
 import type { VersionActionCallback, VersionChangeCallback, SidebarLoadCallback } from './flowTypes';
 import type { BoxItemVersion, BoxItem, FileVersions } from '../../../common/types/core';
+import { ViewType, type ViewTypeValues } from '../../common/types/SidebarNavigation';
 
 type Props = {
     api: API,
@@ -40,7 +41,7 @@ type Props = {
     onVersionPreview: VersionActionCallback,
     onVersionPromote: VersionActionCallback,
     onVersionRestore: VersionActionCallback,
-    parentName: string,
+    parentName: ViewTypeValues,
     versionId?: string,
 };
 
@@ -63,7 +64,7 @@ class VersionsSidebarContainer extends React.Component<Props, State> {
         onVersionPreview: noop,
         onVersionPromote: noop,
         onVersionRestore: noop,
-        parentName: '',
+        parentName: ViewType.DETAILS,
     };
 
     api: VersionsSidebarAPI;

package/src/elements/content-sidebar/versions/__tests__/StaticVersionSidebar.test.js

@@ -100,7 +100,8 @@ describe('elements/content-sidebar/versions/StaticVersionSidebar', () => {
         expect(backButton).toHaveAttribute('data-resin-target', 'back');
     });
 
-    test('should navigate when BackButton is clicked', async () => {
+    test('should navigate when BackButton is clicked and not use internal handler', async () => {
+        const mockNavigationHandler = jest.fn();
         let currentLocation;
 
         const TestWrapper = ({ children }) => (
@@ -117,7 +118,11 @@ describe('elements/content-sidebar/versions/StaticVersionSidebar', () => {
 
         render(
             <TestWrapper>
-                <StaticVersionSidebar {...defaultProps} parentName="details" />
+                <StaticVersionSidebar 
+                    {...defaultProps} 
+                    parentName="details"
+                    internalSidebarNavigationHandler={mockNavigationHandler}
+                />
             </TestWrapper>,
         );
 
@@ -127,7 +132,10 @@ describe('elements/content-sidebar/versions/StaticVersionSidebar', () => {
         const user = userEvent();
         await user.click(backButton);
 
+        // Should use router navigation
         expect(currentLocation.pathname).toBe('/details');
+        // Should not use internal handler when router is enabled
+        expect(mockNavigationHandler).not.toHaveBeenCalled();
     });
 
     test('should pass loading state to LoadingIndicatorWrapper', () => {
@@ -166,4 +174,50 @@ describe('elements/content-sidebar/versions/StaticVersionSidebar', () => {
         expect(upgradeButton).toHaveAttribute('type', 'button');
         expect(upgradeButton).toHaveTextContent('Upgrade');
     });
+
+    describe('when routerDisabled is true', () => {
+        const renderComponentWithoutRouter = (props = {}) => {
+            return render(<StaticVersionSidebar {...defaultProps} routerDisabled {...props} />);
+        };
+
+        test('should render without React Router', () => {
+            renderComponentWithoutRouter();
+
+            expect(screen.getByRole('tabpanel')).toBeInTheDocument();
+            expect(screen.getByTestId('back-button')).toBeInTheDocument();
+            expect(screen.getByTestId('versions-menu')).toBeInTheDocument();
+        });
+
+        test('should use internalSidebarNavigationHandler when BackButton is clicked', async () => {
+            const mockNavigationHandler = jest.fn();
+            const user = userEvent();
+            
+            renderComponentWithoutRouter({
+                internalSidebarNavigationHandler: mockNavigationHandler,
+                parentName: 'details',
+            });
+
+            const backButton = screen.getByTestId('back-button');
+            await user.click(backButton);
+
+            expect(mockNavigationHandler).toHaveBeenCalledTimes(1);
+            expect(mockNavigationHandler).toHaveBeenCalledWith({ sidebar: 'details' });
+        });
+
+        test('should pass props to VersionsMenu when router is disabled', () => {
+            const mockInternalSidebarNavigation = {
+                sidebar: 'activity',
+                open: true,
+            };
+
+            renderComponentWithoutRouter({
+                internalSidebarNavigation: mockInternalSidebarNavigation,
+            });
+
+            // Verify VersionsMenu is rendered (props are passed but not visible in mock)
+            expect(screen.getByTestId('versions-menu')).toBeInTheDocument();
+        });
+    });
+
+
 });

package/src/elements/content-sidebar/versions/__tests__/VersionsSidebar.test.js

@@ -132,6 +132,7 @@ describe('elements/content-sidebar/versions/VersionsSidebar', () => {
     });
 
     test('should navigate to parent name when back button is clicked', async () => {
+        const mockNavigationHandler = jest.fn();
         let currentLocation;
 
         const TestWrapper = ({ children }) => (
@@ -148,7 +149,11 @@ describe('elements/content-sidebar/versions/VersionsSidebar', () => {
 
         render(
             <TestWrapper>
-                <VersionsSidebar {...defaultProps} parentName="activity" />
+                <VersionsSidebar 
+                    {...defaultProps} 
+                    parentName="activity"
+                    internalSidebarNavigationHandler={mockNavigationHandler}
+                />
             </TestWrapper>,
         );
 
@@ -159,5 +164,49 @@ describe('elements/content-sidebar/versions/VersionsSidebar', () => {
         await user.click(backButton);
 
         expect(currentLocation.pathname).toBe('/activity');
+        expect(mockNavigationHandler).not.toHaveBeenCalled();
+    });
+
+    describe('when routerDisabled is true', () => {
+        const renderComponentWithoutRouter = (props = {}) => {
+            return render(<VersionsSidebar {...defaultProps} routerDisabled {...props} />);
+        };
+
+        test('should render without React Router', () => {
+            renderComponentWithoutRouter();
+
+            expect(screen.getByText('Version History')).toBeInTheDocument();
+            expect(screen.getByTestId('back-button')).toBeInTheDocument();
+            expect(screen.getByTestId('versions-menu')).toBeInTheDocument();
+        });
+
+        test('should use internalSidebarNavigationHandler when BackButton is clicked', async () => {
+            const mockNavigationHandler = jest.fn();
+            const user = userEvent();
+            
+            renderComponentWithoutRouter({
+                internalSidebarNavigationHandler: mockNavigationHandler,
+                parentName: 'details',
+            });
+
+            const backButton = screen.getByTestId('back-button');
+            await user.click(backButton);
+
+            expect(mockNavigationHandler).toHaveBeenCalledTimes(1);
+            expect(mockNavigationHandler).toHaveBeenCalledWith({ sidebar: 'details' });
+        });
+
+        test('should pass props to VersionsMenu when router is disabled', () => {
+            const mockInternalSidebarNavigation = {
+                sidebar: 'activity',
+                open: true,
+            };
+
+            renderComponentWithoutRouter({
+                internalSidebarNavigation: mockInternalSidebarNavigation,
+            });
+
+            expect(screen.getByTestId('versions-menu')).toBeInTheDocument();
+        });
     });
 });

package/src/elements/content-sidebar/versions/__tests__/__snapshots__/VersionsSidebarContainer.test.js.snap

@@ -12,7 +12,7 @@ exports[`elements/content-sidebar/versions/VersionsSidebarContainer handleFetchE
   isLoading={false}
   isWatermarked={false}
   onUpgradeClick={[Function]}
-  parentName=""
+  parentName="details"
   versionCount={0}
   versionLimit={Infinity}
   versions={[]}
@@ -36,7 +36,7 @@ exports[`elements/content-sidebar/versions/VersionsSidebarContainer handleFetchE
   onPreview={[Function]}
   onPromote={[Function]}
   onRestore={[Function]}
-  parentName=""
+  parentName="details"
   versionCount={0}
   versionLimit={Infinity}
   versions={[]}