From 2548a9f062f7f0ce9362a89dd7d8d51e2103da1a Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com>
Date: Thu, 15 Feb 2024 03:17:16 +0530
Subject: [PATCH] fix: peek overview issue description initial load bug (#3670)

* fix: peek overview issue description initial load bug

* fix: peekoverview issue description infinite loading for certain data sets

---------

Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>
---
 web/components/issues/description-form.tsx | 30 ++++++----------------
 1 file changed, 8 insertions(+), 22 deletions(-)

diff --git a/web/components/issues/description-form.tsx b/web/components/issues/description-form.tsx
index 452e37e75..4d20fd978 100644
--- a/web/components/issues/description-form.tsx
+++ b/web/components/issues/description-form.tsx
@@ -41,10 +41,9 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = observer((props) => {
   const { workspaceSlug, projectId, issueId, issue, issueOperations, disabled, isSubmitting, setIsSubmitting } = props;
   const workspaceStore = useWorkspace();
   const workspaceId = workspaceStore.getWorkspaceBySlug(workspaceSlug)?.id as string;
-
   // states
   const [characterLimit, setCharacterLimit] = useState(false);
-
+  // hooks
   const { setShowAlert } = useReloadConfirmations();
   // store hooks
   const { mentionHighlights, mentionSuggestions } = useMention();
@@ -57,8 +56,8 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = observer((props) => {
     formState: { errors },
   } = useForm<TIssue>({
     defaultValues: {
-      name: "",
-      description_html: "",
+      name: issue?.name,
+      description_html: issue?.description_html,
     },
   });
 
@@ -68,24 +67,6 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = observer((props) => {
     description_html: issue.description_html,
   });
 
-  // adding issue.description_html or issue.name to dependency array causes
-  // editor rerendering on every save
-  useEffect(() => {
-    if (issue.id) {
-      setLocalTitleValue(issue.name);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [issue.id]); // TODO: verify the exhaustive-deps warning
-
-  useEffect(() => {
-    if (["", undefined, null].includes(localIssueDescription.description_html)) {
-      setLocalIssueDescription((state) => {
-        if (!["", undefined, null].includes(state.description_html)) return state;
-        return { id: issue.id, description_html: issue.description_html || "<p></p>" };
-      });
-    }
-  }, [issue.description_html, localIssueDescription.description_html, issue.id]);
-
   const handleDescriptionFormSubmit = useCallback(
     async (formData: Partial<TIssue>) => {
       if (!formData?.name || formData?.name.length === 0 || formData?.name.length > 255) return;
@@ -122,6 +103,11 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = observer((props) => {
     reset({
       ...issue,
     });
+    setLocalIssueDescription({
+      id: issue.id,
+      description_html: issue.description_html === "" ? "<p></p>" : issue.description_html,
+    });
+    setLocalTitleValue(issue.name);
   }, [issue, reset]);
 
   // ADDING handleDescriptionFormSubmit TO DEPENDENCY ARRAY PRODUCES ADVERSE EFFECTS