import { Fragment, useState, useEffect } from 'react';
import { useRouter } from 'next/router';
import { motion } from 'framer-motion';
import { Listbox, Transition } from '@headlessui/react';
import routes from '@/config/routes';
import ActiveLink from '@/components/ui/links/active-link';
import { fadeInBottom } from '@/lib/framer-motion/fade-in-bottom';
import { useBreakpoint } from '@/lib/hooks/use-breakpoint';
import { useIsMounted } from '@/lib/hooks/use-is-mounted';
import { useTranslation } from 'next-i18next';
const menuItems = [
{
label: 'text-help-page-title',
path: routes.help,
},
{
label: 'text-license-agreement',
path: routes.licensing,
},
{
label: 'text-terms-and-conditions',
path: routes.terms,
},
{
label: 'text-privacy-page-title',
path: routes.privacy,
},
];
function SidebarNav() {
const { t } = useTranslation('common');
return (
);
}
function SidebarMobileNav() {
const { t } = useTranslation('common');
const { pathname } = useRouter();
const currentPath = menuItems.findIndex((item) => item.path === pathname);
let [selected, setSelected] = useState(menuItems[currentPath]);
useEffect(() => {
setSelected(menuItems[currentPath]);
}, [currentPath]);
return (
);
}
export default function GeneralContainer({
children,
}: React.PropsWithChildren<{}>) {
const breakpoint = useBreakpoint();
const isMounted = useIsMounted();
return (
{children}
);
}