mirror of
https://github.com/makeplane/plane
synced 2024-06-14 14:31:34 +00:00
chore: bug fixes & improvement (#3218)
* chore: draft issue validation added to prevent saving empty or whitespace title * chore: resolve scrolling issue in page empty state * chore: kanban layout quick add issue improvement
This commit is contained in:
Anmol Singh Bhatia
sriram veeraghanta
parent
5f681973a0
commit
0a41eff435
@ -41,69 +41,71 @@ export const NewEmptyState: React.FC<Props> = ({
|
||||
setIsHovered(false);
|
||||
};
|
||||
return (
|
||||
<div className=" flex h-full w-full flex-col items-center justify-center ">
|
||||
<div className="m-5 flex max-w-6xl flex-col gap-5 rounded-xl border border-custom-border-200 px-10 py-7 shadow-sm md:m-16">
|
||||
<h3 className="text-2xl font-semibold">{title}</h3>
|
||||
{description && <p className=" text-lg">{description}</p>}
|
||||
<div className="relative w-full max-w-6xl">
|
||||
<Image src={image} className="w-full" alt={primaryButton?.text || "button image"} />
|
||||
</div>
|
||||
<div className="flex items-center justify-center overflow-y-auto">
|
||||
<div className=" flex h-full w-full flex-col items-center justify-center ">
|
||||
<div className="m-5 flex max-w-6xl flex-col gap-5 rounded-xl border border-custom-border-200 px-10 py-7 shadow-sm md:m-16">
|
||||
<h3 className="text-2xl font-semibold">{title}</h3>
|
||||
{description && <p className=" text-lg">{description}</p>}
|
||||
<div className="relative w-full max-w-6xl">
|
||||
<Image src={image} className="w-full" alt={primaryButton?.text || "button image"} />
|
||||
</div>
|
||||
|
||||
<div className="relative flex items-start justify-center">
|
||||
{primaryButton && (
|
||||
<Button
|
||||
className={`relative m-3 max-w-min !px-6 ${comicBox?.direction === "left" ? "flex-row-reverse" : ""}`}
|
||||
size="lg"
|
||||
variant="primary"
|
||||
onClick={primaryButton.onClick}
|
||||
disabled={disabled}
|
||||
>
|
||||
{primaryButton.text}
|
||||
<div
|
||||
onMouseEnter={handleMouseEnter}
|
||||
onMouseLeave={handleMouseLeave}
|
||||
className={`absolute bg-blue-300 ${
|
||||
comicBox?.direction === "left" ? "left-0 ml-2" : "right-0 mr-2"
|
||||
} z-10 h-2.5 w-2.5 animate-ping rounded-full`}
|
||||
/>
|
||||
<div
|
||||
className={`absolute bg-blue-400/40 ${
|
||||
comicBox?.direction === "left" ? "left-0 ml-2.5" : "right-0 mr-2.5"
|
||||
} h-1.5 w-1.5 rounded-full`}
|
||||
/>
|
||||
</Button>
|
||||
)}
|
||||
{comicBox &&
|
||||
isHovered &&
|
||||
(comicBox.direction === "right" ? (
|
||||
<div
|
||||
className={`absolute left-1/2 top-0 flex max-w-sm ${
|
||||
comicBox?.extraPadding ? "ml-[125px]" : "ml-[90px]"
|
||||
} pb-5`}
|
||||
<div className="relative flex items-start justify-center">
|
||||
{primaryButton && (
|
||||
<Button
|
||||
className={`relative m-3 max-w-min !px-6 ${comicBox?.direction === "left" ? "flex-row-reverse" : ""}`}
|
||||
size="lg"
|
||||
variant="primary"
|
||||
onClick={primaryButton.onClick}
|
||||
disabled={disabled}
|
||||
>
|
||||
<div className="relative mt-5 h-0 w-0 border-b-[11px] border-r-[11px] border-t-[11px] border-custom-border-200 border-y-transparent">
|
||||
<div className="absolute right-[-12px] top-[-10px] h-0 w-0 border-b-[10px] border-r-[10px] border-t-[10px] border-custom-background-100 border-y-transparent" />
|
||||
{primaryButton.text}
|
||||
<div
|
||||
onMouseEnter={handleMouseEnter}
|
||||
onMouseLeave={handleMouseLeave}
|
||||
className={`absolute bg-blue-300 ${
|
||||
comicBox?.direction === "left" ? "left-0 ml-2" : "right-0 mr-2"
|
||||
} z-10 h-2.5 w-2.5 animate-ping rounded-full`}
|
||||
/>
|
||||
<div
|
||||
className={`absolute bg-blue-400/40 ${
|
||||
comicBox?.direction === "left" ? "left-0 ml-2.5" : "right-0 mr-2.5"
|
||||
} h-1.5 w-1.5 rounded-full`}
|
||||
/>
|
||||
</Button>
|
||||
)}
|
||||
{comicBox &&
|
||||
isHovered &&
|
||||
(comicBox.direction === "right" ? (
|
||||
<div
|
||||
className={`absolute left-1/2 top-0 flex max-w-sm ${
|
||||
comicBox?.extraPadding ? "ml-[125px]" : "ml-[90px]"
|
||||
} pb-5`}
|
||||
>
|
||||
<div className="relative mt-5 h-0 w-0 border-b-[11px] border-r-[11px] border-t-[11px] border-custom-border-200 border-y-transparent">
|
||||
<div className="absolute right-[-12px] top-[-10px] h-0 w-0 border-b-[10px] border-r-[10px] border-t-[10px] border-custom-background-100 border-y-transparent" />
|
||||
</div>
|
||||
<div className="rounded-md border border-custom-border-200 bg-custom-background-100">
|
||||
<h1 className="p-5">
|
||||
<h3 className="text-lg font-semibold">{comicBox?.title}</h3>
|
||||
<h4 className="mt-1 text-sm">{comicBox?.description}</h4>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div className="rounded-md border border-custom-border-200 bg-custom-background-100">
|
||||
<h1 className="p-5">
|
||||
<h3 className="text-lg font-semibold">{comicBox?.title}</h3>
|
||||
<h4 className="mt-1 text-sm">{comicBox?.description}</h4>
|
||||
</h1>
|
||||
) : (
|
||||
<div className="absolute right-1/2 top-0 mr-[90px] flex max-w-sm flex-row-reverse pb-5">
|
||||
<div className="relative mt-5 h-0 w-0 border-b-[11px] border-l-[11px] border-t-[11px] border-custom-border-200 border-y-transparent">
|
||||
<div className="absolute left-[-12px] top-[-10px] h-0 w-0 border-b-[10px] border-l-[10px] border-t-[10px] border-custom-background-100 border-y-transparent" />
|
||||
</div>
|
||||
<div className="rounded-md border border-custom-border-200 bg-custom-background-100">
|
||||
<h1 className="p-5">
|
||||
<h3 className="text-lg font-semibold">{comicBox?.title}</h3>
|
||||
<h4 className="mt-1 text-sm">{comicBox?.description}</h4>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="absolute right-1/2 top-0 mr-[90px] flex max-w-sm flex-row-reverse pb-5">
|
||||
<div className="relative mt-5 h-0 w-0 border-b-[11px] border-l-[11px] border-t-[11px] border-custom-border-200 border-y-transparent">
|
||||
<div className="absolute left-[-12px] top-[-10px] h-0 w-0 border-b-[10px] border-l-[10px] border-t-[10px] border-custom-background-100 border-y-transparent" />
|
||||
</div>
|
||||
<div className="rounded-md border border-custom-border-200 bg-custom-background-100">
|
||||
<h1 className="p-5">
|
||||
<h3 className="text-lg font-semibold">{comicBox?.title}</h3>
|
||||
<h4 className="mt-1 text-sm">{comicBox?.description}</h4>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -22,7 +22,7 @@ const Inputs = (props: any) => {
|
||||
}, [setFocus]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="w-full">
|
||||
<h4 className="text-xs font-medium leading-5 text-custom-text-300">{projectDetail?.identifier ?? "..."}</h4>
|
||||
<input
|
||||
autoComplete="off"
|
||||
|
||||
@ -187,7 +187,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((prop
|
||||
*/
|
||||
|
||||
const onDiscardClose = () => {
|
||||
if (formDirtyState !== null) {
|
||||
if (formDirtyState !== null && formDirtyState.name.trim() !== "") {
|
||||
setShowConfirmDiscard(true);
|
||||
} else {
|
||||
handleClose();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user