From 7750844fc3f8307b4a6a5c15717f3799e52a6b0b Mon Sep 17 00:00:00 2001
From: Mihir <82092317+Jimmycutie@users.noreply.github.com>
Date: Wed, 4 Sep 2024 20:15:14 +0530
Subject: [PATCH] [WEB-2216] fix: added validation check for white space for
 create issue modal (#5468)

* Updated validation check for issue modal

* Updates to functions for throwing errors

* Updates to functions for throwing errors
---
 .../components/issues/issue-modal/base.tsx    | 12 +++++--
 .../issue-modal/components/title-input.tsx    |  8 ++++-
 .../components/issues/issue-modal/form.tsx    | 32 ++++++++++++-------
 3 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/web/core/components/issues/issue-modal/base.tsx b/web/core/components/issues/issue-modal/base.tsx
index 92c0be51c..4640e136a 100644
--- a/web/core/components/issues/issue-modal/base.tsx
+++ b/web/core/components/issues/issue-modal/base.tsx
@@ -224,6 +224,7 @@ export const CreateUpdateIssueModalBase: React.FC<IssuesModalProps> = observer((
         payload: { ...payload, state: "FAILED" },
         path: pathname,
       });
+      throw error;
     }
   };
 
@@ -273,10 +274,15 @@ export const CreateUpdateIssueModalBase: React.FC<IssuesModalProps> = observer((
     if (data?.sourceIssueId) delete data.sourceIssueId;
 
     let response: TIssue | undefined = undefined;
-    if (!data?.id) response = await handleCreateIssue(payload, is_draft_issue);
-    else response = await handleUpdateIssue(payload);
 
-    if (response != undefined && onSubmit) await onSubmit(response);
+    try{
+      if (!data?.id) response = await handleCreateIssue(payload, is_draft_issue);
+      else response = await handleUpdateIssue(payload);
+    }catch(error){
+      throw error;
+    }finally{
+      if (response != undefined && onSubmit) await onSubmit(response)
+    }   
   };
 
   const handleFormChange = (formData: Partial<TIssue> | null) => setChangesMade(formData);
diff --git a/web/core/components/issues/issue-modal/components/title-input.tsx b/web/core/components/issues/issue-modal/components/title-input.tsx
index 99f6cbf4a..c1986f64e 100644
--- a/web/core/components/issues/issue-modal/components/title-input.tsx
+++ b/web/core/components/issues/issue-modal/components/title-input.tsx
@@ -19,13 +19,19 @@ type TIssueTitleInputProps = {
 
 export const IssueTitleInput: React.FC<TIssueTitleInputProps> = observer((props) => {
   const { control, issueTitleRef, errors, handleFormChange } = props;
-
+  const validateWhitespace = (value: string) => {
+    if (value.trim() === "") {
+      return "Title is required";
+    }
+    return undefined;
+  };
   return (
     <>
       <Controller
         control={control}
         name="name"
         rules={{
+          validate: validateWhitespace,
           required: "Title is required",
           maxLength: {
             value: 255,
diff --git a/web/core/components/issues/issue-modal/form.tsx b/web/core/components/issues/issue-modal/form.tsx
index 5a496087d..e62d914e4 100644
--- a/web/core/components/issues/issue-modal/form.tsx
+++ b/web/core/components/issues/issue-modal/form.tsx
@@ -71,15 +71,19 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
     onCreateMoreToggleChange,
     isDraft,
   } = props;
+
   // states
   const [labelModal, setLabelModal] = useState(false);
   const [selectedParentIssue, setSelectedParentIssue] = useState<ISearchIssueResponse | null>(null);
   const [gptAssistantModal, setGptAssistantModal] = useState(false);
+
   // refs
   const editorRef = useRef<EditorRefApi>(null);
   const submitBtnRef = useRef<HTMLButtonElement | null>(null);
+
   // router
   const { workspaceSlug, projectId: routeProjectId } = useParams();
+
   // store hooks
   const { getProjectById } = useProject();
   const { getIssueTypeIdOnProjectChange, getActiveAdditionalPropertiesLength, handlePropertyValuesValidation } =
@@ -90,6 +94,7 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
   } = useIssueDetail();
   const { fetchCycles } = useProjectIssueProperties();
   const { getStateById } = useProjectState();
+
   // form info
   const {
     formState: { errors, isDirty, isSubmitting, dirtyFields },
@@ -153,6 +158,7 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
   }, [data, projectId]);
 
   const handleFormSubmit = async (formData: Partial<TIssue>, is_draft_issue = false) => {
+    
     // Check if the editor is ready to discard
     if (!editorRef.current?.isEditorReadyToDiscard()) {
       setToast({
@@ -184,19 +190,21 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
 
     // this condition helps to move the issues from draft to project issues
     if (formData.hasOwnProperty("is_draft")) submitData.is_draft = formData.is_draft;
+        
+    await onSubmit(submitData, is_draft_issue)
+      .then(() =>{
+        setGptAssistantModal(false);
+        reset({
+          ...defaultValues,
+          ...(isCreateMoreToggleEnabled ? { ...data } : {}),
+          project_id: getValues<"project_id">("project_id"),
+          type_id: getValues<"type_id">("type_id"),
+          description_html: data?.description_html ?? "<p></p>",
+        });
+        editorRef?.current?.clearEditor();
+      })
+      .catch((error) => {})
 
-    await onSubmit(submitData, is_draft_issue);
-
-    setGptAssistantModal(false);
-
-    reset({
-      ...defaultValues,
-      ...(isCreateMoreToggleEnabled ? { ...data } : {}),
-      project_id: getValues<"project_id">("project_id"),
-      type_id: getValues<"type_id">("type_id"),
-      description_html: data?.description_html ?? "<p></p>",
-    });
-    editorRef?.current?.clearEditor();
   };
 
   const condition =