export default function DemoDefault()

in packages-rc/console-base-rc-aside-nav/stories/demo-default/index.tsx [44:90]

46 lines of code
2 McCabe index (conditional complexity)


export default function DemoDefault(): JSX.Element {
  const [stateNavKey, setStateNavKey] = useState<TKey>('VIPER');
  const [stateCollapsed, setStateCollapsed] = useState(false);
  const [stateUpperLevel, setStateUpperLevel] = useState(false);
  const [stateUpperTitle, setStateUpperTitle] = useState('');
  const navProps = NAV[stateNavKey];
  
  return <ScSite>
    <ScAside collapsed={stateCollapsed}>
      <AsideNav {...{
        ...navProps,
        upperTitle: stateUpperTitle,
        upperHref: stateUpperLevel ? '#/back-to-upper-level' : undefined,
        collapsed: stateCollapsed,
        onCollapsedChange: setStateCollapsed
      }} />
    </ScAside>
    <ScSiteMain>
      <ThemeSwitcher />
      <PkgInfo />
      <RadioGroup<TKey> {...{
        value: stateNavKey,
        items: Object.keys(NAV).map(v => ({
          label: v,
          value: v as TKey
        })),
        onChange: setStateNavKey
      }} />
      <InputSwitch {...{
        label: 'props.collapsed',
        value: stateCollapsed,
        onChange: setStateCollapsed
      }} />
      <InputSwitch {...{
        label: 'UpperLevel',
        value: stateUpperLevel,
        onChange: setStateUpperLevel
      }} />
      <InputText {...{
        placeholder: 'props.upperTitle',
        disabled: !stateUpperLevel,
        value: stateUpperTitle,
        onChange: setStateUpperTitle
      }} />
    </ScSiteMain>
  </ScSite>;
}