[Remove Vuetify from Studio] Change password form in Settings - Account

[MisRob]

🙂 Looking for an issue? Welcome! This issue is open for contribution. If this is the first time you’re requesting an issue, please:

• Read Contributing guidelines carefully. Pay extra attention to Using generative AI. Pull requests and comments that don’t follow the guidelines won’t be answered.
• Confirm that you’ve read the guidelines in your comment.

Sub-issue of #5060.

Complexity: Medium

Summary

Migrate Change password form in Settings > Account from Vuetify to Kolibri Design System.

ChangePasswordForm is built with the following Vuetify components:

• VForm
• PasswordField (built with VTextField)

To remove these dependencies:

• Replace PasswordField with KTextbox
• Remove VForm and re-implement form validation

How to get there

• Login as user@a.com with password a
• Go to Settings > Account
• Click Change password link

Guidance

• Read the project this issue is part of
• To implement form validation, search in our codebases for examples, e.g.:
  • shared/generateFormMixin
  • Kolibri's ChangeUserPasswordModal

Out of scope

• Do not refactor any other areas of the codebase
• Do not modify PasswordField

Expected UI/UX changes

• Minor visual differences naturally stemming from the use of KDS

Acceptance criteria

General

• The specification above is followed.
• Except for "Expected UI/UX changes," there are no functional or visual differences in user experience.
• All user interactions are manually tested with no regressions.
• Pull request includes screenshots.

a11y and i18n

See the project's "Guidance" for useful references.

• Implementation meets a11y standards
• All components are LTR and RTL compliant
• All user-facing strings are translated properly
• The notranslate class been added to elements that shouldn't be translated by Google Chrome's automatic translation feature (e.g. user-generated text)
• Mobile experience is reasonable

Unit tests

• If there is a unit test suite already, it is meaningfully updated (even if tests don't fail)
• If there is no unit test suite, a new one is created

[Jakoma02]

I have read the guidelines, and I would like to tackle this issue.

[rtibbles]

I have assigned you @Jakoma02 - thank you!