[adit24dhaya]

Description

The role dropdown previously changed only the displayed title, while Go had no handler. The builder kept the previous form ID and questions, so editing or saving could affect a different questionnaire. Both controls now load and validate the selected role's saved form by ID before enabling editing.

Original task request

Jobs Bug #68 — Job Form Builder: Role Search / Selector and Dropdown Selection Do Not Load Selected Role's Question Set, in Application/Job Posting Page/Function and Design. Assigned by Jae as urgent, with a five-hour estimate.

Complete pictures of the original request, captured before implementation:

The request calls for the chosen role's active questions to load through both controls, an explicit editing context, and protection against overwriting the wrong role's questionnaire. The reported software example has 12 questions; the implementation loads the returned data and does not hard-code that count.

Related PRs

No backend PR is required. Uses the existing /jobforms/all and /jobforms/:formId read APIs and current HGNRest question-write routes.

Main changes explained

• Search via Go/Enter or select a role to fetch its saved questionnaire. Include newly configured roles from the catalog; do not guess when names are ambiguous or use generic fallback questions when a form is missing.
• Validate the returned ID, title, active status and questions. Clear the previous editor while loading, block editing after failures, support retry, and ignore obsolete responses. Changing roles clears question/template drafts and modals after confirming unsaved changes.
• Show “Editing questionnaire for: [role]” and a persistent warning about active changes. Save Form requires explicit replacement confirmation, keeps the role locked during writes and retains the existing description. Existing per-question actions still persist immediately, as the warning explains.
• Keep delayed imports from an old role out of the new editor. Preserve the unsaved-change warning for imported/visibility drafts after individual question writes. Use PATCH for question edits, matching the existing backend route.
• Add regression tests and original-request pictures; use CSS Modules for the new status, warning and search layout.

How to test

1. Check out fix/job-form-role-questions with Node 20 and the repository's existing dependencies.
2. Run npx vitest run src/components/Collaboration/__tests__/JobFormBuilder.roleSelection.test.jsx.
3. With an account that has Manage Job Forms permission, open /jobformbuilder. Check that the initial role loads its own questions and the editing label matches.
4. Search SOFTWARE with Go and Enter, then select GENERAL and SEEKING SOFTWARE POSITION from the dropdown. Each selection should fetch its form ID and replace the previous question list. The software count should match its current configured data on /job-application.
5. Using mocked requests or isolated test data, delay/fail role requests and switch quickly. Editing must stay disabled until a valid matching form arrives; stale responses must not replace the current role. Missing forms must not enable saving. For duplicate role names, select a saved questionnaire by category, update date and form ID. A failed detail request must show a working Retry questionnaire button.
6. Test unsaved-change cancellation and confirmation. Declining Save Form's replacement prompt must send no update; accepting sends the loaded form's ID, title and questions. Role switching stays disabled while a write is pending. Test add/edit/reorder/delete and template append against the selected form.
7. Check light/dark themes and mobile widths. Live write testing affects active questionnaires; use isolated data rather than shared forms.

Validation

On 94a759be24 (review feedback fixes):

• All 192 Collaboration tests passed, including 36 role-selection tests. Three regression checks fail on the preceding commit and pass after this fix.
• Four Chromium scenarios (390px/1280px, light/dark) verified a unique initial role, duplicate choice, failed request, clicking Retry without changing selection, correct save ID, switching duplicates and no horizontal overflow or page errors. All API calls used synthetic data and mocks.
• Production build passed in 31.68s; changed JavaScript lint and pre-commit lint/format hooks passed.
• All three GitHub test jobs, CSS Modules, Sonar and preview passed on this commit; Sonar reports zero open issues. GitHub reports no merge conflicts.

Earlier validation at 9e8572809c: full suite 2,797 passed, 14 skipped with external network blocked; 178 browser assertions across four widths and both themes, plus public-application question comparison and question mutation checks. At dfc6f76da3, all GitHub checks and Sonar passed with zero open issues.

Duplicate roles and retry

The initial load chooses a role with one saved form when available. For duplicate titles, editors explicitly choose a questionnaire using its category, update date and ID; the app does not guess a winner. If every role is duplicated, the chooser is available immediately. Failed loads offer Retry questionnaire, bound to the exact selected form ID.

