@W-20398991 - Forgot Password link not working from Account Profile password update form

[giridhari-gupta]

Description

fix(account): Correct "Forgot Password" link behavior

The link within the UpdatePasswordFields component, which is intended to navigate to /reset-password, was not working when accessed from the main Account Profile page (/account).

This change ensures that clicking the link allowing the user to navigate to the password reset flow as expected.

Fixes #3486

Screen.Recording.2025-12-03.at.3.04.49.PM.mov

Types of Changes

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Documentation update
• Breaking change (could cause existing functionality to not work as expected)
• Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

• Removing a public function or component or prop
• Adding a required argument to a function
• Changing the data type of a function parameter or return value
• Adding a new peer dependency to package.json

Changes

Files involved:

• packages/template-retail-react-app/app/pages/account/index.jsx (line 234 - passes handleForgotPasswordClick prop)
• packages/template-retail-react-app/app/pages/account/profile.jsx (line 367 - receives and passes prop to PasswordCard)
• packages/template-retail-react-app/app/components/forms/update-password-fields.jsx (line 34 - button with onClick handler)

Code reference:
The handleForgotPasswordClick prop is defined in app/pages/account/index.jsx:avascript

<AccountDetail 
    handleForgotPasswordClick={() => navigate('/reset-password')}
/>

And is used in app/components/forms/update-password-fields.jsx:script

<Button variant="link" size="sm" onClick={handleForgotPasswordClick}>
    <FormattedMessage
        defaultMessage="Forgot Password?"
        id="update_password_fields.button.forgot_password"
    />
</Button>

Note: The same pattern works correctly on the login page (/login), where the "Forgot password?" link successfully navigates to /reset-password. This suggests the issue may be specific to the account profile context or form submission interference.

How to Test-Drive This PR

Screen.Recording.2025-12-03.at.2.53.36.PM.mov

Sandbox Deployment: https://cc-pulse-giri-testing-space.sfdc-3vx9f4-commerceecom.exp-delivery-staging.com/

1. Log in to the application
2. Navigate to the Account page (/account)
3. Click to edit the Password section
4. In the password update form, click the "Forgot Password?" link below the "Current Password" field
5. Observe that the navigation to /reset-password will work now.

Checklists

General

• Changes are covered by test cases
• CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

• There are no changes to UI

or...

• Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
• Changes comply with WCAG 2.0 guidelines levels A and AA
• Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

• Changes include a UI text update in the Retail React App (which requires translation)

[cc-prodsec]

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues
✅	Licenses	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

[giridhari-gupta]

Duplicate PR: #3493