Merge pull request #3671 from makeplane/preview

release: peek overview issue description initial load bug (#3670)

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