docs(components): fix overflow-menu showcases

akveo · Oct 14, 2019 · 9a5be22 · 9a5be22
1 parent a08e1d3
commit 9a5be22
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 23 deletions.
diff --git a/src/playground/src/ui/screen/overflowMenu/overflowMenuShowcase.component.tsx b/src/playground/src/ui/screen/overflowMenu/overflowMenuShowcase.component.tsx
@@ -18,9 +18,8 @@ export class OverflowMenuShowcase extends React.Component<OverflowMenuProps, Sta
     selectedMenuIndex: null,
   };
 
-  private toggleMenu = () => {
+  private toggleMenu = (): void => {
     const menuVisible: boolean = !this.state.menuVisible;
-
     this.setState({ menuVisible });
   };
 
@@ -39,7 +38,7 @@ export class OverflowMenuShowcase extends React.Component<OverflowMenuProps, Sta
         onSelect={this.onSelect}
         onBackdropPress={this.toggleMenu}>
         <Button onPress={this.toggleMenu}>
-          Show
+          TOGGLE MENU
         </Button>
       </OverflowMenu>
     );

diff --git a/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuAppearance.component.tsx b/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuAppearance.component.tsx
@@ -21,10 +21,10 @@ export class OverflowMenuWithoutDividerShowcase extends React.Component {
   ];
 
   onItemSelect = (selectedIndex) => {
-    this.setState({ selectedIndex });
+    this.setState({ selectedIndex }, this.toggleMenu);
   };
 
-  onToggleButtonPress = () => {
+  toggleMenu = () => {
     const menuVisible = !this.state.menuVisible;
     this.setState({ menuVisible });
   };
@@ -38,8 +38,8 @@ export class OverflowMenuWithoutDividerShowcase extends React.Component {
           visible={this.state.menuVisible}
           selectedIndex={this.state.selectedIndex}
           onSelect={this.onItemSelect}
-          onBackdropPress={this.onToggleButtonPress}>
-          <Button onPress={this.onToggleButtonPress}>
+          onBackdropPress={this.toggleMenu}>
+          <Button onPress={this.toggleMenu}>
             TOGGLE MENU
           </Button>
         </OverflowMenu>

diff --git a/...ground/src/ui/screen/showcases/overflowMenu/overflowMenuExternalSourceIcons.component.tsx b/...ground/src/ui/screen/showcases/overflowMenu/overflowMenuExternalSourceIcons.component.tsx
@@ -31,10 +31,10 @@ export class OverflowMenuExternalSourceIconsShowcase extends React.Component {
   ];
 
   onItemSelect = (selectedIndex) => {
-    this.setState({ selectedIndex });
+    this.setState({ selectedIndex }, this.toggleMenu);
   };
 
-  onToggleButtonPress = () => {
+  toggleMenu = () => {
     const menuVisible = !this.state.menuVisible;
     this.setState({ menuVisible });
   };
@@ -47,8 +47,8 @@ export class OverflowMenuExternalSourceIconsShowcase extends React.Component {
           visible={this.state.menuVisible}
           selectedIndex={this.state.selectedIndex}
           onSelect={this.onItemSelect}
-          onBackdropPress={this.onToggleButtonPress}>
-          <Button onPress={this.onToggleButtonPress}>
+          onBackdropPress={this.toggleMenu}>
+          <Button onPress={this.toggleMenu}>
             TOGGLE MENU
           </Button>
         </OverflowMenu>

diff --git a/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuSimpleUsage.component.tsx b/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuSimpleUsage.component.tsx
@@ -21,10 +21,10 @@ export class OverflowMenuSimpleUsageShowcase extends React.Component {
   ];
 
   onItemSelect = (selectedIndex) => {
-    this.setState({ selectedIndex });
+    this.setState({ selectedIndex }, this.toggleMenu);
   };
 
-  onToggleButtonPress = () => {
+  toggleMenu = () => {
     const menuVisible = !this.state.menuVisible;
     this.setState({ menuVisible });
   };
@@ -37,8 +37,8 @@ export class OverflowMenuSimpleUsageShowcase extends React.Component {
           visible={this.state.menuVisible}
           selectedIndex={this.state.selectedIndex}
           onSelect={this.onItemSelect}
-          onBackdropPress={this.onToggleButtonPress}>
-          <Button onPress={this.onToggleButtonPress}>
+          onBackdropPress={this.toggleMenu}>
+          <Button onPress={this.toggleMenu}>
             TOGGLE MENU
           </Button>
         </OverflowMenu>

diff --git a/...ayground/src/ui/screen/showcases/overflowMenu/overflowMenuWithDisabledItems.component.tsx b/...ayground/src/ui/screen/showcases/overflowMenu/overflowMenuWithDisabledItems.component.tsx
@@ -21,10 +21,10 @@ export class OverflowMenuWithDisabledItemsShowcase extends React.Component {
   ];
 
   onItemSelect = (selectedIndex) => {
-    this.setState({ selectedIndex });
+    this.setState({ selectedIndex }, this.toggleMenu);
   };
 
-  onToggleButtonPress = () => {
+  toggleMenu = () => {
     const menuVisible = !this.state.menuVisible;
     this.setState({ menuVisible });
   };
@@ -37,8 +37,8 @@ export class OverflowMenuWithDisabledItemsShowcase extends React.Component {
           visible={this.state.menuVisible}
           selectedIndex={this.state.selectedIndex}
           onSelect={this.onItemSelect}
-          onBackdropPress={this.onToggleButtonPress}>
-          <Button onPress={this.onToggleButtonPress}>
+          onBackdropPress={this.toggleMenu}>
+          <Button onPress={this.toggleMenu}>
             TOGGLE MENU
           </Button>
         </OverflowMenu>

diff --git a/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuWithIcons.component.tsx b/src/playground/src/ui/screen/showcases/overflowMenu/overflowMenuWithIcons.component.tsx
@@ -31,10 +31,10 @@ export class OverflowMenuWithIconsShowcase extends React.Component {
   ];
 
   onItemSelect = (selectedIndex) => {
-    this.setState({ selectedIndex });
+    this.setState({ selectedIndex }, this.toggleMenu);
   };
 
-  onToggleButtonPress = () => {
+  toggleMenu = () => {
     const menuVisible = !this.state.menuVisible;
     this.setState({ menuVisible });
   };
@@ -47,8 +47,8 @@ export class OverflowMenuWithIconsShowcase extends React.Component {
           visible={this.state.menuVisible}
           selectedIndex={this.state.selectedIndex}
           onSelect={this.onItemSelect}
-          onBackdropPress={this.onToggleButtonPress}>
-          <Button onPress={this.onToggleButtonPress}>
+          onBackdropPress={this.toggleMenu}>
+          <Button onPress={this.toggleMenu}>
             TOGGLE MENU
           </Button>
         </OverflowMenu>