86 lines
2.3 KiB
TypeScript
86 lines
2.3 KiB
TypeScript
"use client"
|
|
|
|
import { useEffect, useState } from "react"
|
|
import { Button } from "@/components/ui/button"
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from "@/components/ui/dialog"
|
|
import { Input } from "@/components/ui/input"
|
|
import { Label } from "@/components/ui/label"
|
|
import {
|
|
DRIVE_BTN_GHOST,
|
|
DRIVE_BTN_PRIMARY,
|
|
DRIVE_DIALOG_BODY,
|
|
DRIVE_DIALOG_CONTENT,
|
|
DRIVE_DIALOG_FOOTER,
|
|
DRIVE_DIALOG_HEADER,
|
|
DRIVE_FIELD_CLASS,
|
|
DRIVE_LABEL_CLASS,
|
|
DRIVE_TEXT_TITLE,
|
|
} from "@/lib/drive/drive-dialog-styles"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export function DocsListStartDialog({
|
|
open,
|
|
onOpenChange,
|
|
initialStart,
|
|
onApply,
|
|
}: {
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
initialStart: number
|
|
onApply: (start: number) => void
|
|
}) {
|
|
const [start, setStart] = useState(String(initialStart))
|
|
|
|
useEffect(() => {
|
|
if (open) setStart(String(initialStart))
|
|
}, [initialStart, open])
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className={cn(DRIVE_DIALOG_CONTENT, "max-w-sm gap-0 p-0")}>
|
|
<DialogHeader className={DRIVE_DIALOG_HEADER}>
|
|
<DialogTitle className={cn("text-base font-medium", DRIVE_TEXT_TITLE)}>
|
|
Numéro de départ
|
|
</DialogTitle>
|
|
</DialogHeader>
|
|
<div className={DRIVE_DIALOG_BODY}>
|
|
<Label className={DRIVE_LABEL_CLASS} htmlFor="docs-list-start">
|
|
Commencer la liste à
|
|
</Label>
|
|
<Input
|
|
id="docs-list-start"
|
|
type="number"
|
|
min={1}
|
|
max={9999}
|
|
step={1}
|
|
value={start}
|
|
onChange={(event) => setStart(event.target.value)}
|
|
className={cn(DRIVE_FIELD_CLASS, "mt-2")}
|
|
/>
|
|
</div>
|
|
<DialogFooter className={DRIVE_DIALOG_FOOTER}>
|
|
<Button type="button" variant="ghost" className={DRIVE_BTN_GHOST} onClick={() => onOpenChange(false)}>
|
|
Annuler
|
|
</Button>
|
|
<Button
|
|
type="button"
|
|
className={DRIVE_BTN_PRIMARY}
|
|
onClick={() => {
|
|
onApply(Math.max(1, Number.parseInt(start, 10) || 1))
|
|
onOpenChange(false)
|
|
}}
|
|
>
|
|
Appliquer
|
|
</Button>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|