fix(dashboard): only show the first 10 projects in dropdown

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-09-20 15:15:24 +02:00
parent 2032f49345
commit d183705481
2 changed files with 7 additions and 3 deletions

View File

@@ -29,6 +29,7 @@ import type {
getCurrentOrganizations, getCurrentOrganizations,
getProjectsByOrganizationSlug, getProjectsByOrganizationSlug,
} from '@openpanel/db'; } from '@openpanel/db';
import Link from 'next/link';
interface LayoutProjectSelectorProps { interface LayoutProjectSelectorProps {
projects: Awaited<ReturnType<typeof getProjectsByOrganizationSlug>>; projects: Awaited<ReturnType<typeof getProjectsByOrganizationSlug>>;
@@ -86,7 +87,7 @@ export default function LayoutProjectSelector({
<DropdownMenuContent align={align} className="w-[200px]"> <DropdownMenuContent align={align} className="w-[200px]">
<DropdownMenuLabel>Projects</DropdownMenuLabel> <DropdownMenuLabel>Projects</DropdownMenuLabel>
<DropdownMenuGroup> <DropdownMenuGroup>
{projects.map((project) => ( {projects.slice(0, 10).map((project) => (
<DropdownMenuItem <DropdownMenuItem
key={project.id} key={project.id}
onClick={() => changeProject(project.id)} onClick={() => changeProject(project.id)}
@@ -99,7 +100,11 @@ export default function LayoutProjectSelector({
)} )}
</DropdownMenuItem> </DropdownMenuItem>
))} ))}
<DropdownMenuSeparator /> {projects.length > 10 && (
<DropdownMenuItem asChild>
<Link href={`/${organizationSlug}`}>All projects</Link>
</DropdownMenuItem>
)}
<DropdownMenuItem <DropdownMenuItem
className="text-emerald-600" className="text-emerald-600"
onClick={() => pushModal('AddProject')} onClick={() => pushModal('AddProject')}

View File

@@ -4,7 +4,6 @@ import { LogoSquare } from '@/components/logo';
import SettingsToggle from '@/components/settings-toggle'; import SettingsToggle from '@/components/settings-toggle';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { cn } from '@/utils/cn'; import { cn } from '@/utils/cn';
import { Rotate as Hamburger } from 'hamburger-react';
import { MenuIcon, XIcon } from 'lucide-react'; import { MenuIcon, XIcon } from 'lucide-react';
import { usePathname } from 'next/navigation'; import { usePathname } from 'next/navigation';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';