feat(spx-gui): add username modification to profile editing

[aofei]

Add a two-step username modification flow to profile editing.

• Add ModifyUsernameModal with validation for allowed characters, length limit, and duplicate usernames via getUser
• Reuse a shared ModificationWarningModal for username and project rename impact warnings
• Extract the username field in EditProfileModal into a dedicated component while keeping profile form orchestration in the parent
• Update the current user route after a username change while preserving the active path suffix, query, and hash
• Add username to UpdateSignedInUserParams and to the API spec PATCH /user request body
• Cache username in userState and add a dedicated useModifySignedInUsername helper to invalidate old and new username query keys

[aofei]

我们其实还没限制过 username 的长度，因为后端认为直接从 idp 那边拿的 username 都是可信的，所以就没加任何校验逻辑

感觉还是要限制一下，我先按照跟 project name 相同的长度来了，不过对 username 来说可能不太合理，我在纠结多少合适

[gemini-code-assist]

Summary of Changes

This pull request introduces the capability for users to modify their usernames, enhancing user account management. It establishes a robust and user-friendly workflow for this sensitive operation, ensuring data integrity through comprehensive validation and consistent application state. The changes streamline the user experience by providing clear warnings about the impacts of a username change and dynamically updating relevant parts of the application, such as routing and cached user data.

Highlights

• Username Modification Flow: Implemented a two-step username modification process within the profile editing modal, including a dedicated input field, validation for allowed characters, length limits, and uniqueness checks against existing users.
• Generic Warning Modal: Refactored the project name modification warning modal into a reusable ModificationWarningModal component, now utilized for both project name and username changes to provide consistent user advisories.
• API and Data Model Enhancements: Extended the PATCH /user API specification and the UpdateSignedInUserParams type to support username updates, enabling backend processing of username changes.
• Client-Side State and Routing Management: Introduced caching for the signed-in user's username in the application state, added logic to decode usernames from access tokens, and implemented dynamic routing updates to reflect username changes in the URL while preserving path suffixes, queries, and hashes.
• Query Invalidation Strategy: Developed a useModifySignedInUsername helper that invalidates both the old and new username query keys in the cache, ensuring data consistency across the application after a username change.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog

• docs/openapi.yaml
  • Added 'username' as an optional property to the request body schema for the 'PATCH /user' endpoint.
• spx-gui/src/apis/user.ts
  • Updated the UpdateSignedInUserParams type to include 'username'.
• spx-gui/src/components/common/ModificationWarningModal.vue
  • Renamed ProjectModifyNameWarningModal.vue to ModificationWarningModal.vue and refactored it into a generic, reusable warning modal component.
  • Updated component props to accept dynamic title, tip, items, confirm text, and radar metadata.
• spx-gui/src/components/community/user/EditProfileModal.vue
  • Imported EditProfileUsernameField component.
  • Added handleUsernameModified function to emit updated user data after a username change.
  • Integrated EditProfileUsernameField into the profile form.
• spx-gui/src/components/community/user/EditProfileUsernameField.vue
  • Added a new component to display the current username and a 'Modify' button, orchestrating the username modification flow.
• spx-gui/src/components/community/user/ModifyUsernameModal.vue
  • Added a new modal component for entering and validating a new username.
  • Implemented client-side validation for username format, length, and uniqueness.
• spx-gui/src/components/community/user/UserHeader.vue
  • Imported useRoute and useRouter for route manipulation.
  • Added replaceCurrentUserRoute function to update the URL after a username change.
  • Modified handleEditProfile to trigger the username modification flow and handle route replacement.
• spx-gui/src/components/community/user/index.ts
  • Added useModifyUsername hook to manage the two-step username modification process using ModificationWarningModal and ModifyUsernameModal.
• spx-gui/src/components/project/index.ts
  • Updated useModifyProjectName to utilize the new generic ModificationWarningModal.
