Tristan Yang
48 lines
1.6 KiB
TypeScript
48 lines
1.6 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { toast } from 'react-hot-toast';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { useLazyDeleteBotAPIKeyQuery } from '../../../app/services/user';
|
|
import Modal from '../../../common/component/Modal';
|
|
import Button from '../../../common/component/styled/Button';
|
|
import StyledModal from '../../../common/component/styled/Modal';
|
|
|
|
type Props = {
|
|
uid: number,
|
|
kid: number,
|
|
closeModal: () => void
|
|
}
|
|
const DeleteAPIKeyModal = ({ closeModal, uid, kid }: Props) => {
|
|
const [deleteKey, { isSuccess, isLoading }] = useLazyDeleteBotAPIKeyQuery();
|
|
const { t } = useTranslation("setting", { keyPrefix: "bot" });
|
|
const { t: ct } = useTranslation();
|
|
// const [input, setInput] = useState("");
|
|
const handleDeleteBot = () => {
|
|
deleteKey({ uid, kid });
|
|
};
|
|
useEffect(() => {
|
|
if (isSuccess) {
|
|
toast.success("Delete API Key Successfully!");
|
|
closeModal();
|
|
}
|
|
}, [isSuccess]);
|
|
|
|
return (
|
|
<Modal id="modal-modal">
|
|
<StyledModal
|
|
title={`${t("delete_key_title")} ${name}`}
|
|
description={t("delete_key_desc")}
|
|
buttons={
|
|
<>
|
|
<Button className="cancel" onClick={closeModal}>
|
|
{ct("action.cancel")}
|
|
</Button>
|
|
<Button className='danger' onClick={handleDeleteBot}>{isLoading ? "Deleting" : ct("action.done")}</Button>
|
|
</>
|
|
}
|
|
>
|
|
</StyledModal>
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default DeleteAPIKeyModal; |