68 lines
2.1 KiB
TypeScript
Executable File
68 lines
2.1 KiB
TypeScript
Executable File
import { useTranslation } from "react-i18next";
|
|
import { DialogContent, List, ListItemButton, ListItemText } from "@mui/material";
|
|
import { useAppDispatch, useAppSelector } from "../../redux/hooks.ts";
|
|
import React, { useCallback } from "react";
|
|
import DraggableDialog from "./DraggableDialog.tsx";
|
|
import { selectOptionDialogPromisePool } from "../../redux/thunks/dialog.ts";
|
|
import { closeSelectOptionDialog } from "../../redux/globalStateSlice.ts";
|
|
|
|
const SelectOption = () => {
|
|
const { t } = useTranslation();
|
|
const dispatch = useAppDispatch();
|
|
|
|
const open = useAppSelector((state) => state.globalState.selectOptionDialogOpen);
|
|
const title = useAppSelector((state) => state.globalState.selectOptionTitle);
|
|
const promiseId = useAppSelector((state) => state.globalState.selectOptionPromiseId);
|
|
const options = useAppSelector((state) => state.globalState.selectOptionDialogOptions);
|
|
|
|
const onClose = useCallback(() => {
|
|
dispatch(closeSelectOptionDialog());
|
|
if (promiseId) {
|
|
selectOptionDialogPromisePool[promiseId]?.reject("cancel");
|
|
}
|
|
}, [dispatch, promiseId]);
|
|
|
|
const onAccept = useCallback(
|
|
(v: any) => {
|
|
dispatch(closeSelectOptionDialog());
|
|
if (promiseId) {
|
|
selectOptionDialogPromisePool[promiseId]?.resolve(v);
|
|
}
|
|
},
|
|
[promiseId],
|
|
);
|
|
|
|
return (
|
|
<DraggableDialog
|
|
title={t(title ?? "")}
|
|
dialogProps={{
|
|
open: open ?? false,
|
|
onClose: onClose,
|
|
maxWidth: "sm",
|
|
}}
|
|
>
|
|
<DialogContent>
|
|
<List component="nav">
|
|
{options?.map((o) => (
|
|
<ListItemButton key={o.value} onClick={() => onAccept(o.value)}>
|
|
<ListItemText
|
|
primary={o.name}
|
|
secondary={o.description}
|
|
slotProps={{
|
|
primary: {
|
|
variant: "body2",
|
|
fontWeight: "bold",
|
|
},
|
|
|
|
secondary: { variant: "body2" },
|
|
}}
|
|
/>
|
|
</ListItemButton>
|
|
))}
|
|
</List>
|
|
</DialogContent>
|
|
</DraggableDialog>
|
|
);
|
|
};
|
|
export default SelectOption;
|