blob: 5d010ff465af8ca89251330794934f75c545aa3d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
"use client"
import * as React from "react"
import {
Sheet,
SheetContent,
SheetDescription,
SheetHeader,
SheetTitle,
SheetFooter,
} from "@/components/ui/sheet"
import { Button } from "@/components/ui/button"
import { ScrollArea } from "@/components/ui/scroll-area"
import { PossibleItem } from "@/config/vendorInvestigationsColumnsConfig"
interface ItemsDrawerProps {
open: boolean
onOpenChange: (open: boolean) => void
investigationId: number | null
items: PossibleItem[]
}
export function ItemsDrawer({
open,
onOpenChange,
investigationId,
items,
}: ItemsDrawerProps) {
return (
<Sheet open={open} onOpenChange={onOpenChange}>
<SheetContent className="sm:max-w-md">
<SheetHeader>
<SheetTitle>Possible Items</SheetTitle>
<SheetDescription>
{items.length > 0
? `Showing ${items.length} items for investigation #${investigationId}`
: `No items found for investigation #${investigationId}`}
</SheetDescription>
</SheetHeader>
<ScrollArea className="max-h-[70vh] mt-6 pr-4">
{items.length > 0 ? (
<div className="space-y-4">
{items.map((item, index) => (
<div
key={index}
className="flex flex-col gap-2 p-3 rounded-lg border"
>
<div className="flex justify-between items-start">
<h4 className="font-medium">{item.itemName || "Unknown Item"}</h4>
{item.itemName && (
<span className="text-xs bg-muted px-2 py-1 rounded">
{item.itemCode}
</span>
)}
</div>
</div>
))}
</div>
) : (
<div className="text-center py-6 text-muted-foreground">
No items available
</div>
)}
</ScrollArea>
<SheetFooter className="mt-4">
<Button onClick={() => onOpenChange(false)}>Close</Button>
</SheetFooter>
</SheetContent>
</Sheet>
)
}
|
