collapsed > isCollapsed

elastic · Mar 31, 2022 · 41ffd07 · 41ffd07
1 parent 1b5ef2d
commit 41ffd07
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 11 deletions.
diff --git a/...s/src/page_template/solution_nav/__snapshots__/solution_nav_collapse_button.test.tsx.snap b/...s/src/page_template/solution_nav/__snapshots__/solution_nav_collapse_button.test.tsx.snap
diff --git a/packages/kbn-shared-ux-components/src/page_template/solution_nav/solution_nav.tsx b/packages/kbn-shared-ux-components/src/page_template/solution_nav/solution_nav.tsx
@@ -150,7 +150,7 @@ export const KibanaPageTemplateSolutionNav = ({
             </EuiFlyout>
           )}
           <KibanaPageTemplateSolutionNavCollapseButton
-            collapsed={true}
+            isCollapsed={true}
             onClick={toggleOpenOnMobile}
           />
         </>
@@ -159,7 +159,7 @@ export const KibanaPageTemplateSolutionNav = ({
         <>
           {sideNav()}
           <KibanaPageTemplateSolutionNavCollapseButton
-            collapsed={!isOpenOnDesktop}
+            isCollapsed={!isOpenOnDesktop}
             onClick={onCollapse}
           />
         </>

diff --git a/...shared-ux-components/src/page_template/solution_nav/solution_nav_collapse_button.test.tsx b/...shared-ux-components/src/page_template/solution_nav/solution_nav_collapse_button.test.tsx
@@ -12,15 +12,15 @@ import { KibanaPageTemplateSolutionNavCollapseButton } from './solution_nav_coll
 
 describe('KibanaPageTemplateSolutionNavCollapseButton', () => {
   test('renders', () => {
-    const component = shallow(<KibanaPageTemplateSolutionNavCollapseButton collapsed={false} />);
+    const component = shallow(<KibanaPageTemplateSolutionNavCollapseButton isCollapsed={false} />);
     expect(component).toMatchSnapshot();
     expect(component.find('.kbnPageTemplateSolutionNavCollapseButton').prop('title')).toBe(
       'Collapse side navigation'
     );
   });
 
-  test('collapsed', () => {
-    const component = shallow(<KibanaPageTemplateSolutionNavCollapseButton collapsed={true} />);
+  test('isCollapsed', () => {
+    const component = shallow(<KibanaPageTemplateSolutionNavCollapseButton isCollapsed={true} />);
     expect(component).toMatchSnapshot();
     expect(component.find('.kbnPageTemplateSolutionNavCollapseButton').prop('title')).toBe(
       'Open side navigation'

diff --git a/.../kbn-shared-ux-components/src/page_template/solution_nav/solution_nav_collapse_button.tsx b/.../kbn-shared-ux-components/src/page_template/solution_nav/solution_nav_collapse_button.tsx
@@ -18,7 +18,7 @@ export type KibanaPageTemplateSolutionNavCollapseButtonProps =
     /**
      * Boolean state of current collapsed status
      */
-    collapsed: boolean;
+    isCollapsed: boolean;
   };
 
 const collapseLabel = i18n.translate('sharedUXComponents.solutionNav.collapsibleLabel', {
@@ -34,13 +34,13 @@ const openLabel = i18n.translate('sharedUXComponents.solutionNav.openLabel', {
  */
 export const KibanaPageTemplateSolutionNavCollapseButton = ({
   className,
-  collapsed,
+  isCollapsed,
   ...rest
 }: KibanaPageTemplateSolutionNavCollapseButtonProps) => {
   const classes = classNames(
     'kbnPageTemplateSolutionNavCollapseButton',
     {
-      'kbnPageTemplateSolutionNavCollapseButton-isCollapsed': collapsed,
+      'kbnPageTemplateSolutionNavCollapseButton-isCollapsed': isCollapsed,
     },
     className
   );
@@ -50,9 +50,9 @@ export const KibanaPageTemplateSolutionNavCollapseButton = ({
       className={classes}
       size="s"
       color="text"
-      iconType={collapsed ? 'menuRight' : 'menuLeft'}
-      aria-label={collapsed ? openLabel : collapseLabel}
-      title={collapsed ? openLabel : collapseLabel}
+      iconType={isCollapsed ? 'menuRight' : 'menuLeft'}
+      aria-label={isCollapsed ? openLabel : collapseLabel}
+      title={isCollapsed ? openLabel : collapseLabel}
       {...rest}
     />
   );