BA-2364: change password #239
Conversation
pt-tsl
requested review from
anicioalexandre,
deboracosilveira and
priscilladeroode
as code owners
|
WalkthroughThe pull request refactors the password change functionality by replacing the Changes
Sequence Diagram(s)sequenceDiagram
participant U as User
participant H as useChangePassword Hook
participant A as AuthApi
U->>H: Submit current & new password (optional token)
alt Token is provided
H->>A: Call changeExpiredPassword(token, newPassword)
else No token provided
H->>A: Call changePassword(currentPassword, newPassword)
end
A-->>H: Return API response
H->>U: Trigger onSuccess callback
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool’s configuration or disable the tool if it’s a critical failure. 🔧 ESLint
packages/authentication/modules/access/index.tsOops! Something went wrong! :( ESLint: 8.57.1 Error: Cannot read config file: /packages/authentication/.eslintrc.js
packages/authentication/modules/access/useChangePassword/index.tsOops! Something went wrong! :( ESLint: 8.57.1 Error: Cannot read config file: /packages/authentication/.eslintrc.js
packages/authentication/modules/access/useChangePassword/constants.tsOops! Something went wrong! :( ESLint: 8.57.1 Error: Cannot read config file: /packages/authentication/.eslintrc.js
Tip ⚡🧪 Multi-step agentic review comment chat (experimental)
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
pt-tsl
force-pushed
the
BA-2364-change-password
branch
3 times, most recently
from
7198523 to
af76b46
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/design-system/components/native/inputs/TextInput/index.tsx (1)
42-44: Consider avoiding hard-coded padding values.While the comments explain the rationale for subtracting 12px, hard-coding this value creates a potential maintenance issue if the padding changes in the future.
- // Had to do this adjustment to the error container width because the error text was overflowing the container - // The 12px subtraction is to account for the padding of the error container - <View style={[styles.errorContainer, { width: errorContainerWidth - 12 }]}> + // Adjust width to account for the error container's horizontal padding + <View style={[styles.errorContainer, { width: errorContainerWidth - (styles.errorContainer.paddingHorizontal * 2 || 12) }]}>Alternatively, if the padding is defined elsewhere and not accessible here:
+ // Define padding constant at the top of the file + const ERROR_CONTAINER_PADDING = 12; ... - // Had to do this adjustment to the error container width because the error text was overflowing the container - // The 12px subtraction is to account for the padding of the error container - <View style={[styles.errorContainer, { width: errorContainerWidth - 12 }]}> + // Adjust width to account for the error container's horizontal padding + <View style={[styles.errorContainer, { width: errorContainerWidth - ERROR_CONTAINER_PADDING }]}>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
packages/design-system/components/native/inputs/TextInput/index.tsx(3 hunks)packages/design-system/components/native/inputs/TextInput/styles.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/design-system/components/native/inputs/TextInput/styles.ts
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Component Test Packages
🔇 Additional comments (4)
packages/design-system/components/native/inputs/TextInput/index.tsx (4)
4-4: Good addition for handling layout events.The import of
LayoutChangeEventfrom 'react-native' is necessary for the new layout measurement functionality. This is a clean approach to enable dynamic width calculations.
18-18: LGTM: State for dynamic width management.Adding a state variable to track the error container width helps ensure that error messages display properly without overflowing. The initial value of 0 is appropriate as it will be updated after the first layout measurement.
21-24: Clean implementation of layout handling.The
onLayoutfunction follows React Native best practices for capturing and responding to component dimensions. This is a good approach to dynamically measure the container width.
33-33: Good use of onLayout event.Adding the
onLayoutprop to the container View ensures that width measurements are captured whenever the layout changes, which supports responsive design.
pt-tsl
force-pushed
the
BA-2364-change-password
branch
from
af76b46 to
de369b0
Compare
pt-tsl
force-pushed
the
BA-2364-change-password
branch
from
de369b0 to
4b91e05
Compare
|
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (3)
packages/authentication/modules/access/useChangePassword/__tests__/useChangePassword.test.tsx (3)
166-215: Good addition of token-based test suite.The new test suite for token-based password changes properly verifies that the refactored hook maintains backward compatibility with the expired password flow, which is an important part of the refactoring strategy.
Consider adding additional test cases to ensure all edge cases are covered for the token flow, such as error scenarios and validation issues, similar to the main test suite.
176-177: Consider enhancing the test comment for clarity.While the comment explains that this test ensures the token-based flow has the same behavior, it would be helpful to be more specific about what aspects of the behavior should remain the same.
- // This is just to ensure that running with token has the same behavior as running without token + // This test ensures that the success callback is properly executed when using a token for expired passwords, + // maintaining backward compatibility with the previous implementation
166-215: Consider reducing duplication between test suites.There's significant duplication in setup and assertions between the two test suites. Consider extracting common testing utilities or using beforeEach hooks to reduce repetition.
For example, you could extract a common test function:
const testHookBehavior = ( options: { url: string; password: string; token?: string; mockResponse?: Record<string, any>; } ) => { const { url, password, token, mockResponse = {} } = options; const currentPassword = '1234'; test('should run onSuccess', async () => { mockFetch(url, { method: 'POST', status: 200, response: { currentPassword, newPassword: password, ...(token && { token }), ...mockResponse, }, }); let hasOnSuccessRan = false; const { result } = renderHook( () => useChangePassword({ ...(token && { token }), defaultValues: { currentPassword, newPassword: password, confirmNewPassword: password, }, options: { onSuccess: () => { hasOnSuccessRan = true; }, }, }), { wrapper: ComponentWithProviders, }, ); await result.current.form.handleSubmit(); expect(hasOnSuccessRan).toBe(true); }); };Then use it in each describe block:
describe('useChangePassword', () => { // ... setup code ... testHookBehavior({ url: changePasswordUrl, password, }); // ... other tests ... }); describe('useChangePassword with token for expired passwords', () => { // ... setup code ... testHookBehavior({ url: changePasswordUrl, password, token, }); });
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
packages/authentication/modules/access/index.ts(1 hunks)packages/authentication/modules/access/useChangePassword/__tests__/useChangePassword.test.tsx(6 hunks)packages/authentication/modules/access/useChangePassword/constants.ts(2 hunks)packages/authentication/modules/access/useChangePassword/index.ts(4 hunks)packages/authentication/modules/access/useChangePassword/types.ts(1 hunks)packages/authentication/services/auth.ts(2 hunks)packages/authentication/types/auth.ts(1 hunks)packages/design-system/components/native/icons/AlertTriangleIcon/index.tsx(1 hunks)packages/design-system/components/native/icons/index.ts(1 hunks)packages/design-system/components/native/inputs/TextInput/index.tsx(3 hunks)packages/design-system/components/native/inputs/TextInput/styles.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (10)
- packages/design-system/components/native/inputs/TextInput/styles.ts
- packages/design-system/components/native/icons/index.ts
- packages/design-system/components/native/icons/AlertTriangleIcon/index.tsx
- packages/authentication/modules/access/index.ts
- packages/authentication/modules/access/useChangePassword/constants.ts
- packages/design-system/components/native/inputs/TextInput/index.tsx
- packages/authentication/modules/access/useChangePassword/index.ts
- packages/authentication/types/auth.ts
- packages/authentication/services/auth.ts
- packages/authentication/modules/access/useChangePassword/types.ts
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Component Test Packages
🔇 Additional comments (5)
packages/authentication/modules/access/useChangePassword/__tests__/useChangePassword.test.tsx (5)
10-15: Import and test suite renamed successfully.The renaming from
useChangeExpiredPasswordtouseChangePasswordand updating the API endpoint reflect the move to a more general password change implementation, which aligns with the PR objectives for implementing the password change feature within Login & Security settings.
36-47: Hook implementation updated correctly.The hook usage has been successfully updated in this test case to use the new
useChangePasswordhook with the appropriate parameters, maintaining the expected behavior while making it more flexible for different scenarios.
66-77: Error case testing maintained.The error handling test has been properly updated to use the new hook name while preserving the same functionality, ensuring that error conditions are still properly handled after the refactor.
100-111: Password mismatch validation test preserved.The test for validation when passwords don't match has been correctly updated to use the new hook name while maintaining the same functionality, which is crucial for the password change feature.
146-154: Custom validation support preserved.The test verifying support for custom validation schemas has been properly updated to use the new hook name, ensuring that this flexibility is maintained in the refactored implementation.
Acceptance Criteria
Guardrails
Although the flow in Figma shows a modal asking the user if they want to end all current sessions, we have to check if that functionality was already built by PORG.
So for now just update the password without showing the modal.
Design Link: https://www.figma.com/design/z5ZdVlKEMmGIX4GVnjwfxA/BaseApp---NATIVE?node-id=6046-17914&t=ZYZocuoVLM11VrtX-0
Approvd
https://app.approvd.io/silverlogic/BA/stories/39018
Summary by CodeRabbit