console
console copied to clipboard
refactor: misc optimizations and ux improvements to secrets editing
:mag: Overview
The current secrets editing experience has several and ux and implementation issues:
- Secret 'create' and 'edit' actions are done client-side and can be reviewed before deploy, but 'delete' actions are instantly applied to the server. This behavior is inconsistent and unintuitive
- The highlight coloring for secrets that have been edited is not informative enough. There is no distinction between new secrets and edited secrets, and only secret keys are colored
- The 'deploy' process is extremely inefficient:
- Each secret create or edit is an individual mutation
- Each mutation refetches secrets on completion
- The code to handle all these promises is unncessarily complex as a result
- There is no loading spinner when deploying a large number (5+) changes in a single action
:bulb: Proposed Changes
- Make secret deletes behave identically to edit and create actions, i.e client side first, and applied server-side only on clicking "deploy"
- Process all changes in a single "deploy" action together:
- Bulk create all new secrets
- Bulk edit all updated secrets
- Bulk delete all deleted secrets
- Refetch secrets from the server only once, after the bulk operation is complete
- Improve the UI indication of which secrets are created, edited or deleted before clicking "deploy"
- Add a loading spinner for the "deploy" action
:framed_picture: Screenshots or Demo
https://github.com/user-attachments/assets/7e7ba8b0-7041-470a-9112-9e4ea864bd84
:memo: Release Notes
- Several optimizations and UX improvements to editing and deploying secret changes
:dart: Reviewer Focus
- Verify that all secret crud operations are saved correctly
- Check that all secret updates are processed in a single mutation
:green_heart: Did You...
- [x] Ensure linting passes (code style checks)? ~~- [ ] Update dependencies and lockfiles (if required)~~
- [x] Regenerate graphql schema and types (if required)
- [x] Verify the app builds locally?
- [ ] Manually test the changes on different browsers/devices?