refactor: added validation and fixed acces permission reset issues

[khushiiagrawal]

Description

Fixes two issues in the Add User form:

• The backend (backend/utils/validation.go) enforces len(password) >= 5 and returns “password must be at least 5 characters long.” The frontend now surfaces that exact details message via the Axios interceptor and user-management flow instead of the generic “Invalid password.”

• When Administrator Access is toggled off, per the expected behavior, every component permission is cleared (set to null) so the user can reselect read/write; previously the radios stayed stuck on “write” after toggling back.

Related Issue

Fixes #2133

Changes Made

• Updated Axios response interceptor to prioritize response.data.details over generic error messages for better error visibility
• Fixed admin toggle behavior to reset all permissions to null when Administrator Access is disabled
• Refactored permission state management to support nullable permission values (PermissionValue = 'read' | 'write' | null)
• Fixed TypeScript null safety issue in user search filter when permissions contain null values
• Optimized handlePermissionChange callback to check for unchanged permissions before object operations
• Removed inline error display from UserFormModal (errors now shown via toast notifications only, as requested)
• Added helper functions extractApiErrorMessage and sanitizePermissions for better error handling and permission management

Screenshots or Logs (if applicable)

Screen.Recording.2025-11-19.at.2.31.27.PM.mov

Checklist

• I have reviewed the project's contribution guidelines.
• I have tested the changes locally and ensured they work as expected.
• I have written unit tests for the changes (if applicable)
• I have updated the documentation (if applicable)
• My code follows the project's coding standards.

[kubestellar-prow]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please assign kunal-511 for approval. For more information see the Kubernetes Code Review Process.

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[kubestellar-prow]

Hi @khushiiagrawal. Thanks for your PR.

I'm waiting for a kubestellar member to verify that this patch is reasonable to test. If it is, they should reply with /ok-to-test on its own line. Until that is done, I will not automatically test new commits in this PR, but the usual testing commands by org members will still work. Regular contributors should join the org to skip this step.

Once the patch is verified, the new status will be reflected by the ok-to-test label.

I understand the commands that are listed here.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

[clubanderson]

instead of waiting for someone to click 'add user' - why not indicate, below the password entry, that the password is not long enough? Don't give a toast message - it's too late. Give it while the person is adding a password and needs guidance.

[Copilot]

Pull Request Overview

This PR addresses two key issues in the Add User form: improving password validation error messaging by surfacing backend details messages, and fixing the administrator access toggle to properly reset permissions to an unselected state when toggled off. The changes introduce nullable permission values and refactor error handling.

Key Changes:

• Enhanced Axios error interceptor to prioritize backend details field for more specific error messages
• Refactored permission state to support nullable values, allowing proper reset when admin toggle is disabled
• Added helper functions for API error extraction and permission sanitization

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 3 comments.

File	Description
frontend/src/lib/api.ts	Updated Axios response interceptor to prioritize details field in error responses
frontend/src/components/admin/UserTypes.ts	Added PermissionValue type with null support and updated type definitions
frontend/src/components/admin/UserManagement.tsx	Added error extraction and permission sanitization helpers; updated error handling and permission state management
frontend/src/components/admin/UserFormModal.tsx	Fixed admin toggle to reset permissions to null; removed inline error display

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[khushiiagrawal]

instead of waiting for someone to click 'add user' - why not indicate, below the password entry, that the password is not long enough? Don't give a toast message - it's too late. Give it while the person is adding a password and needs guidance.

sure. should i do the same for the "user name already taken" toast or keep it like the toast ?

[clubanderson]

yeah - no toast for either of these - dynamic response is better - less frustrating I think - what do you think?

[khushiiagrawal]

yeah - no toast for either of these - dynamic response is better - less frustrating I think - what do you think?

agree. it will be a better way to increase the user experience.
thanks!

[khushiiagrawal]

@clubanderson @MAVRICK-1 PTAL

Screen.Recording.2025-11-20.at.12.03.03.AM.mov

[MAVRICK-1]

Will check at EOD

[btwshivam]

@khushiiagrawal there is missing formError prop in UserFormModal props (runtime mismatch)
also userManagement now passes formError={formError ?? undefined} to UserFormModal, but I cannot find formError added to UserFormModalProps in UserTypes.ts??

[btwshivam]

2nd validatePassword returns null for empty password unconditionally fix it

[btwshivam]

@khushiiagrawal 3rd Username uniqueness checking is case-sensitive make it normalized soo ADMIN or admin shoud be treated same

[btwshivam]

any updates..?

[khushiiagrawal]

any updates..?

@btwshivam I have made all the requested changes, now the validation is as it should be. Also added trim fun so that it doesn't take spaces. Improved the UI of the "Edit user" card.
Thanks, PTAL.

[Arpit529Srivastava]

/ok-to-test

[Arpit529Srivastava]

/lgtm

[kubestellar-prow]

LGTM label has been added.

Details

Git tree hash: ed53545f39eb3f0afc9af90104a7409235ce50a7

[btwshivam]

@khushiiagrawal Do NOT trim password inputs while typing... Either:
remove trimming in onChange and only validate length or
ttrim on blur/submit if you intentionally want to normalize (but be explicit and document it)

[btwshivam]

why you hardcoded the validateUsername and validatePassword return messages like 'Username is already taken', 'Password must be at least 5 characters long', and the "Password length is valid" ???
uses i18n

[btwshivam]

ahh too many issuess.. dont just vibe code check also what you are doing...

[btwshivam]

UserManagement passes formError to UserFormModal: formError={formError ?? undefined}. In UserFormModal the former top-of-form motion.div that rendered formError was removed! why?? Either reintroduce formError rendering in UserFormModal or remove passing the prop.

[btwshivam]

from where you imported ficheck icon?? i cant see any

[khushiiagrawal]

it is there in line 9th

[khushiiagrawal]

PTAL /cc @btwshivam

Screen.Recording.2025-12-09.at.3.16.56.AM.mov

[khushiiagrawal]

@khushiiagrawal Do NOT trim password inputs while typing... Either: remove trimming in onChange and only validate length or ttrim on blur/submit if you intentionally want to normalize (but be explicit and document it)

@btwshivam Could you please clarify how exactly you want the password field to behave regarding spaces while typing and validation? I just want to make sure I implement it as expected.
Thanks!

[khushiiagrawal]

@btwshivam PTAL and let me know what is the requirement here so that i can proceed.
appreciate your time.