Add Change Password section to account settings
#2419
Conversation
|
All contributors have signed the CLA ✍️ ✅ |
|
I have read the CLA Document and I hereby sign the CLA |
|
Preview: https://2419--pr-cinny.netlify.app |
ajbura
left a comment
ajbura
left a comment
There was a problem hiding this comment.
Apart from the requested changes can we remove the inline comment added at various places as most of the changes are self explanatory and doesn't really need comment.
| Your password has been successfully changed. Your other devices may need to be | ||
| re-verified. |
There was a problem hiding this comment.
What is it mean to "other devices may need to be re-verified"?
|
|
||
| <Box direction="Column" gap="100"> | ||
| <Box alignItems="Center" gap="200"> | ||
| <input type="checkbox" id="logoutDevices" name="logoutDevices" defaultChecked /> |
There was a problem hiding this comment.
please use the Checkbox component from folds
| <Box alignItems="Center" gap="200"> | ||
| <input type="checkbox" id="logoutDevices" name="logoutDevices" defaultChecked /> | ||
| <Text as="label" htmlFor="logoutDevices" size="T300"> | ||
| Sign out all other devices |
There was a problem hiding this comment.
Cinny uses "Logout" instead of term "Signout" in all places.
| Recommended for security. Unchecking this may leave your other devices logged | ||
| in. |
There was a problem hiding this comment.
We can remove recommendation as it is already widely known, and set the default checkbox to true.
| <Box gap="200" justifyContent="End"> | ||
| <Button type="button" variant="Secondary" onClick={onCancel} disabled={isLoading}> | ||
| <Text as="span" size="B400"> | ||
| Cancel | ||
| </Text> | ||
| </Button> | ||
| <Button variant="Primary" type="submit" disabled={isLoading}> | ||
| {isLoading && <Spinner variant="Primary" size="300" />} | ||
| <Text as="span" size="B400"> | ||
| Change Password | ||
| </Text> | ||
| </Button> | ||
| </Box> |
There was a problem hiding this comment.
Cinny design language uses the "Column" layout for button. And we do not need the cancel button as dialog header already has the Cross button.
| * @param logoutDevices Whether to logout other devices (defaults to true for security) | ||
| * @returns Tuple with either auth data (for UIA continuation) or success response | ||
| */ | ||
| export const changePassword = async ( |
There was a problem hiding this comment.
As this function will not be reused at multiple places it is not counted as utility. We should just moved it to the same file it is used.
2 participants
Description
Implement change password component in Settings/Account. The component uses matrix-js-sdk's setpassword function, and completes the full authentication flow to set a new password. No new dependencies are needed.
Further changes might be necessary to properly match the visual style of Cinny, but I'm not great at frontend development.
Closes #2417
Type of change
Checklist: