siakad-itm/resources/js/components/app-sidebar.tsx
Yoga Pangestu 2885de2c20 feat: add lecturer and student management pages with CRUD functionality
- Implemented LecturerEdit and LecturerIndex components for managing lecturers.
- Created StudentCreate and StudentEdit components for adding and editing students.
- Developed StudentIndex component for listing students with search and pagination.
- Added department and user types for better type safety.
- Updated routes for lecturers and students, including reset password functionality.
- Removed AppSidebar from dashboard for a cleaner layout.
2026-08-21 14:14:01 +07:00

118 lines
3.6 KiB
TypeScript

import { usePage } from '@inertiajs/react';
import type { Icon } from '@tabler/icons-react';
import {
IconGridDots,
IconHelp,
IconMessageDots,
IconUsers,
} from '@tabler/icons-react';
import * as React from 'react';
import AppLogoIcon from '@/components/app-logo-icon';
import { NavMain, type NavGroup, type NavItem } from '@/components/nav-main';
import { NavSecondary } from '@/components/nav-secondary';
import {
Sidebar,
SidebarContent,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
} from '@/components/ui/sidebar';
import { index as academicTerm } from '@/routes/admin/master/academic-terms';
import { index as departmentsRoute } from '@/routes/admin/master/departments';
import { index as lecturersRoute } from '@/routes/admin/users/lecturers';
import { index as studentsRoute } from '@/routes/admin/users/students';
import { index as administratorsRoute } from '@/routes/admin/users/administrators';
import { Building2, Calendar, GraduationCap, User, Users } from 'lucide-react';
const data: {
navMain: (NavGroup | NavItem)[];
navSecondary: { title: string; url: string; icon: Icon }[];
} = {
navMain: [
{
name: 'Dasbor',
url: '#',
icon: IconGridDots,
},
{
label: 'Master',
items: [
{
name: 'Periode Akademik',
url: academicTerm.url(),
icon: Calendar,
},
{
name: 'Jurusan',
url: departmentsRoute.url(),
icon: Building2,
},
],
},
{
label: 'Pengguna',
items: [
{
name: 'Administrator',
url: administratorsRoute.url(),
icon: User,
},
{
name: 'Dosen',
url: lecturersRoute.url(),
icon: Users,
},
{
name: 'Mahasiswa',
url: studentsRoute.url(),
icon: GraduationCap,
},
],
},
],
navSecondary: [
{
title: 'Kritik dan Saran',
url: '#',
icon: IconMessageDots,
},
{
title: 'Bantuan',
url: '#',
icon: IconHelp,
},
],
};
export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
const { name } = usePage().props;
return (
<Sidebar collapsible="icon" {...props}>
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton
asChild
className="data-[slot=sidebar-menu-button]:p-1.5!"
>
<a href="#">
<AppLogoIcon className="size-5! rounded-sm object-cover" />
<span className="text-base font-semibold">
{name}
</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
<SidebarContent>
<NavMain items={data.navMain} />
<NavSecondary items={data.navSecondary} className="mt-auto" />
</SidebarContent>
</Sidebar>
);
}