fix: project modal shortcut (#5353)

This commit is contained in:
Aaryan Khandelwal 2024-08-12 19:17:10 +05:30 committed by GitHub
parent 041f2b16c3
commit 4792c1cdf5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 29 additions and 54 deletions

View file

@ -1,5 +1,6 @@
import { useEffect, Fragment, FC, useState } from "react";
import { Dialog, Transition } from "@headlessui/react";
import { useEffect, FC, useState } from "react";
// ui
import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
// components
import { CreateProjectForm } from "@/plane-web/components/projects/create/root";
import { TProject } from "@/plane-web/types/projects";
@ -38,49 +39,19 @@ export const CreateProjectModal: FC<Props> = (props) => {
};
return (
<Transition.Root show={isOpen} as={Fragment}>
<Dialog as="div" className="relative z-20" onClose={onClose}>
<Transition.Child
as={Fragment}
enter="ease-out duration-300"
enterFrom="opacity-0"
enterTo="opacity-100"
leave="ease-in duration-200"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="fixed inset-0 bg-custom-backdrop transition-opacity" />
</Transition.Child>
<div className="fixed inset-0 z-20 overflow-y-auto">
<div className="my-10 flex items-center justify-center p-4 text-center sm:p-0 md:my-20">
<Transition.Child
as={Fragment}
enter="ease-out duration-300"
enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
enterTo="opacity-100 translate-y-0 sm:scale-100"
leave="ease-in duration-200"
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<Dialog.Panel className="w-full transform rounded-lg bg-custom-background-100 p-3 text-left shadow-custom-shadow-md transition-all sm:w-3/5 lg:w-1/2 xl:w-2/5">
{currentStep === EProjectCreationSteps.CREATE_PROJECT && (
<CreateProjectForm
setToFavorite={setToFavorite}
workspaceSlug={workspaceSlug}
onClose={onClose}
handleNextStep={handleNextStep}
data={data}
/>
)}
{currentStep === EProjectCreationSteps.FEATURE_SELECTION && (
<ProjectFeatureUpdate projectId={createdProjectId} workspaceSlug={workspaceSlug} onClose={onClose} />
)}
</Dialog.Panel>
</Transition.Child>
</div>
</div>
</Dialog>
</Transition.Root>
<ModalCore isOpen={isOpen} handleClose={onClose} position={EModalPosition.TOP} width={EModalWidth.XXL}>
{currentStep === EProjectCreationSteps.CREATE_PROJECT && (
<CreateProjectForm
setToFavorite={setToFavorite}
workspaceSlug={workspaceSlug}
onClose={onClose}
handleNextStep={handleNextStep}
data={data}
/>
)}
{currentStep === EProjectCreationSteps.FEATURE_SELECTION && (
<ProjectFeatureUpdate projectId={createdProjectId} workspaceSlug={workspaceSlug} onClose={onClose} />
)}
</ModalCore>
);
};

View file

@ -12,7 +12,7 @@ const ProjectCreateButtons: React.FC<Props> = (props) => {
} = useFormContext<IProject>();
return (
<div className="flex justify-end gap-2 pt-4 border-t border-custom-border-100">
<div className="flex justify-end gap-2 py-4 border-t border-custom-border-100">
<Button variant="neutral-primary" size="sm" onClick={handleClose} tabIndex={6}>
Cancel
</Button>