forked from github/plane
20e7dc68e6
* style: update modals typography, alignment * style: made the modal separator full width * style: delete modals consistency * style: update the remaining delete modals * chore: delete modal secondary button text * style: update the remaining create modals * chore: update cancel button text * chore: created modal core * style: modals responsiveness
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
import React, { useState } from "react";
|
|
import { observer } from "mobx-react";
|
|
// types
|
|
import type { TIssue } from "@plane/types";
|
|
// components
|
|
import { AlertModalCore } from "@/components/core";
|
|
// hooks
|
|
import { useProject } from "@/hooks/store";
|
|
|
|
type Props = {
|
|
data: Partial<TIssue>;
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
onSubmit: () => Promise<void>;
|
|
};
|
|
|
|
export const DeleteInboxIssueModal: React.FC<Props> = observer(({ isOpen, onClose, onSubmit, data }) => {
|
|
// states
|
|
const [isDeleting, setIsDeleting] = useState(false);
|
|
// store hooks
|
|
const { getProjectById } = useProject();
|
|
// derived values
|
|
const projectDetails = data.project_id ? getProjectById(data?.project_id) : undefined;
|
|
|
|
const handleClose = () => {
|
|
setIsDeleting(false);
|
|
onClose();
|
|
};
|
|
|
|
const handleDelete = async () => {
|
|
setIsDeleting(true);
|
|
await onSubmit().finally(() => handleClose());
|
|
};
|
|
|
|
return (
|
|
<AlertModalCore
|
|
handleClose={handleClose}
|
|
handleSubmit={handleDelete}
|
|
isDeleting={isDeleting}
|
|
isOpen={isOpen}
|
|
title="Delete Issue"
|
|
content={
|
|
<>
|
|
Are you sure you want to delete issue{" "}
|
|
<span className="break-words font-medium text-custom-text-100">
|
|
{projectDetails?.identifier}-{data?.sequence_id}
|
|
</span>
|
|
{""}? The issue will only be deleted from the inbox and this action cannot be undone.
|
|
</>
|
|
}
|
|
/>
|
|
);
|
|
});
|