summaryrefslogtreecommitdiff
path: root/lib/items-tech/table/delete-items-dialog.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'lib/items-tech/table/delete-items-dialog.tsx')
-rw-r--r--lib/items-tech/table/delete-items-dialog.tsx388
1 files changed, 194 insertions, 194 deletions
diff --git a/lib/items-tech/table/delete-items-dialog.tsx b/lib/items-tech/table/delete-items-dialog.tsx
index b94a2333..6ec4b4c7 100644
--- a/lib/items-tech/table/delete-items-dialog.tsx
+++ b/lib/items-tech/table/delete-items-dialog.tsx
@@ -1,194 +1,194 @@
-"use client"
-
-import * as React from "react"
-import { type Row } from "@tanstack/react-table"
-import { Loader, Trash } from "lucide-react"
-import { toast } from "sonner"
-
-import { useMediaQuery } from "@/hooks/use-media-query"
-import { Button } from "@/components/ui/button"
-import {
- Dialog,
- DialogClose,
- DialogContent,
- DialogDescription,
- DialogFooter,
- DialogHeader,
- DialogTitle,
- DialogTrigger,
-} from "@/components/ui/dialog"
-import {
- Drawer,
- DrawerClose,
- DrawerContent,
- DrawerDescription,
- DrawerFooter,
- DrawerHeader,
- DrawerTitle,
- DrawerTrigger,
-} from "@/components/ui/drawer"
-
-import { Item } from "@/db/schema/items"
-import {
- removeShipbuildingItems,
- removeOffshoreTopItems,
- removeOffshoreHullItems
-} from "../service"
-
-export type ItemType = 'shipbuilding' | 'offshoreTop' | 'offshoreHull';
-
-interface DeleteItemsDialogProps
- extends React.ComponentPropsWithoutRef<typeof Dialog> {
- items: Row<Item>["original"][]
- showTrigger?: boolean
- onSuccess?: () => void
- itemType: ItemType
-}
-
-export function DeleteItemsDialog({
- items,
- showTrigger = true,
- onSuccess,
- itemType,
- ...props
-}: DeleteItemsDialogProps) {
- const [isDeletePending, startDeleteTransition] = React.useTransition()
- const isDesktop = useMediaQuery("(min-width: 640px)")
-
- const getItemTypeLabel = () => {
- switch (itemType) {
- case 'shipbuilding':
- return '조선 아이템';
- case 'offshoreTop':
- return '해양 TOP 아이템';
- case 'offshoreHull':
- return '해양 HULL 아이템';
- default:
- return '아이템';
- }
- }
-
- async function onDelete() {
- try {
- startDeleteTransition(async () => {
- let result;
-
- switch (itemType) {
- case 'shipbuilding':
- result = await removeShipbuildingItems({
- ids: items.map((item) => item.id),
- });
- break;
- case 'offshoreTop':
- result = await removeOffshoreTopItems({
- ids: items.map((item) => item.id),
- });
- break;
- case 'offshoreHull':
- result = await removeOffshoreHullItems({
- ids: items.map((item) => item.id),
- });
- break;
- default:
- toast.error("지원하지 않는 아이템 타입입니다");
- return;
- }
-
- if (result.error) {
- toast.error(result.error)
- return
- }
-
- props.onOpenChange?.(false)
- toast.success("아이템 삭제 완료")
- onSuccess?.()
- })
- } catch (error) {
- toast.error("오류가 발생했습니다.")
- console.error(error)
- }
- }
-
- if (isDesktop) {
- return (
- <Dialog {...props}>
- {showTrigger ? (
- <DialogTrigger asChild>
- <Button variant="outline" size="sm">
- <Trash className="mr-2 size-4" aria-hidden="true" />
- 삭제 ({items.length})
- </Button>
- </DialogTrigger>
- ) : null}
- <DialogContent>
- <DialogHeader>
- <DialogTitle>정말로 삭제하시겠습니까?</DialogTitle>
- <DialogDescription>
- 이 작업은 되돌릴 수 없습니다. 선택한{" "}
- <span className="font-medium">{items.length}</span>
- 개의 {getItemTypeLabel()}이(가) 영구적으로 삭제됩니다.
- </DialogDescription>
- </DialogHeader>
- <DialogFooter className="gap-2 sm:space-x-0">
- <DialogClose asChild>
- <Button variant="outline">취소</Button>
- </DialogClose>
- <Button
- aria-label="삭제 확인"
- variant="destructive"
- onClick={onDelete}
- disabled={isDeletePending}
- >
- {isDeletePending && (
- <Loader
- className="mr-2 size-4 animate-spin"
- aria-hidden="true"
- />
- )}
- 삭제
- </Button>
- </DialogFooter>
- </DialogContent>
- </Dialog>
- )
- }
-
- return (
- <Drawer {...props}>
- {showTrigger ? (
- <DrawerTrigger asChild>
- <Button variant="outline" size="sm">
- <Trash className="mr-2 size-4" aria-hidden="true" />
- 삭제 ({items.length})
- </Button>
- </DrawerTrigger>
- ) : null}
- <DrawerContent>
- <DrawerHeader>
- <DrawerTitle>정말로 삭제하시겠습니까?</DrawerTitle>
- <DrawerDescription>
- 이 작업은 되돌릴 수 없습니다. 선택한{" "}
- <span className="font-medium">{items.length}</span>
- 개의 {getItemTypeLabel()}이(가) 영구적으로 삭제됩니다.
- </DrawerDescription>
- </DrawerHeader>
- <DrawerFooter className="gap-2 sm:space-x-0">
- <DrawerClose asChild>
- <Button variant="outline">취소</Button>
- </DrawerClose>
- <Button
- aria-label="삭제 확인"
- variant="destructive"
- onClick={onDelete}
- disabled={isDeletePending}
- >
- {isDeletePending && (
- <Loader className="mr-2 size-4 animate-spin" aria-hidden="true" />
- )}
- 삭제
- </Button>
- </DrawerFooter>
- </DrawerContent>
- </Drawer>
- )
-}
+"use client"
+
+import * as React from "react"
+import { type Row } from "@tanstack/react-table"
+import { Loader, Trash } from "lucide-react"
+import { toast } from "sonner"
+
+import { useMediaQuery } from "@/hooks/use-media-query"
+import { Button } from "@/components/ui/button"
+import {
+ Dialog,
+ DialogClose,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog"
+import {
+ Drawer,
+ DrawerClose,
+ DrawerContent,
+ DrawerDescription,
+ DrawerFooter,
+ DrawerHeader,
+ DrawerTitle,
+ DrawerTrigger,
+} from "@/components/ui/drawer"
+
+import { Item } from "@/db/schema/items"
+import {
+ removeShipbuildingItems,
+ removeOffshoreTopItems,
+ removeOffshoreHullItems
+} from "../service"
+
+export type ItemType = 'shipbuilding' | 'offshoreTop' | 'offshoreHull';
+
+interface DeleteItemsDialogProps
+ extends React.ComponentPropsWithoutRef<typeof Dialog> {
+ items: Row<Item>["original"][]
+ showTrigger?: boolean
+ onSuccess?: () => void
+ itemType: ItemType
+}
+
+export function DeleteItemsDialog({
+ items,
+ showTrigger = true,
+ onSuccess,
+ itemType,
+ ...props
+}: DeleteItemsDialogProps) {
+ const [isDeletePending, startDeleteTransition] = React.useTransition()
+ const isDesktop = useMediaQuery("(min-width: 640px)")
+
+ const getItemTypeLabel = () => {
+ switch (itemType) {
+ case 'shipbuilding':
+ return '조선 아이템';
+ case 'offshoreTop':
+ return '해양 TOP 아이템';
+ case 'offshoreHull':
+ return '해양 HULL 아이템';
+ default:
+ return '아이템';
+ }
+ }
+
+ async function onDelete() {
+ try {
+ startDeleteTransition(async () => {
+ let result;
+
+ switch (itemType) {
+ case 'shipbuilding':
+ result = await removeShipbuildingItems({
+ ids: items.map((item) => item.id),
+ });
+ break;
+ case 'offshoreTop':
+ result = await removeOffshoreTopItems({
+ ids: items.map((item) => item.id),
+ });
+ break;
+ case 'offshoreHull':
+ result = await removeOffshoreHullItems({
+ ids: items.map((item) => item.id),
+ });
+ break;
+ default:
+ toast.error("지원하지 않는 아이템 타입입니다");
+ return;
+ }
+
+ if (result.error) {
+ toast.error(result.error)
+ return
+ }
+
+ props.onOpenChange?.(false)
+ toast.success("아이템 삭제 완료")
+ onSuccess?.()
+ })
+ } catch (error) {
+ toast.error("오류가 발생했습니다.")
+ console.error(error)
+ }
+ }
+
+ if (isDesktop) {
+ return (
+ <Dialog {...props}>
+ {showTrigger ? (
+ <DialogTrigger asChild>
+ <Button variant="outline" size="sm">
+ <Trash className="mr-2 size-4" aria-hidden="true" />
+ 삭제 ({items.length})
+ </Button>
+ </DialogTrigger>
+ ) : null}
+ <DialogContent>
+ <DialogHeader>
+ <DialogTitle>정말로 삭제하시겠습니까?</DialogTitle>
+ <DialogDescription>
+ 이 작업은 되돌릴 수 없습니다. 선택한{" "}
+ <span className="font-medium">{items.length}</span>
+ 개의 {getItemTypeLabel()}이(가) 영구적으로 삭제됩니다.
+ </DialogDescription>
+ </DialogHeader>
+ <DialogFooter className="gap-2 sm:space-x-0">
+ <DialogClose asChild>
+ <Button variant="outline">취소</Button>
+ </DialogClose>
+ <Button
+ aria-label="삭제 확인"
+ variant="destructive"
+ onClick={onDelete}
+ disabled={isDeletePending}
+ >
+ {isDeletePending && (
+ <Loader
+ className="mr-2 size-4 animate-spin"
+ aria-hidden="true"
+ />
+ )}
+ 삭제
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ )
+ }
+
+ return (
+ <Drawer {...props}>
+ {showTrigger ? (
+ <DrawerTrigger asChild>
+ <Button variant="outline" size="sm">
+ <Trash className="mr-2 size-4" aria-hidden="true" />
+ 삭제 ({items.length})
+ </Button>
+ </DrawerTrigger>
+ ) : null}
+ <DrawerContent>
+ <DrawerHeader>
+ <DrawerTitle>정말로 삭제하시겠습니까?</DrawerTitle>
+ <DrawerDescription>
+ 이 작업은 되돌릴 수 없습니다. 선택한{" "}
+ <span className="font-medium">{items.length}</span>
+ 개의 {getItemTypeLabel()}이(가) 영구적으로 삭제됩니다.
+ </DrawerDescription>
+ </DrawerHeader>
+ <DrawerFooter className="gap-2 sm:space-x-0">
+ <DrawerClose asChild>
+ <Button variant="outline">취소</Button>
+ </DrawerClose>
+ <Button
+ aria-label="삭제 확인"
+ variant="destructive"
+ onClick={onDelete}
+ disabled={isDeletePending}
+ >
+ {isDeletePending && (
+ <Loader className="mr-2 size-4 animate-spin" aria-hidden="true" />
+ )}
+ 삭제
+ </Button>
+ </DrawerFooter>
+ </DrawerContent>
+ </Drawer>
+ )
+}