summaryrefslogtreecommitdiff
path: root/lib/tech-vendors/items-table
diff options
context:
space:
mode:
Diffstat (limited to 'lib/tech-vendors/items-table')
-rw-r--r--lib/tech-vendors/items-table/add-item-dialog.tsx308
-rw-r--r--lib/tech-vendors/items-table/feature-flags-provider.tsx108
-rw-r--r--lib/tech-vendors/items-table/item-table-columns.tsx192
-rw-r--r--lib/tech-vendors/items-table/item-table-toolbar-actions.tsx104
-rw-r--r--lib/tech-vendors/items-table/item-table.tsx83
5 files changed, 0 insertions, 795 deletions
diff --git a/lib/tech-vendors/items-table/add-item-dialog.tsx b/lib/tech-vendors/items-table/add-item-dialog.tsx
deleted file mode 100644
index 21875295..00000000
--- a/lib/tech-vendors/items-table/add-item-dialog.tsx
+++ /dev/null
@@ -1,308 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { useForm } from "react-hook-form"
-import { zodResolver } from "@hookform/resolvers/zod"
-import { Check, ChevronsUpDown } from "lucide-react"
-import { useRouter } from "next/navigation"
-
-import { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "@/components/ui/dialog"
-import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
-import {
- Form,
- FormControl,
- FormField,
- FormItem,
- FormLabel,
-} from "@/components/ui/form"
-import {
- Popover,
- PopoverContent,
- PopoverTrigger,
-} from "@/components/ui/popover"
-import {
- Command,
- CommandEmpty,
- CommandGroup,
- CommandInput,
- CommandItem,
- CommandList,
-} from "@/components/ui/command"
-import { cn } from "@/lib/utils"
-import { toast } from "sonner"
-
-import {
- createTechVendorItemSchema,
- type CreateTechVendorItemSchema,
-} from "@/lib/tech-vendors/validations"
-
-import { createTechVendorItem, getItemsForTechVendor, ItemDropdownOption } from "../service"
-
-interface AddItemDialogProps {
- vendorId: number
- vendorType: string // UI에서 전달하지만 내부적으로는 사용하지 않음
-}
-
-export function AddItemDialog({ vendorId }: AddItemDialogProps) {
- const router = useRouter()
- const [open, setOpen] = React.useState(false)
- const [commandOpen, setCommandOpen] = React.useState(false)
- const [items, setItems] = React.useState<ItemDropdownOption[]>([])
- const [filteredItems, setFilteredItems] = React.useState<ItemDropdownOption[]>([])
- const [isLoading, setIsLoading] = React.useState(false)
- const [searchTerm, setSearchTerm] = React.useState("")
-
- const [selectedItem, setSelectedItem] = React.useState<{
- itemName: string;
- description: string;
- } | null>(null)
-
- const form = useForm<CreateTechVendorItemSchema>({
- resolver: zodResolver(createTechVendorItemSchema),
- defaultValues: {
- vendorId,
- itemCode: "",
- },
- })
-
- const fetchItems = React.useCallback(async () => {
- if (items.length > 0) return
-
- console.log(`[AddItemDialog] fetchItems - 벤더 ID: ${vendorId} 시작`)
-
- setIsLoading(true)
- try {
- console.log(`[AddItemDialog] getItemsForTechVendor 호출 - vendorId: ${vendorId}`)
- const result = await getItemsForTechVendor(vendorId)
- console.log(`[AddItemDialog] getItemsForTechVendor 결과:`, result)
-
- if (result.data) {
- console.log(`[AddItemDialog] 사용 가능한 아이템 목록:`, result.data)
- setItems(result.data as ItemDropdownOption[])
- setFilteredItems(result.data as ItemDropdownOption[])
- } else if (result.error) {
- console.error("[AddItemDialog] 아이템 조회 실패:", result.error)
- toast.error(result.error)
- }
- } catch (err) {
- console.error("[AddItemDialog] 아이템 조회 실패:", err)
- toast.error("아이템 목록을 불러오는데 실패했습니다.")
- } finally {
- setIsLoading(false)
- console.log(`[AddItemDialog] fetchItems 완료`)
- }
- }, [items.length, vendorId])
-
- React.useEffect(() => {
- if (commandOpen) {
- console.log(`[AddItemDialog] Popover 열림 - fetchItems 호출`)
- fetchItems()
- }
- }, [commandOpen, fetchItems])
-
- React.useEffect(() => {
- if (!items.length) return
-
- if (!searchTerm.trim()) {
- setFilteredItems(items)
- return
- }
-
- console.log(`[AddItemDialog] 검색어로 필터링: "${searchTerm}"`)
- const lowerSearch = searchTerm.toLowerCase()
- const filtered = items.filter(item =>
- item.itemCode.toLowerCase().includes(lowerSearch) ||
- item.itemList.toLowerCase().includes(lowerSearch) ||
- (item.subItemList && item.subItemList.toLowerCase().includes(lowerSearch))
- )
-
- console.log(`[AddItemDialog] 필터링 결과: ${filtered.length}개 아이템`)
- setFilteredItems(filtered)
- }, [searchTerm, items])
-
- const handleSelectItem = (item: ItemDropdownOption) => {
- console.log(`[AddItemDialog] 아이템 선택: ${item.itemCode}`)
- form.setValue("itemCode", item.itemCode, { shouldValidate: true })
- setSelectedItem({
- itemName: item.itemList,
- description: item.subItemList || "",
- })
- console.log(`[AddItemDialog] 선택된 아이템 정보:`, {
- itemCode: item.itemCode,
- itemName: item.itemList,
- description: item.subItemList || ""
- })
- setCommandOpen(false)
- }
-
- async function onSubmit(data: CreateTechVendorItemSchema) {
- console.log(`[AddItemDialog] 폼 제출 시작 - 데이터:`, data)
- try {
- if (!data.itemCode) {
- console.error(`[AddItemDialog] itemCode가 없습니다.`)
- toast.error("아이템을 선택해주세요.")
- return
- }
-
- console.log(`[AddItemDialog] createTechVendorItem 호출 - vendorId: ${data.vendorId}, itemCode: ${data.itemCode}`)
- const submitData = {
- ...data,
- itemName: selectedItem?.itemName || "기술영업"
- }
- console.log(`[AddItemDialog] 최종 제출 데이터:`, submitData)
-
- const result = await createTechVendorItem(submitData)
- console.log(`[AddItemDialog] createTechVendorItem 결과:`, result)
-
- if (result.error) {
- console.error(`[AddItemDialog] 추가 실패:`, result.error)
- toast.error(result.error)
- return
- }
-
- console.log(`[AddItemDialog] 아이템 추가 성공`)
- toast.success("아이템이 추가되었습니다.")
- form.reset()
- setSelectedItem(null)
- setOpen(false)
- console.log(`[AddItemDialog] 화면 새로고침 시작`)
- router.refresh()
- console.log(`[AddItemDialog] 화면 새로고침 완료`)
- } catch (err) {
- console.error("[AddItemDialog] 아이템 추가 오류:", err)
- toast.error("아이템 추가 중 오류가 발생했습니다.")
- }
- }
-
- function handleDialogOpenChange(nextOpen: boolean) {
- console.log(`[AddItemDialog] 다이얼로그 상태 변경: ${nextOpen ? '열림' : '닫힘'}`)
- if (!nextOpen) {
- form.reset()
- setSelectedItem(null)
- }
- setOpen(nextOpen)
- }
-
- const selectedItemCode = form.watch("itemCode")
- console.log(`[AddItemDialog] 현재 선택된 itemCode:`, selectedItemCode)
- const displayItemName = selectedItem?.itemName || ""
-
- return (
- <Dialog open={open} onOpenChange={handleDialogOpenChange}>
- <DialogTrigger asChild>
- <Button variant="default" size="sm">
- Add Item
- </Button>
- </DialogTrigger>
-
- <DialogContent className="max-h-[90vh] overflow-hidden flex flex-col">
- <DialogHeader>
- <DialogTitle>Create New Item</DialogTitle>
- <DialogDescription>
- 아이템을 선택한 후 <b>Create</b> 버튼을 누르세요.
- </DialogDescription>
- </DialogHeader>
-
- <Form {...form}>
- <form onSubmit={(e) => {
- console.log(`[AddItemDialog] 폼 제출 이벤트 발생`)
- form.handleSubmit(onSubmit)(e)
- }} className="flex flex-col flex-1 overflow-hidden">
- <div className="space-y-4 py-4 flex-1 overflow-y-auto">
- <div>
- <FormLabel className="text-sm font-medium">아이템 선택</FormLabel>
- <Popover open={commandOpen} onOpenChange={setCommandOpen}>
- <PopoverTrigger asChild>
- <Button
- variant="outline"
- role="combobox"
- aria-expanded={commandOpen}
- className="w-full justify-between mt-1"
- >
- {selectedItemCode
- ? `${selectedItemCode} - ${displayItemName}`
- : "아이템 선택..."}
- <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
- </Button>
- </PopoverTrigger>
- <PopoverContent className="w-[400px] p-0">
- <Command>
- <CommandInput
- placeholder="아이템 코드/이름 검색..."
- onValueChange={setSearchTerm}
- />
- <CommandList className="max-h-[200px]">
- <CommandEmpty>검색 결과가 없습니다</CommandEmpty>
- {isLoading ? (
- <div className="py-6 text-center text-sm">로딩 중...</div>
- ) : (
- <CommandGroup>
- {filteredItems.map((item) => (
- <CommandItem
- key={item.itemCode}
- value={`${item.itemCode} ${item.itemList}`}
- onSelect={() => handleSelectItem(item)}
- >
- <Check
- className={cn(
- "mr-2 h-4 w-4",
- selectedItemCode === item.itemCode
- ? "opacity-100"
- : "opacity-0"
- )}
- />
- <span className="font-medium">{item.itemCode}</span>
- <span className="ml-2 text-gray-500 truncate">- {item.itemList}</span>
- </CommandItem>
- ))}
- </CommandGroup>
- )}
- </CommandList>
- </Command>
- </PopoverContent>
- </Popover>
- </div>
-
- {selectedItem && (
- <div className="rounded-md border p-3 mt-4 overflow-hidden">
- <h3 className="font-medium text-sm mb-2">선택된 아이템 정보</h3>
-
- <FormField
- control={form.control}
- name="itemCode"
- render={({ field }) => (
- <FormItem className="hidden">
- <FormControl>
- <Input {...field} />
- </FormControl>
- </FormItem>
- )}
- />
-
- <div className="mb-2">
- <div className="text-sm font-medium text-gray-500">Item Name</div>
- <div className="text-sm">{selectedItem.itemName}</div>
- </div>
-
- {selectedItem.description && (
- <div>
- <div className="text-sm font-medium text-gray-500">Description</div>
- <div className="text-sm">{selectedItem.description}</div>
- </div>
- )}
- </div>
- )}
- </div>
-
- <DialogFooter className="pt-4 border-t">
- <Button type="submit" disabled={!selectedItemCode}>
- Create
- </Button>
- </DialogFooter>
- </form>
- </Form>
- </DialogContent>
- </Dialog>
- )
-} \ No newline at end of file
diff --git a/lib/tech-vendors/items-table/feature-flags-provider.tsx b/lib/tech-vendors/items-table/feature-flags-provider.tsx
deleted file mode 100644
index 81131894..00000000
--- a/lib/tech-vendors/items-table/feature-flags-provider.tsx
+++ /dev/null
@@ -1,108 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { useQueryState } from "nuqs"
-
-import { dataTableConfig, type DataTableConfig } from "@/config/data-table"
-import { cn } from "@/lib/utils"
-import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"
-import {
- Tooltip,
- TooltipContent,
- TooltipTrigger,
-} from "@/components/ui/tooltip"
-
-type FeatureFlagValue = DataTableConfig["featureFlags"][number]["value"]
-
-interface FeatureFlagsContextProps {
- featureFlags: FeatureFlagValue[]
- setFeatureFlags: (value: FeatureFlagValue[]) => void
-}
-
-const FeatureFlagsContext = React.createContext<FeatureFlagsContextProps>({
- featureFlags: [],
- setFeatureFlags: () => {},
-})
-
-export function useFeatureFlags() {
- const context = React.useContext(FeatureFlagsContext)
- if (!context) {
- throw new Error(
- "useFeatureFlags must be used within a FeatureFlagsProvider"
- )
- }
- return context
-}
-
-interface FeatureFlagsProviderProps {
- children: React.ReactNode
-}
-
-export function FeatureFlagsProvider({ children }: FeatureFlagsProviderProps) {
- const [featureFlags, setFeatureFlags] = useQueryState<FeatureFlagValue[]>(
- "flags",
- {
- defaultValue: [],
- parse: (value) => value.split(",") as FeatureFlagValue[],
- serialize: (value) => value.join(","),
- eq: (a, b) =>
- a.length === b.length && a.every((value, index) => value === b[index]),
- clearOnDefault: true,
- shallow: false,
- }
- )
-
- return (
- <FeatureFlagsContext.Provider
- value={{
- featureFlags,
- setFeatureFlags: (value) => void setFeatureFlags(value),
- }}
- >
- <div className="w-full overflow-x-auto">
- <ToggleGroup
- type="multiple"
- variant="outline"
- size="sm"
- value={featureFlags}
- onValueChange={(value: FeatureFlagValue[]) => setFeatureFlags(value)}
- className="w-fit gap-0"
- >
- {dataTableConfig.featureFlags.map((flag, index) => (
- <Tooltip key={flag.value}>
- <ToggleGroupItem
- value={flag.value}
- className={cn(
- "gap-2 whitespace-nowrap rounded-none px-3 text-xs data-[state=on]:bg-accent/70 data-[state=on]:hover:bg-accent/90",
- {
- "rounded-l-sm border-r-0": index === 0,
- "rounded-r-sm":
- index === dataTableConfig.featureFlags.length - 1,
- }
- )}
- asChild
- >
- <TooltipTrigger>
- <flag.icon className="size-3.5 shrink-0" aria-hidden="true" />
- {flag.label}
- </TooltipTrigger>
- </ToggleGroupItem>
- <TooltipContent
- align="start"
- side="bottom"
- sideOffset={6}
- className="flex max-w-60 flex-col space-y-1.5 border bg-background py-2 font-semibold text-foreground"
- >
- <div>{flag.tooltipTitle}</div>
- <div className="text-xs text-muted-foreground">
- {flag.tooltipDescription}
- </div>
- </TooltipContent>
- </Tooltip>
- ))}
- </ToggleGroup>
- </div>
- {children}
- </FeatureFlagsContext.Provider>
- )
-}
diff --git a/lib/tech-vendors/items-table/item-table-columns.tsx b/lib/tech-vendors/items-table/item-table-columns.tsx
deleted file mode 100644
index 72986849..00000000
--- a/lib/tech-vendors/items-table/item-table-columns.tsx
+++ /dev/null
@@ -1,192 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { type DataTableRowAction } from "@/types/table"
-import { type ColumnDef } from "@tanstack/react-table"
-import { MoreHorizontal } from "lucide-react"
-import { format } from "date-fns"
-import { ko } from "date-fns/locale"
-
-import { Badge } from "@/components/ui/badge"
-import { Button } from "@/components/ui/button"
-import { Checkbox } from "@/components/ui/checkbox"
-import {
- DropdownMenu,
- DropdownMenuContent,
- DropdownMenuItem,
- DropdownMenuLabel,
- DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu"
-
-import { TechVendorItemsView } from "@/db/schema/techVendors"
-import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
-import {
- techVendorItemsColumnsConfig,
- shipbuildingColumnsConfig,
- offshoreTopColumnsConfig,
- offshoreHullColumnsConfig
-} from "@/config/techVendorItemsColumnsConfig"
-
-interface ColumnConfig {
- id: string
- label: string
- excelHeader: string
- type: string
- minWidth: number
- defaultWidth: number
- group?: string
-}
-
-interface GetColumnsOptions {
- setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<TechVendorItemsView> | null>>
- vendorType: string
-}
-
-export function getColumns({ setRowAction, vendorType }: GetColumnsOptions): ColumnDef<TechVendorItemsView>[] {
- // 벤더 타입에 따라 적절한 컬럼 설정 선택
- const columnsConfig = (() => {
- switch (vendorType) {
- case "조선":
- return shipbuildingColumnsConfig;
- case "해양TOP":
- return offshoreTopColumnsConfig;
- case "해양HULL":
- return offshoreHullColumnsConfig;
- default:
- return techVendorItemsColumnsConfig;
- }
- })();
-
- // ----------------------------------------------------------------
- // 1) select 컬럼 (체크박스)
- // ----------------------------------------------------------------
- const selectColumn: ColumnDef<TechVendorItemsView> = {
- id: "select",
- header: ({ table }) => (
- <Checkbox
- checked={
- table.getIsAllPageRowsSelected() ||
- (table.getIsSomePageRowsSelected() && "indeterminate")
- }
- onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
- aria-label="Select all"
- className="translate-y-[2px]"
- />
- ),
- cell: ({ row }) => (
- <Checkbox
- checked={row.getIsSelected()}
- onCheckedChange={(value) => row.toggleSelected(!!value)}
- aria-label="Select row"
- className="translate-y-[2px]"
- />
- ),
- enableSorting: false,
- enableHiding: false,
- }
-
- // ----------------------------------------------------------------
- // 2) actions 컬럼 (Dropdown 메뉴)
- // ----------------------------------------------------------------
- // const actionsColumn: ColumnDef<TechVendorItemsView> = {
- // id: "actions",
- // cell: ({ row }) => {
- // return (
- // <DropdownMenu>
- // <DropdownMenuTrigger asChild>
- // <Button variant="ghost" className="h-8 w-8 p-0">
- // <span className="sr-only">Open menu</span>
- // <MoreHorizontal className="h-4 w-4" />
- // </Button>
- // </DropdownMenuTrigger>
- // <DropdownMenuContent align="end">
- // <DropdownMenuLabel>Actions</DropdownMenuLabel>
- // <DropdownMenuItem onClick={() =>
- // setRowAction({
- // type: "update",
- // row,
- // })
- // }>
- // View Details
- // </DropdownMenuItem>
- // </DropdownMenuContent>
- // </DropdownMenu>
- // )
- // },
- // }
-
- // ----------------------------------------------------------------
- // 3) 일반 컬럼들을 "그룹"별로 묶어 중첩 columns 생성
- // ----------------------------------------------------------------
- const groupMap: Record<string, ColumnDef<TechVendorItemsView>[]> = {}
-
- columnsConfig.forEach((cfg: ColumnConfig) => {
- // 만약 group가 없으면 "_noGroup" 처리
- const groupName = cfg.group || "_noGroup"
-
- if (!groupMap[groupName]) {
- groupMap[groupName] = []
- }
-
- // child column 정의
- const childCol: ColumnDef<TechVendorItemsView> = {
- accessorKey: cfg.id,
- enableResizing: true,
- header: ({ column }) => (
- <DataTableColumnHeaderSimple column={column} title={cfg.label} />
- ),
- minSize: cfg.minWidth,
- size: cfg.defaultWidth,
- meta: {
- excelHeader: cfg.excelHeader,
- group: cfg.group,
- type: cfg.type,
- },
- cell: ({ row, cell }) => {
- if (cfg.id === "createdAt" || cfg.id === "updatedAt") {
- const dateVal = cell.getValue() as Date
- return format(dateVal, "PPP", { locale: ko })
- }
-
- if (cfg.id === "techVendorType") {
- const type = cell.getValue() as string
- return type ? (
- <Badge variant="outline" className="capitalize">
- {type}
- </Badge>
- ) : null
- }
-
- return row.getValue(cfg.id) ?? ""
- },
- }
-
- groupMap[groupName].push(childCol)
- })
-
- // ----------------------------------------------------------------
- // 3-2) groupMap에서 실제 상위 컬럼(그룹)을 만들기
- // ----------------------------------------------------------------
- const nestedColumns: ColumnDef<TechVendorItemsView>[] = []
-
- Object.entries(groupMap).forEach(([groupName, colDefs]) => {
- if (groupName === "_noGroup") {
- nestedColumns.push(...colDefs)
- } else {
- nestedColumns.push({
- id: groupName,
- header: groupName,
- columns: colDefs,
- })
- }
- })
-
- // ----------------------------------------------------------------
- // 4) 최종 컬럼 배열: select, nestedColumns, actions
- // ----------------------------------------------------------------
- return [
- selectColumn,
- ...nestedColumns,
- // actionsColumn,
- ]
-} \ No newline at end of file
diff --git a/lib/tech-vendors/items-table/item-table-toolbar-actions.tsx b/lib/tech-vendors/items-table/item-table-toolbar-actions.tsx
deleted file mode 100644
index b327ff56..00000000
--- a/lib/tech-vendors/items-table/item-table-toolbar-actions.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { type Table } from "@tanstack/react-table"
-import { Download, Upload } from "lucide-react"
-import { toast } from "sonner"
-
-import { exportTableToExcel } from "@/lib/export"
-import { Button } from "@/components/ui/button"
-import { TechVendorItemsView } from "@/db/schema/techVendors"
-import { AddItemDialog } from "./add-item-dialog"
-import { importTasksExcel } from "@/lib/tasks/service"
-
-interface TechVendorItemsTableToolbarActionsProps {
- table: Table<TechVendorItemsView>
- vendorId: number
- vendorType: string
-}
-
-export function TechVendorItemsTableToolbarActions({ table, vendorId, vendorType }: TechVendorItemsTableToolbarActionsProps) {
- // 파일 input을 숨기고, 버튼 클릭 시 참조해 클릭하는 방식
- const fileInputRef = React.useRef<HTMLInputElement>(null)
-
- // 파일이 선택되었을 때 처리
- async function onFileChange(event: React.ChangeEvent<HTMLInputElement>) {
- const file = event.target.files?.[0]
- if (!file) return
-
- // 파일 초기화 (동일 파일 재업로드 시에도 onChange가 트리거되도록)
- event.target.value = ""
-
- // 서버 액션 or API 호출
- try {
- // 예: 서버 액션 호출
- const { errorFile, errorMessage } = await importTasksExcel(file)
-
- if (errorMessage) {
- toast.error(errorMessage)
- }
- if (errorFile) {
- // 에러 엑셀을 다운로드
- const url = URL.createObjectURL(errorFile)
- const link = document.createElement("a")
- link.href = url
- link.download = "errors.xlsx"
- link.click()
- URL.revokeObjectURL(url)
- } else {
- // 성공
- toast.success("Import success")
- // 필요 시 revalidateTag("tasks") 등
- }
-
- } catch (err) {
- console.error("파일 업로드 중 오류가 발생했습니다:", err)
- toast.error("파일 업로드 중 오류가 발생했습니다.")
- }
- }
-
- function handleImportClick() {
- // 숨겨진 <input type="file" /> 요소를 클릭
- fileInputRef.current?.click()
- }
-
- return (
- <div className="flex items-center gap-2">
-
- {/* <AddItemDialog vendorId={vendorId} vendorType={vendorType} /> */}
-
- {/** 3) Import 버튼 (파일 업로드) */}
- <Button variant="outline" size="sm" className="gap-2" onClick={handleImportClick}>
- <Upload className="size-4" aria-hidden="true" />
- <span className="hidden sm:inline">Import</span>
- </Button>
- {/*
- 실제로는 숨겨진 input과 연결:
- - accept=".xlsx,.xls" 등으로 Excel 파일만 업로드 허용
- */}
- <input
- ref={fileInputRef}
- type="file"
- accept=".xlsx,.xls"
- className="hidden"
- onChange={onFileChange}
- />
-
- {/** 4) Export 버튼 */}
- <Button
- variant="outline"
- size="sm"
- onClick={() =>
- exportTableToExcel(table, {
- filename: "tech-vendor-items",
- excludeColumns: ["select", "actions"],
- })
- }
- className="gap-2"
- >
- <Download className="size-4" aria-hidden="true" />
- <span className="hidden sm:inline">Export</span>
- </Button>
- </div>
- )
-} \ No newline at end of file
diff --git a/lib/tech-vendors/items-table/item-table.tsx b/lib/tech-vendors/items-table/item-table.tsx
deleted file mode 100644
index 2eecd829..00000000
--- a/lib/tech-vendors/items-table/item-table.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-"use client"
-
-import * as React from "react"
-import type {
- DataTableAdvancedFilterField,
- DataTableFilterField,
- DataTableRowAction,
-} from "@/types/table"
-
-import { useDataTable } from "@/hooks/use-data-table"
-import { DataTable } from "@/components/data-table/data-table"
-import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar"
-import { getColumns } from "./item-table-columns"
-import { getVendorItemsByType } from "@/lib/tech-vendors/service"
-import { TechVendorItemsTableToolbarActions } from "./item-table-toolbar-actions"
-
-interface TechVendorItemsTableProps {
- promises: Promise<Awaited<ReturnType<typeof getVendorItemsByType>>>
- vendorId: number
- vendorType: string
-}
-
-export function TechVendorItemsTable({ promises, vendorId, vendorType }: TechVendorItemsTableProps) {
- // Suspense로 받아온 데이터
- const { data } = React.use(promises)
-
- const [rowAction, setRowAction] = React.useState<DataTableRowAction<any> | null>(null)
-
- const columns = React.useMemo(
- () => getColumns({
- setRowAction,
- vendorType
- }),
- [vendorType]
- )
-
- const filterFields: DataTableFilterField<any>[] = []
-
- const advancedFilterFields: DataTableAdvancedFilterField<any>[] = [
- { id: "itemList", label: "Item List", type: "text" },
- { id: "itemCode", label: "Item Code", type: "text" },
- { id: "workType", label: "Work Type", type: "text" },
- { id: "subItemList", label: "Sub Item List", type: "text" },
- { id: "createdAt", label: "Created at", type: "date" },
- { id: "updatedAt", label: "Updated at", type: "date" },
- ]
-
- const { table } = useDataTable({
- data,
- columns,
- pageCount: 1,
- filterFields,
- enablePinning: true,
- enableAdvancedFilter: true,
- initialState: {
- sorting: [{ id: "createdAt", desc: true }],
- columnPinning: { right: ["actions"] },
- },
- getRowId: (originalRow) => String(originalRow.itemCode),
- shallow: false,
- clearOnDefault: true,
- })
-
- return (
- <>
- <DataTable
- table={table}
- >
- <DataTableAdvancedToolbar
- table={table}
- filterFields={advancedFilterFields}
- shallow={false}
- >
- <TechVendorItemsTableToolbarActions
- table={table}
- vendorId={vendorId}
- vendorType={vendorType}
- />
- </DataTableAdvancedToolbar>
- </DataTable>
- </>
- )
-} \ No newline at end of file