Merge pull request #4817 from OneCommunityGlobal/Neeraj_Hotfix_JobBuilder_Reset_Unsaved_State

Neeraj Hot Fix Unsaved Changes Prompt After Template Save

Author: one-community

src/components/Collaboration/JobFormbuilder.jsx

@@ -48,6 +48,11 @@ function JobFormBuilder() {
 
   const jobPositions = ['Software Developer', 'Project Manager', 'Analyst'];
 
+  const markAsSaved = fields => {
+    setInitialFormFields(structuredClone(fields));
+    setHasUnsavedChanges(false);
+  };
+
   // Prevent refresh while unsaved changes exist
   useEffect(() => {
     const handler = event => {
@@ -73,13 +78,10 @@ function JobFormBuilder() {
 
           setCurrentFormId(id);
           setFormFields(form.questions || []);
-          setInitialFormFields(form.questions || []);
-
+          markAsSaved(form.questions || []);
           setNewField(initialNewField);
-          setHasUnsavedChanges(false);
         }
       } catch (error) {
-        // still allowed logging
         console.error(error);
       }
     };
@@ -101,7 +103,6 @@ function JobFormBuilder() {
   // Clone field
   const cloneField = async (field, index) => {
     const clone = structuredClone(field);
-
     const updated = [...formFields.slice(0, index + 1), clone, ...formFields.slice(index + 1)];
     setFormFields(updated);
 
@@ -111,6 +112,7 @@ function JobFormBuilder() {
           question: clone,
           position: index + 1,
         });
+        markAsSaved(updated);
       } catch (error) {
         console.error(error);
       }
@@ -132,6 +134,7 @@ function JobFormBuilder() {
           fromIndex: index,
           toIndex: newIndex,
         });
+        markAsSaved(updated);
       } catch (error) {
         console.error(error);
       }
@@ -147,6 +150,7 @@ function JobFormBuilder() {
     if (currentFormId) {
       try {
         await axios.delete(ENDPOINTS.DELETE_QUESTION(currentFormId, index));
+        markAsSaved(updated);
       } catch (error) {
         console.error(error);
       }
@@ -187,6 +191,7 @@ function JobFormBuilder() {
           ENDPOINTS.UPDATE_QUESTION(currentFormId, editingIndex),
           updated[editingIndex],
         );
+        markAsSaved(updated);
       } catch (error) {
         console.error(error);
       }
@@ -236,6 +241,7 @@ function JobFormBuilder() {
           question: newField,
           position: formFields.length,
         });
+        markAsSaved(updated);
       } catch (error) {
         console.error(error);
       }
@@ -301,7 +307,13 @@ function JobFormBuilder() {
             <QuestionSetManager
               formFields={formFields}
               setFormFields={setFormFields}
-              onImportQuestions={setFormFields}
+              onImportQuestions={fields => {
+                setFormFields(fields);
+                markAsSaved(fields);
+              }}
+              onTemplateSaved={() => {
+                markAsSaved(formFields);
+              }}
               darkMode={darkMode}
               templateName={templateName}
               setTemplateName={setTemplateName}

src/components/Collaboration/QuestionSetManager.jsx

@@ -12,6 +12,7 @@ function QuestionSetManager({
   formFields,
   setFormFields,
   onImportQuestions,
+  onTemplateSaved,
   darkMode,
   templateName,
   setTemplateName,
@@ -119,6 +120,7 @@ function QuestionSetManager({
         setTemplates(prev => prev.map(t => (t._id === updatedTemplate._id ? updatedTemplate : t)));
 
         safeAlert(`Template "${templateName}" updated.`);
+        onTemplateSaved && onTemplateSaved();
       } else {
         const newTemplate = await api.createTemplate({
           name: templateName,
@@ -137,6 +139,7 @@ function QuestionSetManager({
 
         localStorage.setItem('jobFormTemplates', JSON.stringify(updated));
         safeAlert(`Template "${templateName}" created.`);
+        onTemplateSaved && onTemplateSaved();
       }
 
       setTemplateName('');
@@ -406,6 +409,7 @@ QuestionSetManager.propTypes = {
   ).isRequired,
   setFormFields: PropTypes.func.isRequired,
   onImportQuestions: PropTypes.func.isRequired,
+  onTemplateSaved: PropTypes.func,
   darkMode: PropTypes.bool.isRequired,
   templateName: PropTypes.string.isRequired,
   setTemplateName: PropTypes.func.isRequired,