chore: create/update state duplicate name error (#870)

This commit is contained in:
Aaryan Khandelwal 2023-04-18 01:15:39 +05:30 committed by GitHub
parent fa5c994ddc
commit acff6396f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 56 additions and 31 deletions

View File

@ -12,6 +12,8 @@ import { TwitterPicker } from "react-color";
import { Dialog, Popover, Transition } from "@headlessui/react";
// services
import stateService from "services/state.service";
// hooks
import useToast from "hooks/use-toast";
// ui
import { CustomSelect, Input, PrimaryButton, SecondaryButton, TextArea } from "components/ui";
// icons
@ -41,6 +43,8 @@ export const CreateStateModal: React.FC<Props> = ({ isOpen, projectId, handleClo
const router = useRouter();
const { workspaceSlug } = router.query;
const { setToastAlert } = useToast();
const {
register,
formState: { errors, isSubmitting },
@ -48,7 +52,6 @@ export const CreateStateModal: React.FC<Props> = ({ isOpen, projectId, handleClo
watch,
control,
reset,
setError,
} = useForm<IState>({
defaultValues,
});
@ -67,15 +70,22 @@ export const CreateStateModal: React.FC<Props> = ({ isOpen, projectId, handleClo
await stateService
.createState(workspaceSlug as string, projectId, payload)
.then((res) => {
.then(() => {
mutate(STATE_LIST(projectId));
onClose();
})
.catch((err) => {
Object.keys(err).map((key) => {
setError(key as keyof IState, {
message: err[key].join(", "),
if (err.status === 400)
setToastAlert({
type: "error",
title: "Error!",
message: "Another state exists with the same name. Please try again with another name.",
});
else
setToastAlert({
type: "error",
title: "Error!",
message: "State could not be created. Please try again.",
});
});
};

View File

@ -47,7 +47,6 @@ export const CreateUpdateStateInline: React.FC<Props> = ({ data, onClose, select
register,
handleSubmit,
formState: { errors, isSubmitting },
setError,
watch,
reset,
control,
@ -89,16 +88,24 @@ export const CreateUpdateStateInline: React.FC<Props> = ({ data, onClose, select
handleClose();
setToastAlert({
title: "Success",
type: "success",
message: "State created successfully",
title: "Success!",
message: "State created successfully.",
});
})
.catch((err) => {
Object.keys(err).map((key) => {
setError(key as keyof IState, {
message: err[key].join(", "),
if (err.status === 400)
setToastAlert({
type: "error",
title: "Error!",
message:
"Another state exists with the same name. Please try again with another name.",
});
else
setToastAlert({
type: "error",
title: "Error!",
message: "State could not be created. Please try again.",
});
});
} else {
@ -106,21 +113,29 @@ export const CreateUpdateStateInline: React.FC<Props> = ({ data, onClose, select
.updateState(workspaceSlug as string, projectId as string, data.id, {
...payload,
})
.then((res) => {
.then(() => {
mutate(STATE_LIST(projectId as string));
handleClose();
setToastAlert({
title: "Success",
type: "success",
message: "State updated successfully",
title: "Success!",
message: "State updated successfully.",
});
})
.catch((err) => {
Object.keys(err).map((key) => {
setError(key as keyof IState, {
message: err[key].join(", "),
if (err.status === 400)
setToastAlert({
type: "error",
title: "Error!",
message:
"Another state exists with the same name. Please try again with another name.",
});
else
setToastAlert({
type: "error",
title: "Error!",
message: "State could not be updated. Please try again.",
});
});
}
@ -131,18 +146,18 @@ export const CreateUpdateStateInline: React.FC<Props> = ({ data, onClose, select
onSubmit={handleSubmit(onSubmit)}
className="flex items-center gap-x-2 rounded-[10px] bg-white p-5"
>
<div className="h-8 w-8 flex-shrink-0">
<Popover className="relative flex h-full w-full items-center justify-center rounded-xl bg-gray-200">
<div className="flex-shrink-0">
<Popover className="relative flex h-full w-full items-center justify-center">
{({ open }) => (
<>
<Popover.Button
className={`group inline-flex items-center text-base font-medium focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 ${
className={`group inline-flex items-center text-base font-medium focus:outline-none ${
open ? "text-gray-900" : "text-gray-500"
}`}
>
{watch("color") && watch("color") !== "" && (
<span
className="h-4 w-4 rounded"
className="h-5 w-5 rounded"
style={{
backgroundColor: watch("color") ?? "black",
}}

View File

@ -120,9 +120,8 @@ export const DeleteStateModal: React.FC<Props> = ({ isOpen, onClose, data }) =>
<div className="mt-2">
<p className="text-sm text-gray-500">
Are you sure you want to delete state-{" "}
<span className="italic">{data?.name}</span>
? All of the data related to the state will be permanently removed.
This action cannot be undone.
<span className="italic">{data?.name}</span>? All of the data related to
the state will be permanently removed. This action cannot be undone.
</p>
</div>
<div className="mt-2">
@ -140,7 +139,8 @@ export const DeleteStateModal: React.FC<Props> = ({ isOpen, onClose, data }) =>
<SecondaryButton onClick={handleClose}>Cancel</SecondaryButton>
<DangerButton
onClick={handleDeletion}
loading={isDeleteLoading || issuesWithThisStateExist}
disabled={issuesWithThisStateExist}
loading={isDeleteLoading}
>
{isDeleteLoading ? "Deleting..." : "Delete"}
</DangerButton>

View File

@ -22,7 +22,7 @@ class ProjectStateServices extends APIService {
return response?.data;
})
.catch((error) => {
throw error?.response?.data;
throw error?.response;
});
}
@ -66,7 +66,7 @@ class ProjectStateServices extends APIService {
return response?.data;
})
.catch((error) => {
throw error?.response?.data;
throw error?.response;
});
}