import React from 'react' ; import { storiesOf } from '@storybook/react' ; import { Flex } from 'design' ; import MenuSshLogin from './MenuSshLogin' ; import { Router } from 'react-router' ; import { createMemoryHistory } from 'history' ; storiesOf ( 'Shared/MenuSshLogin' , module ) . add ( 'MenuSshLogin' , ( ) => ( < Flex width = "400px" height = "100px" alignItems = "center" justifyContent = "space-around" bg = "primary.light" > < MenuSshLogin onOpen = { ( ) => [ ] } onSelect = { ( ) => null } /> < SampleMenu / > < /Flex>)); class SampleMenu extends React . Component { menuRef = React . createRef < MenuSshLogin > ( ) ; componentDidMount ( ) { this . menuRef . current . onOpen ( ) ; } render ( ) { return ( < Router history = { createMemoryHistory ( ) } > < MenuSshLogin ref = { this . menuRef } onOpen = { ( ) => loginItems } onSelect = { ( ) => null } / > < /Router>); } } const loginItems = [ 'root' , 'jazrafiba' , 'evubale' , 'ipizodu' ] . map ( login => ( { url : '' , login , } ) ) ;