refactor: update complete in description form

web/components/inbox/main-content.tsx

@@ -137,17 +137,6 @@ export const InboxMainContent: React.FC = observer(() => {
     });
   }, [issueDetails, reset, inboxIssueId]);
 
-  useEffect(() => {
-    if (inboxIssueDetailsStore.isSubmitting === "submitted") {
-      setShowAlert(false);
-      setTimeout(async () => {
-        inboxIssueDetailsStore.setIsSubmitting("saved");
-      }, 2000);
-    } else if (inboxIssueDetailsStore.isSubmitting === "submitting") {
-      setShowAlert(true);
-    }
-  }, [inboxIssueDetailsStore.isSubmitting, setShowAlert]);
-
   const issueStatus = issueDetails?.issue_inbox[0].status;
 
   if (!inboxIssueId)
@@ -269,7 +258,6 @@ export const InboxMainContent: React.FC = observer(() => {
             </div>
             <div>
               <IssueDescriptionForm
-                setShowAlert={setShowAlert}
                 workspaceSlug={workspaceSlug as string}
                 issue={{
                   name: issueDetails.name,

web/components/issues/description-form.tsx

@@ -3,6 +3,7 @@ import { Controller, useForm } from "react-hook-form";
 import { useMobxStore } from "lib/mobx/store-provider";
 // hooks
 import debounce from "lodash/debounce";
+import useReloadConfirmations from "hooks/use-reload-confirmation";
 // components
 import { TextArea } from "@plane/ui";
 import { RichTextEditor } from "@plane/rich-text-editor";
@@ -27,13 +28,12 @@ export interface IssueDetailsProps {
   workspaceSlug: string;
   handleFormSubmit: (value: IssueDescriptionFormValues) => Promise<void>;
   isAllowed: boolean;
-  setShowAlert: (value: boolean) => void;
 }
 
 const fileService = new FileService();
 
 export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
-  const { issue, handleFormSubmit, workspaceSlug, isAllowed, setShowAlert } = props;
+  const { issue, handleFormSubmit, workspaceSlug, isAllowed } = props;
   // states
   const [characterLimit, setCharacterLimit] = useState(false);
 
@@ -43,10 +43,12 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
 
   // mobx store
   const {
-    projectIssues: { setIsSubmitting: PIsetIsSubmitting },
-    inboxIssueDetails: { setIsSubmitting: IIsetIsSubmitting },
+    projectIssues: { setIsSubmitting: PIsetIsSubmitting, isSubmitting: PIisSubmitting },
+    inboxIssueDetails: { setIsSubmitting: IIsetIsSubmitting, isSubmitting: IIisSubmitting },
   } = useMobxStore();
 
+  // hooks
+  const { setShowAlert } = useReloadConfirmations();
   const editorSuggestion = useEditorSuggestions();
 
   const {
@@ -96,6 +98,18 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
   }, 1500);
 
   const setIsSubmitting = inboxId ? IIsetIsSubmitting : PIsetIsSubmitting;
+  const isSubmitting = inboxId ? IIisSubmitting : PIisSubmitting;
+
+  useEffect(() => {
+    if (isSubmitting === "submitted") {
+      setShowAlert(false);
+      setTimeout(async () => {
+        setIsSubmitting("saved");
+      }, 2000);
+    } else if (isSubmitting === "submitting") {
+      setShowAlert(true);
+    }
+  }, [isSubmitting, setShowAlert, setIsSubmitting]);
 
   return (
     <div className="relative">

web/components/issues/main-content.tsx

@@ -1,4 +1,3 @@
-import { useEffect } from "react";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import { observer } from "mobx-react-lite";
@@ -113,16 +112,6 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
         })
       );
   };
-  useEffect(() => {
-    if (isSubmitting === "submitted") {
-      setShowAlert(false);
-      setTimeout(async () => {
-        setIsSubmitting("saved");
-      }, 2000);
-    } else if (isSubmitting === "submitting") {
-      setShowAlert(true);
-    }
-  }, [isSubmitting, setShowAlert]);
 
   const isAllowed = !!userRole && userRole >= EUserWorkspaceRoles.MEMBER;
 
@@ -214,7 +203,6 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
         </div>
 
         <IssueDescriptionForm
-          setShowAlert={setShowAlert}
           workspaceSlug={workspaceSlug as string}
           issue={issueDetails}
           handleFormSubmit={submitChanges}