-
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
-
111
-
112
-
113
-
114
-
115
-
116
-
117
-
118
-
119
-
120
-
121
-
122
-
123
-
124
-
125
-
126
-
127
// SPDX-FileCopyrightText: 2024 Shota FUJI <pockawoooh@gmail.com>
// SPDX-License-Identifier: AGPL-3.0-only
import * as proto from "@bufbuild/protobuf";
import { Button, type ButtonProps, DropdownMenu } from "@radix-ui/themes";
import { LeaveSchema } from "@yamori/proto/yamori/work_record/v1/leave_pb.js";
import { GetRequestSchema } from "@yamori/proto/yamori/workspace/v1/get_request_pb.js";
import { GetResponseSchema } from "@yamori/proto/yamori/workspace/v1/get_response_pb.js";
import { WorkspaceSchema } from "@yamori/proto/yamori/workspace/v1/workspace_pb.js";
import { type FC } from "react";
import { useMethodQuery } from "../../../contexts/Service.tsx";
import { IllegalMessageError } from "../../../errors/IllegalMessageError.ts";
import { type Actions } from "./useActions.ts";
export interface MenuProps
extends Pick<ButtonProps, "size" | "variant" | "color" | "className" | "style"> {
actions: Actions;
workspaceID: proto.MessageShape<typeof WorkspaceSchema>["id"];
disabled?: boolean;
}
export const Menu: FC<MenuProps> = ({ actions, workspaceID, disabled, ...rest }) => {
const leaveDefinitions = useMethodQuery({
service: "yamori.workspace.v1.WorkspaceService",
method: "Get",
request: {
schema: GetRequestSchema,
data: {
workspaceId: workspaceID,
readMask: {
fields: [WorkspaceSchema.field.leaveDefinitions.number],
leaveDefinitionsMask: {
fields: [
LeaveSchema.field.id.number,
LeaveSchema.field.revisions.number,
LeaveSchema.field.displayName.number,
],
},
},
},
},
response: {
schema: GetResponseSchema,
},
mapResponse(resp) {
switch (resp.result.case) {
case "ok":
return resp.result.value.leaveDefinitions;
case undefined:
throw new IllegalMessageError(resp);
default:
throw resp.result.value;
}
},
});
return (
<DropdownMenu.Root>
<DropdownMenu.Trigger>
<Button {...rest} loading={actions.isPending}>
操作
<DropdownMenu.TriggerIcon />
</Button>
</DropdownMenu.Trigger>
<DropdownMenu.Content>
<DropdownMenu.Label>記録書き込み</DropdownMenu.Label>
<DropdownMenu.Item
disabled={disabled}
shortcut="1"
onSelect={() => void actions.markAsWorked()}
>
出勤
</DropdownMenu.Item>
<DropdownMenu.Item
disabled={disabled}
shortcut="2"
onSelect={() => void actions.markAsDayOff()}
>
休日
</DropdownMenu.Item>
<DropdownMenu.Item
disabled={disabled}
shortcut="3"
onSelect={() => void actions.markAsAbsent()}
>
欠勤
</DropdownMenu.Item>
<DropdownMenu.Item
disabled={disabled}
shortcut="4"
onSelect={() => void actions.markAsPaidLeave()}
>
年次有給休暇
</DropdownMenu.Item>
<DropdownMenu.Sub>
<DropdownMenu.SubTrigger>その他休暇休業</DropdownMenu.SubTrigger>
<DropdownMenu.SubContent>
{leaveDefinitions.data ? (
leaveDefinitions.data.map((def) => {
if (!def.id) {
return null;
}
return (
<DropdownMenu.Item
key={def.id?.value}
disabled={disabled}
onSelect={() => void actions.markAsWorkspaceDefinedLeave(def)}
>
{def.displayName}
</DropdownMenu.Item>
);
})
) : leaveDefinitions.isError ? (
<DropdownMenu.Item disabled>取得できませんでした</DropdownMenu.Item>
) : (
<DropdownMenu.Item disabled>取得中...</DropdownMenu.Item>
)}
</DropdownMenu.SubContent>
</DropdownMenu.Sub>
</DropdownMenu.Content>
</DropdownMenu.Root>
);
};