Related PRs #5761 and #5763 also edit the builder. This PR preserves the existing immediate question-write behavior and its warning; the staging behavior proposed in #5763 needs reconciliation when those changes merge.

Screenshots or videos of changes

Original-request pictures are embedded above. UI screenshots, actual code, a short compressed walkthrough and test/progress notes are staged locally in weekly-upload/Week 6/Job Form Builder - Role questions; these have not been uploaded to Dropbox.

Note

Browser checks use the actual components with synthetic data and mocked HTTP. No live Admin session, shared database writes, real applications, PR merges or manual deployment were used. This implements the request's warning/confirmation option; it does not introduce a new form-creation workflow or resolve the separately assigned Clone with Template issue (Bug #69).

Documentation cleanup: screenshots are attached directly to this description and removed from the PR commit range. Application and test files are byte-for-byte unchanged. Previously tested head 94a759be24 corresponds to cleaned head fa6090d0bf; all fresh GitHub test, preview and Sonar checks pass.

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	8fddbe4
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6aed4e7b14e611128009913f
😎 Deploy Preview	https://deploy-preview-5764--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

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

[vidiyala99]

Tested dfc6f76 on /jobformbuilder in light and dark mode at 1400 px, with the backend on development and its real job forms. My test account doesn't have Manage Job Forms, so I added manageJobForms to the logged-in user in the browser's Redux state before opening the page. Every write request was intercepted and answered with a mock 200, so nothing was saved on dev.

Works as described:

