mirror of
https://github.com/i701/sarlink-portal.git
synced 2025-07-28 17:20:23 +00:00
add admin checks for admin pages and run biome formating 🔨
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 11m8s
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 11m8s
This commit is contained in:
@ -1,129 +1,136 @@
|
||||
import { eachMonthOfInterval, endOfYear, format, startOfYear } from "date-fns"
|
||||
import { Calendar as CalendarIcon } from "lucide-react"
|
||||
import * as React from "react"
|
||||
import { eachMonthOfInterval, endOfYear, format, startOfYear } from "date-fns";
|
||||
import { Calendar as CalendarIcon } from "lucide-react";
|
||||
import * as React from "react";
|
||||
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Calendar } from "@/components/ui/calendar"
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Calendar } from "@/components/ui/calendar";
|
||||
import {
|
||||
Popover,
|
||||
PopoverContent,
|
||||
PopoverTrigger,
|
||||
} from "@/components/ui/popover"
|
||||
Popover,
|
||||
PopoverContent,
|
||||
PopoverTrigger,
|
||||
} from "@/components/ui/popover";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select"
|
||||
import { cn } from "@/lib/utils"
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface DatePickerProps {
|
||||
date: Date | undefined
|
||||
setDate: (date: Date | undefined) => void
|
||||
date: Date | undefined;
|
||||
setDate: (date: Date | undefined) => void;
|
||||
}
|
||||
|
||||
export function DatePicker({ date, setDate }: DatePickerProps) {
|
||||
const [month, setMonth] = React.useState<number>(date ? date.getMonth() : new Date().getMonth())
|
||||
const [year, setYear] = React.useState<number>(date ? date.getFullYear() : new Date().getFullYear())
|
||||
const [month, setMonth] = React.useState<number>(
|
||||
date ? date.getMonth() : new Date().getMonth(),
|
||||
);
|
||||
const [year, setYear] = React.useState<number>(
|
||||
date ? date.getFullYear() : new Date().getFullYear(),
|
||||
);
|
||||
|
||||
const years = React.useMemo(() => {
|
||||
const currentYear = new Date().getFullYear()
|
||||
return Array.from({ length: currentYear - 1900 + 1 }, (_, i) => currentYear - i)
|
||||
}, [])
|
||||
const years = React.useMemo(() => {
|
||||
const currentYear = new Date().getFullYear();
|
||||
return Array.from(
|
||||
{ length: currentYear - 1900 + 1 },
|
||||
(_, i) => currentYear - i,
|
||||
);
|
||||
}, []);
|
||||
|
||||
const months = React.useMemo(() => {
|
||||
if (year) {
|
||||
return eachMonthOfInterval({
|
||||
start: startOfYear(new Date(year, 0, 1)),
|
||||
end: endOfYear(new Date(year, 0, 1))
|
||||
})
|
||||
}
|
||||
return []
|
||||
}, [year])
|
||||
const months = React.useMemo(() => {
|
||||
if (year) {
|
||||
return eachMonthOfInterval({
|
||||
start: startOfYear(new Date(year, 0, 1)),
|
||||
end: endOfYear(new Date(year, 0, 1)),
|
||||
});
|
||||
}
|
||||
return [];
|
||||
}, [year]);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (date) {
|
||||
setMonth(date.getMonth())
|
||||
setYear(date.getFullYear())
|
||||
}
|
||||
}, [date])
|
||||
React.useEffect(() => {
|
||||
if (date) {
|
||||
setMonth(date.getMonth());
|
||||
setYear(date.getFullYear());
|
||||
}
|
||||
}, [date]);
|
||||
|
||||
const handleYearChange = (selectedYear: string) => {
|
||||
const newYear = Number.parseInt(selectedYear, 10)
|
||||
setYear(newYear)
|
||||
if (date) {
|
||||
const newDate = new Date(date)
|
||||
newDate.setFullYear(newYear)
|
||||
setDate(newDate)
|
||||
}
|
||||
}
|
||||
const handleYearChange = (selectedYear: string) => {
|
||||
const newYear = Number.parseInt(selectedYear, 10);
|
||||
setYear(newYear);
|
||||
if (date) {
|
||||
const newDate = new Date(date);
|
||||
newDate.setFullYear(newYear);
|
||||
setDate(newDate);
|
||||
}
|
||||
};
|
||||
|
||||
const handleMonthChange = (selectedMonth: string) => {
|
||||
const newMonth = Number.parseInt(selectedMonth, 10)
|
||||
setMonth(newMonth)
|
||||
if (date) {
|
||||
const newDate = new Date(date)
|
||||
newDate.setMonth(newMonth)
|
||||
setDate(newDate)
|
||||
} else {
|
||||
setDate(new Date(year, newMonth, 1))
|
||||
}
|
||||
}
|
||||
const handleMonthChange = (selectedMonth: string) => {
|
||||
const newMonth = Number.parseInt(selectedMonth, 10);
|
||||
setMonth(newMonth);
|
||||
if (date) {
|
||||
const newDate = new Date(date);
|
||||
newDate.setMonth(newMonth);
|
||||
setDate(newDate);
|
||||
} else {
|
||||
setDate(new Date(year, newMonth, 1));
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Popover>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant={"outline"}
|
||||
className={cn(
|
||||
"w-full justify-start text-left font-normal",
|
||||
!date && "text-muted-foreground"
|
||||
)}
|
||||
>
|
||||
<CalendarIcon className="mr-2 h-4 w-4" />
|
||||
{date ? format(date, "PPP") : <span>Pick a date</span>}
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="w-auto p-0" align="start">
|
||||
<div className="flex justify-between p-2 space-x-1">
|
||||
<Select onValueChange={handleYearChange} value={year.toString()}>
|
||||
<SelectTrigger className="w-[120px]">
|
||||
<SelectValue placeholder="Year" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{years.map((y) => (
|
||||
<SelectItem key={y} value={y.toString()}>
|
||||
{y}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<Select onValueChange={handleMonthChange} value={month.toString()}>
|
||||
<SelectTrigger className="w-[120px]">
|
||||
<SelectValue placeholder="Month" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{months.map((m, index) => (
|
||||
<SelectItem key={`${index + 1}`} value={index.toString()}>
|
||||
{format(m, "MMMM")}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<Calendar
|
||||
mode="single"
|
||||
selected={date}
|
||||
onSelect={setDate}
|
||||
month={new Date(year, month)}
|
||||
onMonthChange={(newMonth) => {
|
||||
setMonth(newMonth.getMonth())
|
||||
setYear(newMonth.getFullYear())
|
||||
}}
|
||||
initialFocus
|
||||
/>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
)
|
||||
return (
|
||||
<Popover>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant={"outline"}
|
||||
className={cn(
|
||||
"w-full justify-start text-left font-normal",
|
||||
!date && "text-muted-foreground",
|
||||
)}
|
||||
>
|
||||
<CalendarIcon className="mr-2 h-4 w-4" />
|
||||
{date ? format(date, "PPP") : <span>Pick a date</span>}
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="w-auto p-0" align="start">
|
||||
<div className="flex justify-between p-2 space-x-1">
|
||||
<Select onValueChange={handleYearChange} value={year.toString()}>
|
||||
<SelectTrigger className="w-[120px]">
|
||||
<SelectValue placeholder="Year" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{years.map((y) => (
|
||||
<SelectItem key={y} value={y.toString()}>
|
||||
{y}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<Select onValueChange={handleMonthChange} value={month.toString()}>
|
||||
<SelectTrigger className="w-[120px]">
|
||||
<SelectValue placeholder="Month" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{months.map((m, index) => (
|
||||
<SelectItem key={`${index + 1}`} value={index.toString()}>
|
||||
{format(m, "MMMM")}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<Calendar
|
||||
mode="single"
|
||||
selected={date}
|
||||
onSelect={setDate}
|
||||
month={new Date(year, month)}
|
||||
onMonthChange={(newMonth) => {
|
||||
setMonth(newMonth.getMonth());
|
||||
setYear(newMonth.getFullYear());
|
||||
}}
|
||||
initialFocus
|
||||
/>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user