fix snapshots, remove isManagedSidebar prop

patternfly · Oct 13, 2022 · 5860111 · 5860111
1 parent 8c1cf35
commit 5860111
Show file tree

Hide file tree

Showing 10 changed files with 18 additions and 34 deletions.
diff --git a/packages/react-core/src/components/Page/PageBreadcrumb.tsx b/packages/react-core/src/components/Page/PageBreadcrumb.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { css } from '@patternfly/react-styles';
 import styles from '@patternfly/react-styles/css/components/Page/page';
-import { formatBreakpointMods } from '../../helpers/util';
+import { formatBreakpointMods, Mods } from '../../helpers/util';
 import { PageContext } from './PageContext';
 
 export interface PageBreadcrumbProps extends React.HTMLProps<HTMLElement> {
@@ -54,7 +54,7 @@ export const PageBreadcrumb = ({
     <section
       className={css(
         styles.pageMainBreadcrumb,
-        formatBreakpointMods(stickyOnBreakpoint, styles, 'sticky-', getVerticalBreakpoint(height), true),
+        formatBreakpointMods(stickyOnBreakpoint as Mods, styles, 'sticky-', getVerticalBreakpoint(height), true),
         isWidthLimited && styles.modifiers.limitWidth,
         hasShadowTop && styles.modifiers.shadowTop,
         hasShadowBottom && styles.modifiers.shadowBottom,

diff --git a/packages/react-core/src/components/Page/PageHeader.tsx b/packages/react-core/src/components/Page/PageHeader.tsx
@@ -25,8 +25,6 @@ export interface PageHeaderProps extends React.HTMLProps<HTMLDivElement> {
   navToggleId?: string;
   /** True if the side nav is shown  */
   isNavOpen?: boolean;
-  /** This prop is no longer managed through PageHeader but in the Page component. */
-  isManagedSidebar?: boolean;
   /** Sets the value for role on the <main> element */
   role?: string;
   /** Callback function to handle the side nav toggle button, managed by the Page component if the Page isManagedSidebar prop is set to true */
@@ -43,7 +41,6 @@ export const PageHeader: React.FunctionComponent<PageHeaderProps> = ({
   headerTools = null as React.ReactNode,
   topNav = null as React.ReactNode,
   isNavOpen = true,
-  isManagedSidebar: deprecatedIsManagedSidebar = undefined,
   role = undefined as string,
   showNavToggle = false,
   navToggleId = 'nav-toggle',
@@ -53,11 +50,6 @@ export const PageHeader: React.FunctionComponent<PageHeaderProps> = ({
   ...props
 }: PageHeaderProps) => {
   const LogoComponent = logoComponent as any;
-  if ([false, true].includes(deprecatedIsManagedSidebar)) {
-    console.warn(
-      'isManagedSidebar is deprecated in the PageHeader component. To make the sidebar toggle uncontrolled, pass this prop in the Page component'
-    );
-  }
   return (
     <PageContextConsumer>
       {({ isManagedSidebar, onNavToggle: managedOnNavToggle, isNavOpen: managedIsNavOpen }: PageContextProps) => {

diff --git a/packages/react-core/src/components/Page/__tests__/PageBreadcrumb.test.tsx b/packages/react-core/src/components/Page/__tests__/PageBreadcrumb.test.tsx
@@ -12,11 +12,11 @@ describe('page breadcrumb', () => {
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top sticky', () => {
-    const { asFragment } = render(<PageBreadcrumb sticky="top">test</PageBreadcrumb>);
+    const { asFragment } = render(<PageBreadcrumb stickyOnBreakpoint={{ default: 'top' }}>test</PageBreadcrumb>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify bottom sticky', () => {
-    const { asFragment } = render(<PageBreadcrumb sticky="bottom">test</PageBreadcrumb>);
+    const { asFragment } = render(<PageBreadcrumb stickyOnBreakpoint={{ default: 'bottom' }}>test</PageBreadcrumb>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top shadow', () => {

diff --git a/packages/react-core/src/components/Page/__tests__/PageGroup.test.tsx b/packages/react-core/src/components/Page/__tests__/PageGroup.test.tsx
@@ -8,11 +8,11 @@ describe('page group', () => {
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top sticky', () => {
-    const { asFragment } = render(<PageGroup sticky="top">test</PageGroup>);
+    const { asFragment } = render(<PageGroup stickyOnBreakpoint={{ default: 'top' }}>test</PageGroup>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify bottom sticky', () => {
-    const { asFragment } = render(<PageGroup sticky="bottom">test</PageGroup>);
+    const { asFragment } = render(<PageGroup stickyOnBreakpoint={{ default: 'bottom' }}>test</PageGroup>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top shadow', () => {

diff --git a/packages/react-core/src/components/Page/__tests__/PageNavigation.test.tsx b/packages/react-core/src/components/Page/__tests__/PageNavigation.test.tsx
@@ -12,11 +12,11 @@ describe('page navigation', () => {
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top sticky', () => {
-    const { asFragment } = render(<PageNavigation sticky="top">test</PageNavigation>);
+    const { asFragment } = render(<PageNavigation stickyOnBreakpoint={{ default: 'top' }}>test</PageNavigation>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify bottom sticky', () => {
-    const { asFragment } = render(<PageNavigation sticky="bottom">test</PageNavigation>);
+    const { asFragment } = render(<PageNavigation stickyOnBreakpoint={{ default: 'bottom' }}>test</PageNavigation>);
     expect(asFragment()).toMatchSnapshot();
   });
   test('Verify top shadow', () => {

diff --git a/packages/react-core/src/components/Page/__tests__/PageSection.test.tsx b/packages/react-core/src/components/Page/__tests__/PageSection.test.tsx
@@ -65,12 +65,12 @@ test('Check page section with fill and no padding example against snapshot', ()
 });
 
 test('Verify page section top sticky', () => {
-  const { asFragment } = render(<PageSection sticky="top">test</PageSection>);
+  const { asFragment } = render(<PageSection stickyOnBreakpoint={{ default: 'top' }}>test</PageSection>);
   expect(asFragment()).toMatchSnapshot();
 });
 
 test('Verify page section bottom sticky', () => {
-  const { asFragment } = render(<PageSection sticky="bottom">test</PageSection>);
+  const { asFragment } = render(<PageSection stickyOnBreakpoint={{ default: 'bottom' }}>test</PageSection>);
   expect(asFragment()).toMatchSnapshot();
 });
 

diff --git a/packages/react-core/src/components/Page/__tests__/__snapshots__/PageBreadcrumb.test.tsx.snap b/packages/react-core/src/components/Page/__tests__/__snapshots__/PageBreadcrumb.test.tsx.snap
@@ -23,8 +23,7 @@ exports[`page breadcrumb Verify bottom shadow 1`] = `
 exports[`page breadcrumb Verify bottom sticky 1`] = `
 <DocumentFragment>
   <section
-    class="pf-c-page__main-breadcrumb"
-    sticky="bottom"
+    class="pf-c-page__main-breadcrumb pf-m-sticky-bottom"
   >
     test
   </section>
@@ -69,8 +68,7 @@ exports[`page breadcrumb Verify top shadow 1`] = `
 exports[`page breadcrumb Verify top sticky 1`] = `
 <DocumentFragment>
   <section
-    class="pf-c-page__main-breadcrumb"
-    sticky="top"
+    class="pf-c-page__main-breadcrumb pf-m-sticky-top"
   >
     test
   </section>

diff --git a/packages/react-core/src/components/Page/__tests__/__snapshots__/PageGroup.test.tsx.snap b/packages/react-core/src/components/Page/__tests__/__snapshots__/PageGroup.test.tsx.snap
@@ -23,8 +23,7 @@ exports[`page group Verify bottom shadow 1`] = `
 exports[`page group Verify bottom sticky 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-page__main-group"
-    sticky="bottom"
+    class="pf-c-page__main-group pf-m-sticky-bottom"
   >
     test
   </div>
@@ -55,8 +54,7 @@ exports[`page group Verify top shadow 1`] = `
 exports[`page group Verify top sticky 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-page__main-group"
-    sticky="top"
+    class="pf-c-page__main-group pf-m-sticky-top"
   >
     test
   </div>

diff --git a/packages/react-core/src/components/Page/__tests__/__snapshots__/PageNavigation.test.tsx.snap b/packages/react-core/src/components/Page/__tests__/__snapshots__/PageNavigation.test.tsx.snap
@@ -23,8 +23,7 @@ exports[`page navigation Verify bottom shadow 1`] = `
 exports[`page navigation Verify bottom sticky 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-page__main-nav"
-    sticky="bottom"
+    class="pf-c-page__main-nav pf-m-sticky-bottom"
   >
     test
   </div>
@@ -69,8 +68,7 @@ exports[`page navigation Verify top shadow 1`] = `
 exports[`page navigation Verify top sticky 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-page__main-nav"
-    sticky="top"
+    class="pf-c-page__main-nav pf-m-sticky-top"
   >
     test
   </div>

diff --git a/packages/react-core/src/components/Page/__tests__/__snapshots__/PageSection.test.tsx.snap b/packages/react-core/src/components/Page/__tests__/__snapshots__/PageSection.test.tsx.snap
@@ -101,8 +101,7 @@ exports[`Verify page section bottom shadow 1`] = `
 exports[`Verify page section bottom sticky 1`] = `
 <DocumentFragment>
   <section
-    class="pf-c-page__main-section"
-    sticky="bottom"
+    class="pf-c-page__main-section pf-m-sticky-bottom"
   >
     test
   </section>
@@ -133,8 +132,7 @@ exports[`Verify page section top shadow 1`] = `
 exports[`Verify page section top sticky 1`] = `
 <DocumentFragment>
   <section
-    class="pf-c-page__main-section"
-    sticky="top"
+    class="pf-c-page__main-section pf-m-sticky-top"
   >
     test
   </section>