summaryrefslogtreecommitdiff
path: root/lib/approval-template/table/approval-template-table-toolbar-actions.tsx
blob: 4fa4b394944688931f48e4bf8993e1ad0543a44a (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
74
75
"use client"

import * as React from "react"
import { type Table } from "@tanstack/react-table"
import { Download, Plus, Trash } from "lucide-react"

import { Button } from "@/components/ui/button"
import { type ApprovalTemplate } from "@/lib/approval-template/service"
import { toast } from "sonner"
import { DeleteApprovalTemplateDialog } from "./delete-approval-template-dialog"
import { CategoryManagementDialog } from "./category-management-dialog"

interface ApprovalTemplateTableToolbarActionsProps {
  table: Table<ApprovalTemplate>
  onCreateTemplate: () => void
}

export function ApprovalTemplateTableToolbarActions({
  table,
  onCreateTemplate,
}: ApprovalTemplateTableToolbarActionsProps) {
  const [showDeleteDialog, setShowDeleteDialog] = React.useState(false)
  const [showCategoryDialog, setShowCategoryDialog] = React.useState(false)

  const selectedRows = table.getFilteredSelectedRowModel().rows
  const selectedTemplates = selectedRows.map((row) => row.original)

  return (
    <div className="flex items-center gap-2">
      {/* 카테고리 관리 버튼 */}
      <CategoryManagementDialog
        open={showCategoryDialog}
        onOpenChange={setShowCategoryDialog}
        showTrigger={false}
      />

      {/* 새 템플릿 버튼 */}
      <Button variant="outline" size="sm" onClick={() => setShowCategoryDialog(true)}>
        카테고리 관리
      </Button>

      {/* 새 템플릿 버튼 */}
      <Button variant="default" size="sm" onClick={onCreateTemplate}>
        <Plus className="mr-2 size-4" aria-hidden="true" />
        새 템플릿
      </Button>

      {/* 일괄 삭제 */}
      {selectedTemplates.length > 0 && (
        <>
          <Button
            variant="outline"
            size="sm"
            onClick={() => setShowDeleteDialog(true)}
            className="text-destructive hover:text-destructive"
          >
            <Trash className="mr-2 size-4" aria-hidden="true" />
            삭제 ({selectedTemplates.length})
          </Button>

          <DeleteApprovalTemplateDialog
            open={showDeleteDialog}
            onOpenChange={setShowDeleteDialog}
            templates={selectedTemplates}
            showTrigger={false}
            onSuccess={() => {
              table.toggleAllRowsSelected(false)
              setShowDeleteDialog(false)
            }}
          />
        </>
      )}
    </div>
  )
}