import Link from 'next/link';

import { Menu } from 'lucide-react';

import { pathsConfig } from '@kit/shared/config';
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuTrigger,
} from '@kit/ui/dropdown-menu';
import { Trans } from '@kit/ui/trans';

export function DoctorMobileNavigation() {
  return (
    <DropdownMenu>
      <DropdownMenuTrigger>
        <Menu className={'h-8 w-8'} />
      </DropdownMenuTrigger>

      <DropdownMenuContent>
        <DropdownMenuItem>
          <Link href={pathsConfig.app.home}>
            <Trans i18nKey={'common:routes.home'} />
          </Link>
        </DropdownMenuItem>
        <DropdownMenuItem>
          <Link href={pathsConfig.app.doctor}>
            <Trans i18nKey={'doctor:sidebar.dashboard'} />
          </Link>
        </DropdownMenuItem>
        <DropdownMenuItem>
          <Link href={pathsConfig.app.openJobs}>
            <Trans i18nKey={'doctor:sidebar.openReviews'} />
          </Link>
        </DropdownMenuItem>
        <DropdownMenuItem>
          <Link href={pathsConfig.app.myJobs}>
            <Trans i18nKey={'doctor:sidebar.myReviews'} />
          </Link>
        </DropdownMenuItem>
        <DropdownMenuItem>
          <Link href={pathsConfig.app.completedJobs}>
            <Trans i18nKey={'doctor:sidebar.completedReviews'} />
          </Link>
        </DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  );
}