filters , order inspections , inventory items , credit notes

2026-04-08 14:38:16 +03:00
parent 90c84a0bda
commit bb02b77be2
33 changed files with 2552 additions and 145 deletions
@@ -0,0 +1,93 @@
+"use client"
+
+import React from "react"
+import type { FieldValues, UseFormReturn } from "react-hook-form"
+import {
+    Sheet,
+    SheetContent,
+    SheetHeader,
+    SheetTitle,
+    SheetFooter,
+} from "@/shared/components/ui/sheet"
+import { Button } from "@/shared/components/ui/button"
+import { Badge } from "@/shared/components/ui/badge"
+import { Rhform } from "@/shared/components/form"
+import { ScrollArea } from "@/shared/components/ui/scroll-area"
+import { Filter, FilterIcon, RotateCcwIcon } from "lucide-react"
+
+type FilterDrawerProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>
+    isOpen: boolean
+    onOpenChange: (open: boolean) => void
+    onSubmit: (values: TFormValues) => void
+    onReset: () => void
+    activeFilterCount: number
+    title?: string
+    children: React.ReactNode
+}
+
+export function FilterDrawer<TFormValues extends FieldValues>({
+    form,
+    isOpen,
+    onOpenChange,
+    onSubmit,
+    onReset,
+    activeFilterCount,
+    title = "Filters",
+    children,
+}: FilterDrawerProps<TFormValues>) {
+    return (
+        <Sheet open={isOpen} onOpenChange={onOpenChange}>
+            <SheetContent side="left" className="flex flex-col sm:max-w-md">
+                <SheetHeader>
+                    <SheetTitle className="text-lg font-bold">
+                        <FilterIcon className="mr-2 inline h-5 w-5" />
+                        {title}</SheetTitle>
+                </SheetHeader>
+                <Rhform form={form} onSubmit={onSubmit} className="flex min-h-0 flex-1 flex-col">
+                    <ScrollArea className="min-h-0 flex-1 px-4">
+                        <div className="space-y-4 pb-4">
+                            {children}
+                        </div>
+                    </ScrollArea>
+                    <SheetFooter className="border-t">
+                        <div className="flex w-full gap-2">
+                            <Button type="button" variant="outline" className="flex-1" onClick={onReset}>
+                                <RotateCcwIcon className="mr-2 h-4 w-4" />
+                                Reset
+                            </Button>
+                            <Button type="submit" className="flex-1">
+                                Apply Filters
+                                {activeFilterCount > 0 && (
+                                    <Badge variant="secondary" className="ml-2 h-5 min-w-5 rounded-full px-1.5 text-xs">
+                                        {activeFilterCount}
+                                    </Badge>
+                                )}
+                            </Button>
+                        </div>
+                    </SheetFooter>
+                </Rhform>
+            </SheetContent>
+        </Sheet>
+    )
+}
+
+export function FilterTrigger({
+    onClick,
+    activeFilterCount,
+}: {
+    onClick: () => void
+    activeFilterCount: number
+}) {
+    return (
+        <Button variant="outline" size="sm" onClick={onClick} className="gap-2">
+            <FilterIcon className="h-4 w-4" />
+            Filters
+            {activeFilterCount > 0 && (
+                <Badge variant="secondary" className="h-5 min-w-5 rounded-full px-1.5 text-xs">
+                    {activeFilterCount}
+                </Badge>
+            )}
+        </Button>
+    )
+}