- Next.js 15.2.4 with React 19 and TypeScript - Monthly schedule generator with Excel-like formatting - Complete employee list from example.xlsx (18 employees) - Excel-style column naming (A, B, C, ..., Z, AA, AB, ...) - Counter-clockwise text rotation for data values - Weekend highlighting and shift color coding - Team selection for TKB, METRO, D8 - 7 days from previous month + full current month date range - jspreadsheet integration for Excel-like interface 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
55 lines
1.8 KiB
TypeScript
55 lines
1.8 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import { TeamSidebar } from "@/components/team-sidebar"
|
|
import { ScheduleTabs } from "@/components/schedule-tabs"
|
|
import {
|
|
Breadcrumb,
|
|
BreadcrumbItem,
|
|
BreadcrumbLink,
|
|
BreadcrumbList,
|
|
BreadcrumbPage,
|
|
BreadcrumbSeparator,
|
|
} from "@/components/ui/breadcrumb"
|
|
import { Separator } from "@/components/ui/separator"
|
|
import { SidebarInset, SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar"
|
|
|
|
// Team data for display
|
|
const teamData = {
|
|
maintenance: "Maintenance Team",
|
|
electrical: "Electrical Team",
|
|
hvac: "HVAC Team",
|
|
security: "Security Team",
|
|
cleaning: "Cleaning Team",
|
|
}
|
|
|
|
export default function TimeshiftManager() {
|
|
const [selectedTeam, setSelectedTeam] = React.useState("maintenance")
|
|
|
|
return (
|
|
<SidebarProvider>
|
|
<TeamSidebar selectedTeam={selectedTeam} onTeamSelect={setSelectedTeam} />
|
|
<SidebarInset>
|
|
<header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
|
|
<SidebarTrigger className="-ml-1" />
|
|
<Separator orientation="vertical" className="mr-2 h-4" />
|
|
<Breadcrumb>
|
|
<BreadcrumbList>
|
|
<BreadcrumbItem className="hidden md:block">
|
|
<BreadcrumbLink href="#">TimeShift 161</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
<BreadcrumbSeparator className="hidden md:block" />
|
|
<BreadcrumbItem>
|
|
<BreadcrumbPage>{teamData[selectedTeam as keyof typeof teamData]}</BreadcrumbPage>
|
|
</BreadcrumbItem>
|
|
</BreadcrumbList>
|
|
</Breadcrumb>
|
|
</header>
|
|
<div className="flex flex-1 flex-col gap-4 p-4">
|
|
<ScheduleTabs teamId={selectedTeam} teamName={teamData[selectedTeam as keyof typeof teamData]} />
|
|
</div>
|
|
</SidebarInset>
|
|
</SidebarProvider>
|
|
)
|
|
}
|