-
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
-
76
-
77
-
78
-
79
-
80
-
81
-
82
-
83
-
84
-
85
-
86
-
87
-
88
-
89
-
90
-
91
-
92
-
93
-
94
-
95
-
96
-
97
-
98
-
99
-
100
-
101
-
102
-
103
-
104
-
105
-
106
-
107
-
108
-
109
-
110
// SPDX-FileCopyrightText: 2025 Shota FUJI <pockawoooh@gmail.com>
// SPDX-License-Identifier: AGPL-3.0-only
import { type MessageInitShape } from "@bufbuild/protobuf";
import { createClient } from "@connectrpc/connect";
import { AlertDialog, Button, Flex } from "@radix-ui/themes";
import { useMutation } from "@tanstack/react-query";
import { type CustomAttributeDefinitionIDSchema } from "@yamori/proto/yamori/workspace/v2/custom_attribute_definition_id_pb.js";
import { type DeleteCustomAttributeDefinitionRequestSchema } from "@yamori/proto/yamori/workspace/v2/delete_custom_attribute_definition_request_pb.js";
import { WorkspaceService } from "@yamori/proto/yamori/workspace/v2/workspace_service_pb.js";
import { type FC } from "react";
import { useConnectTransport } from "../../contexts/ConnectTransport.tsx";
import { useToast } from "../../contexts/Toast.tsx";
import { IllegalMessageError } from "../../errors/IllegalMessageError.ts";
export const Root = AlertDialog.Root;
export const Trigger = AlertDialog.Trigger;
export interface ContentProps {
id: MessageInitShape<typeof CustomAttributeDefinitionIDSchema>;
onDeleteStart?(): void;
onDeleted?(): void;
onDeleteError?(): void;
}
export const Content: FC<ContentProps> = ({
id,
onDeleted,
onDeleteError,
onDeleteStart,
}) => {
const toast = useToast();
const transport = useConnectTransport();
const client = createClient(WorkspaceService, transport);
const deletion = useMutation({
async mutationFn(
req: MessageInitShape<typeof DeleteCustomAttributeDefinitionRequestSchema>,
) {
const resp = await client.deleteCustomAttributeDefinition(req);
if (resp.result.case === "ok") {
return resp.result.value;
}
if (typeof resp.result.case === "string") {
throw resp.result.value;
}
throw new IllegalMessageError(resp);
},
onSuccess(def) {
toast.open({
severity: "success",
title: `カスタムフィールド定義「${def.displayName}」を削除しました`,
dismissible: true,
type: "background",
});
onDeleted?.();
},
onError(error: unknown) {
// TODO: エラーをユーザに表示する (共通のエラー文字列化処理)
console.error(error);
toast.open({
severity: "danger",
title: `カスタムフィールド定義の削除に失敗しました`,
dismissible: true,
type: "foreground",
});
onDeleteError?.();
},
});
return (
<AlertDialog.Content maxWidth="30em">
<AlertDialog.Title>削除確認</AlertDialog.Title>
<AlertDialog.Description size="2">
カスタムフィールドの定義を削除します。
ユーザに入力されているこのカスタムフィールドの値も削除されます。
<br />
この操作は取り消せません。削除しますか?
</AlertDialog.Description>
<Flex gap="3" mt="4" justify="end">
<AlertDialog.Cancel>
<Button variant="soft" color="gray">
キャンセル
</Button>
</AlertDialog.Cancel>
<AlertDialog.Action>
<Button
variant="solid"
color="red"
onClick={() => {
deletion.mutate({ id });
onDeleteStart?.();
}}
>
削除する
</Button>
</AlertDialog.Action>
</Flex>
</AlertDialog.Content>
);
};