Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/FoxxMD/multi-scrobbler. Scrobble plays from multiple sources to multiple clients docs.multi-scrobbler.app
deezer docker jellyfin koito lastfm listenbrainz maloja mopidy mpris music music-assistant plex scrobble self-hosted spotify subsonic tautulli youtube-music
Something went wrong. Try again.
2.1 kB · 62 lines
TSX
at strict
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162import { Drawer, IconButton, Portal, type BreakpointName,} from "@chakra-ui/react";import { useEffect, useState, type ComponentProps } from 'react';import { useLocation } from 'react-router';import { MenuButton, XIcon } from "./icons/ChakraIcons";import { NAV_LINKS, SideNavItems } from "./SideNav";
const MobileMenuButton = MenuButton;
export const MobileSidebarNav = (props: { hideFrom?: BreakpointName | false } = {}) => { const [isOpen, setIsOpen] = useState(false);
const location = useLocation();
const closeMenu = () => setIsOpen(false)
const menuButtonProps: ComponentProps<typeof MobileMenuButton> = { variant: 'ghost', iconProps: { size: 'lg' } };
useEffect(() => { setIsOpen(false); }, [location, setIsOpen])
return ( <> <Drawer.Root open={isOpen} placement="start" onPointerDownOutside={closeMenu} onEscapeKeyDown={closeMenu} onOpenChange={(e) => setIsOpen(e.open)} > <Drawer.Trigger asChild> <MobileMenuButton aria-label="Open menu" {...menuButtonProps}/> </Drawer.Trigger> <Portal> <Drawer.Backdrop /> <Drawer.Positioner> <Drawer.Content borderTopRadius="md" maxH="var(--content-height)"> <Drawer.CloseTrigger asChild> <IconButton size="sm" variant="ghost"> <XIcon /> </IconButton> </Drawer.CloseTrigger> <Drawer.Body display="flex" flexDir="column" gap="6" py="5" flex="1"> <SideNavItems items={NAV_LINKS} currentUrl={location.pathname} /> </Drawer.Body> </Drawer.Content> </Drawer.Positioner> </Portal> </Drawer.Root> </> )}