Neeraj Hot Fix Unsaved Changes Prompt After Template Save

[Neeraj-Kondaveeti]

Description

Fixes an issue where the unsaved changes confirmation dialog continued to appear after saving a job form template, even when no further changes were made.

The dialog was being triggered because the form’s baseline state used to detect unsaved changes was not being reset after a successful template save.

Related PRS (if any):

This PR is a hot fix for #4414
This PR is frontend-only fix. No backend changes required.

Main changes explained:

• Updated JobFormbuilder.jsx to explicitly reset the form’s baseline state after template create/update actions.
• Ensured unsaved-changes detection accurately reflects persisted state.

How to test:

1. check into current branch
2. do npm install and ... to run this PR locally
3. Clear site data/cache
4. log as admin user
5. Navigate to: http://localhost:5173/jobformbuilder
6. Add or edit form fields.
7. Save the current set as a template.
8. Refresh the page.
9. Verify that the unsaved changes dialog does not appear.
10. Modify a form field and refresh again.
11. Verify that the unsaved changes dialog appears as expected.

Screenshots or videos of changes:

Note:

This is a minimal hot-fix with no UI, API, or data model changes.
The update only aligns unsaved-change detection with actual persisted state.

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	d118b13
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/698a740b241d6100088d46a1
😎 Deploy Preview	https://deploy-preview-4817--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[sonarqubecloud]

Quality Gate passed

Issues
2 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[maithili20]

Hi @Neeraj-Kondaveeti
I reviewed your PR and everything works well in both dark and light modes. All the features implemented seem to work fine. Please find my video review below

Untitled.mp4

[Paul-Sayantan]

Hi Neeraj,
Thank you for providing this fix.
I myself am having trouble testing this locally.
I have checked into your branch mentioned here.
However I get "Failed to save" error when I click on save current template.
Inspite of that the template is saved.

A snippet of the error:
Failed to save template:
Object { message: "Request failed with status code 404", name: "AxiosError", code: "ERR_BAD_REQUEST", config: {…}, request: XMLHttpRequest, response: {…}, status: 404, stack: "", … }
code: "ERR_BAD_REQUEST"
​
config: Object { timeout: 0, xsrfCookieName: "XSRF-TOKEN", xsrfHeaderName: "X-XSRF-TOKEN", … }
​
message: "Request failed with status code 404"
​
name: "AxiosError"

Is this variable for my frontend different from yours that might be causing the issue?
REACT_APP_APIENDPOINT="https://api-staging.highestgood.com/api"

[Neeraj-Kondaveeti]

Hi Neeraj, Thank you for providing this fix. I myself am having trouble testing this locally. I have checked into your branch mentioned here. However I get "Failed to save" error when I click on save current template. Inspite of that the template is saved.

A snippet of the error: Failed to save template: Object { message: "Request failed with status code 404", name: "AxiosError", code: "ERR_BAD_REQUEST", config: {…}, request: XMLHttpRequest, response: {…}, status: 404, stack: "", … } code: "ERR_BAD_REQUEST" ​ config: Object { timeout: 0, xsrfCookieName: "XSRF-TOKEN", xsrfHeaderName: "X-XSRF-TOKEN", … } ​ message: "Request failed with status code 404" ​ name: "AxiosError"

Is this variable for my frontend different from yours that might be causing the issue? REACT_APP_APIENDPOINT="https://api-staging.highestgood.com/api"

Hi Paul,

Thank you for testing this.

The 404 suggests the frontend may not be reaching the correct backend endpoint. When you were checking this PR locally, was your backend running as well (not just the frontend)?

In my local setup, the backend is running and the template endpoints respond correctly. If the backend isn’t running or the API endpoint is pointing elsewhere, that could explain the 404.

Could you please try testing again by running the backend locally in parallel with the frontend and then attempt to save the template.

Please let me know and I can help align the setup.

[Paul-Sayantan]

Hi Neeraj,
I have the backend connected.
I have the following output for the backend connection:
Started server on port 4500
(node:11321) [DEP0170] DeprecationWarning: The URL mongodb://hgnData_Dev:XXXXXXXXXXX@ac-zgr1svw-shard-00-00.jfi5btm.mongodb.net:27017,ac-zgr1svw-shard-00-01.jfi5btm.mongodb.net:27017,ac-zgr1svw-shard-00-02.jfi5btm.mongodb.net:27017/hgnData_dev?authSource=admin&replicaSet=atlas-rikqt7-shard-0&retryWrites=true&w=majority&appName=HGNProdDB&ssl=true is invalid. Future versions of Node.js will throw an error.
(Use node --trace-deprecation ... to show where the warning was created)
✅ MongoDB connected

For the frontend it is running and output is :
VITE v6.3.5 ready in 320 ms
➜ Local: http://localhost:5173/

I have tried changing the frontend .env file parameter from REACT_APP_APIENDPOINT="https://api-staging.highestgood.com/api" to REACT_APP_APIENDPOINT="http://localhost:4500/api"

Can you please suggest?

[rohanrastogi311]

Hi Neeraj,

Well done with this implementation.

[one-community]

Thank you all, merging!