• spx-gui/src/stores/user/signed-in.ts
  • Added username property to the userState reactive object for caching.
  • Implemented decodeUsernameFromAccessToken to extract username from JWTs.
  • Updated handleTokenResponse, signInWithAccessToken, and signOut to manage the cached username.
  • Modified getSignedInUsername to prioritize the cached username.
  • Updated useSignedInUser to cache the username upon successful retrieval.
  • Refactored useUpdateSignedInUser to invalidate relevant query keys.
  • Added useModifySignedInUsername hook to handle username updates and invalidate both old and new username query keys.

Activity

• gemini-code-assist[bot] provided an initial summary of changes and a detailed changelog.
• gemini-code-assist[bot] raised multiple security concerns regarding prompt injection vulnerabilities related to project.displayName in various contexts (Copilot context, tool execution results).
• gemini-code-assist[bot] suggested a UX improvement for the username modification flow, recommending that the 'Edit Profile' modal close immediately after a successful username change to avoid confusion.
• aofei (author) requested a summary and review from the bot.
• aofei (author) commented on the lack of username length restrictions from the backend and debated appropriate length limits, noting current implementation aligns with project name length.

[xgopilot]

Clean two-step flow with good separation of concerns. The ModificationWarningModal refactor is a nice generalization. A few issues worth addressing before merge:

• EditProfileModal: emitting resolved inside handleUsernameModified can race with the profile form's own submit if the modal is clicked during its close animation; also silently discards in-progress display-name/description edits.
• ModifyUsernameModal: the async username availability check has no stale-response guard and no conflict-error handling on submit.
• signed-in.ts: the old ['user', oldUsername, 'signed-in'] cache key is not explicitly invalidated after a rename, leaving a ~60s stale window.
• openapi.yaml: the username field inherits an unconstrained schema — maxLength and pattern should be declared.

[Copilot]

Pull request overview

Adds a two-step username modification flow to the profile editing experience in spx-gui, including a shared warning modal and associated state/cache updates.

Changes:

• Introduces a reusable ModificationWarningModal and wires it into project rename + username modification flows.
• Adds username modification UI (warning step + input/validation modal) and integrates it into EditProfileModal.
• Extends user store/API/OpenAPI to support updating and caching username, plus query invalidation for old/new usernames.

Reviewed changes

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

Show a summary per file

File	Description
spx-gui/src/stores/user/signed-in.ts	Cache username in user state; add helper to modify username and invalidate old/new user query keys.
spx-gui/src/components/project/index.ts	Switch project rename warning to shared ModificationWarningModal with configurable content.
spx-gui/src/components/community/user/index.ts	Add useModifyUsername hook to run warning step then open username modification modal.
spx-gui/src/components/community/user/UserHeader.vue	After edit flow completes, replace current route when username changes (preserving suffix/query/hash).
spx-gui/src/components/community/user/ModifyUsernameModal.vue	New modal to validate and submit username changes (format/length/dup-check).
spx-gui/src/components/community/user/EditProfileUsernameField.vue	Extract username field into a dedicated component that triggers the modify flow.
spx-gui/src/components/community/user/EditProfileModal.vue	Embed the extracted username field into profile editing modal.
spx-gui/src/components/common/ModificationWarningModal.vue	Generalize warning modal props for reuse across different modification flows.
spx-gui/src/apis/user.ts	Extend UpdateSignedInUserParams to allow username updates.
docs/openapi.yaml	Add username to PATCH /user request body schema.

---

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

You can also share your feedback on Copilot code review. Take the survey.

[gemini-code-assist]

Code Review

This pull request introduces a feature to modify usernames within the profile editing section. The implementation includes a two-step modification flow with a warning modal, validation for the new username, and updates to the API and frontend state management.

The refactoring of the warning modal into a reusable component is a good improvement. The logic for updating the URL after a username change and for managing cache invalidation is also well-handled.

I've identified a potential data loss issue in the profile edit modal and a point for improving user experience and code simplification in the username modification modal. My comments provide specific suggestions to address these points.