• Dropdown (screenshot 3): picking GENERAL, then SEEKING SOFTWARE POSITION, fetches each role's own form. The label reads "Editing questionnaire for: SEEKING SOFTWARE POSITION" and the question list is replaced.
• Go search: "zzzz-no-role" shows "No matching job role was found.". "SOFTWARE" and "ENGINEER" show "Several roles match. Choose the intended role from the dropdown." (SOFTWARE matches "SEEKING SOFTWARE POSITION" and "Software Developer").
• Save Form: shows "Replace the active questionnaire for SEEKING SOFTWARE POSITION with these 15 questions?". Cancel sends nothing. OK sends one PUT /api/jobforms whose formId (…8917c4) is the form just loaded for that role, not the previous one.
• Failed load: when I made GET /api/jobforms/<id> return 500, editing stayed disabled and the error showed.
• Dark mode: the new banners are readable (white on #253c55 and on #493913).
• Lint, tests and SonarCloud pass.

Requesting changes:

1. The page opens in a blocked state on dev (screenshots 1 and 2). The first role in the list, "4-DOME CLUSTER ELECTRICAL DESIGN", has two active saved forms on dev. One ends in …8918c2, category Data Analysis, updated 10/30. The other ends in …fec1e9, category General, updated 10/13. Both have 15 questions. With this PR the builder opens on that role and shows "Several saved forms have this role name. Resolve the duplicate before editing.", with no questions and no way to resolve it from this page. On development the same role loads (…8918c2) and can be edited. It's the only duplicate among the 46 forms, but it's the default view, so every visit starts there. Some options: open the most recently updated active form and show a note; let the user pick between the duplicates (show category and date); or don't auto-select a duplicated role on load.
2. "Select the role again to retry" can't work in a real browser. After a failed load the dropdown still shows the failed role. A native <select> doesn't fire change when you pick the option that's already selected, so re-selecting it does nothing, and the "Retry loading roles" button only shows when no role is selected. My scripted re-select only recovered because a script can fire change without the value changing. The test "keeps saving disabled on a failed role load and supports retry" (JobFormBuilder.roleSelection.test.jsx line 243) does the same: it calls select(software.title) twice. A Retry button whenever status === 'error', or clearing the selection on failure, would fix it.

Non-blocking:

• Conflicts with #5761 and #5763. All three edit deleteField, the state block and the unsaved-changes code in JobFormbuilder.jsx, and they disagree on behaviour. This PR's banner says "Question actions update this role immediately", while #5763 makes question actions local until Save Form. The authors should agree on one model before these merge.
• The three PNGs under docs/task-evidence/ add about 580 KB to the repo history. The PR description is a better place for them.

Requesting changes.

[adit24dhaya]

Thanks for catching both issues. Fixed in 94a759b: the initial load skips duplicated role names when a unique role is available. Duplicate roles now offer a questionnaire selector with category, date and form ID. Failed loads have a Retry questionnaire button that reloads the exact selected form.

All 192 Collaboration tests pass, including three checks that failed before this fix. I also tested the actual controls at mobile and desktop widths in both themes with mocked requests, including saving to the chosen duplicate. Build and lint pass. All GitHub test jobs, the preview and Sonar now pass; Sonar reports zero open issues. Please re-review when ready.

I also noted the overlap with #5761/#5763 in the description. This update keeps the existing immediate-save behavior; the proposed staging change still needs coordination before merging.

[vidiyala99]

Approved. Re-tested at head 94a759b on the deploy preview (/jobformbuilder) in light and dark mode at 1400 px, with the real job forms on the dev database. The dev API (apidev) is returning 500 on every endpoint right now, so I ran HGNRest development locally against the dev database and sent the preview's API calls to it. Every write was intercepted and answered with a mock 200, so nothing was saved. As last time, I added manageJobForms to my test user in the browser's Redux state.

Both blockers from my 11/03 review are fixed

1. The page no longer opens blocked. It now opens on the first role with a single form, "T.A.S.T. - ENGINEER/ARCHITECT OFFERING POSITION", with that role's questions loaded and Save Form available (screenshot 1).
2. Duplicate roles can be edited now. Choosing "4-DOME CLUSTER ELECTRICAL DESIGN" shows the new "Several saved forms have this role name" picker, listing both dev forms (Data Analysis …8918c2, General …fec1e9) (screenshot 2). Clicking Save Form before choosing one does nothing. After picking …fec1e9, its 15 questions load, and Save Form asks "Replace the active questionnaire for 4-DOME CLUSTER ELECTRICAL DESIGN with these 15 questions?". OK sends PUT /api/jobforms with formId: "692093eef829674bc4fec1e9", the form I picked.
3. Retry works in a real browser. I made the GET for …8918c2 fail once. The page showed "Could not load the questionnaire for 4-DOME CLUSTER ELECTRICAL DESIGN. Use Retry questionnaire to try again." with a Retry questionnaire button (screenshot 3). Clicking it reloaded the same form, and the button and error went away (screenshot 4). The updated test now clicks the button instead of re-selecting the role.

src/components/Collaboration passes locally (17 files, 192 tests), and CI is green.

Non-blocking

• The Retry questionnaire button has no styling. In dark mode it reads as plain centred text between the picker and the heading (screenshot 3). Giving it the same class as "Retry loading roles", or a regular button style, would make it look clickable.
• Picker labels: they show the raw timestamp (2026-11-04T23:49:54.719Z) and the full id (6acdfc972a8047e5f08918c2). A short date (Nov 4, 2026) and the last 6 characters of the id would be easier to read.
• Stale info message: "Select a role to load its saved questionnaire." stays on screen while a duplicate role is selected and its load fails (screenshots 2 and 3).
• Save Form looks enabled while the picker is still on "Choose a saved questionnaire". It safely does nothing, but disabled would make that clear.
• From last time: the docs/task-evidence/ PNGs are still in the diff, and the overlap with #5761 and #5763 still needs agreeing on.

1. Opens on a role with one saved form (light)

2. Duplicate role: the new questionnaire picker (light)

3. Forced load failure: error and Retry questionnaire (dark)

4. After Retry: the same form loads (dark)

[adit24dhaya]

Moved all three pictures to direct attachments in the PR description and removed them from the PR commits. I verified that the attachments render and match the originals. Application and test files are byte-for-byte unchanged from the previously tested head. Fresh GitHub tests, preview and Sonar pass. The history cleanup reset the earlier approvals, so I requested renewed reviews.

[sonarqubecloud]

Quality Gate passed

Issues
0 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

[adit24dhaya]

Addressed the remaining UI suggestions in 8fddbe4: Retry now looks like a button in both themes, picker dates/IDs are shorter, the stale selection message is replaced, and Save Form visibly stays disabled until a questionnaire loads. Full IDs remain when shortened IDs collide.

All 194 Collaboration tests and 8 browser cases passed, plus build and JS/CSS lint. Browser checks used mocked data and covered keyboard focus, contrast, duplicate choice and retrying the same form. Fresh CI is running. Please re-review when ready.