1 files changed, 119 insertions, 0 deletions
diff --git a/lib/tech-vendors/possible-items/possible-items-toolbar-actions.tsx b/lib/tech-vendors/possible-items/possible-items-toolbar-actions.tsx
new file mode 100644
index 00000000..707d0513
--- /dev/null
+++ b/lib/tech-vendors/possible-items/possible-items-toolbar-actions.tsx
@@ -0,0 +1,119 @@
+"use client"
+
+import * as React from "react"
+import type { Table } from "@tanstack/react-table"
+import { Plus, Trash2 } from "lucide-react"
+import { toast } from "sonner"
+
+import { Button } from "@/components/ui/button"
+import { Separator } from "@/components/ui/separator"
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog"
+
+import type { TechVendorPossibleItem } from "../validations"
+import { deleteTechVendorPossibleItemsNew } from "../service"
+
+interface PossibleItemsTableToolbarActionsProps {
+  table: Table<TechVendorPossibleItem>
+  vendorId: number
+  onAdd: () => void
+}
+
+export function PossibleItemsTableToolbarActions({
+  table,
+  vendorId,
+  onAdd,
+}: PossibleItemsTableToolbarActionsProps) {
+  const [showDeleteAlert, setShowDeleteAlert] = React.useState(false)
+  const [isDeleting, setIsDeleting] = React.useState(false)
+
+  const selectedRows = table.getFilteredSelectedRowModel().rows
+
+  async function handleDelete() {
+    setIsDeleting(true)
+    try {
+      const ids = selectedRows.map((row) => row.original.id)
+      const { error } = await deleteTechVendorPossibleItemsNew(ids, vendorId)
+      
+      if (error) {
+        throw new Error(error)
+      }
+
+      toast.success(`${ids.length}개의 아이템이 삭제되었습니다`)
+      table.resetRowSelection()
+      setShowDeleteAlert(false)
+    } catch {
+      toast.error("아이템 삭제 중 오류가 발생했습니다")
+    } finally {
+      setIsDeleting(false)
+    }
+  }
+
+  return (
+    <>
+      <div className="flex items-center gap-2">
+        <Button
+          variant="outline"
+          size="sm"
+          onClick={onAdd}
+        >
+          <Plus className="mr-2 h-4 w-4" />
+          아이템 추가
+        </Button>
+
+        {selectedRows.length > 0 && (
+          <>
+            <Separator orientation="vertical" className="mx-2 h-4" />
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={() => setShowDeleteAlert(true)}
+                  disabled={selectedRows.length === 0}
+                >
+                  <Trash2 className="mr-2 h-4 w-4" />
+                  삭제 ({selectedRows.length})
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent>
+                선택된 {selectedRows.length}개 아이템을 삭제합니다
+              </TooltipContent>
+            </Tooltip>
+          </>
+        )}
+      </div>
+
+      <AlertDialog open={showDeleteAlert} onOpenChange={setShowDeleteAlert}>
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>아이템 삭제</AlertDialogTitle>
+            <AlertDialogDescription>
+              선택된 {selectedRows.length}개의 아이템을 삭제하시겠습니까?
+              이 작업은 되돌릴 수 없습니다.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>취소</AlertDialogCancel>
+            <AlertDialogAction 
+              onClick={handleDelete}
+              disabled={isDeleting}
+              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
+            >
+              {isDeleting ? "삭제 중..." : "삭제"}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  )
+} 
+\ No newline at end of file