Fix read-only access UI controls for Studio sync provider #3643
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Problem
When using the Studio sync provider with read-only access, several UI elements remained incorrectly enabled, allowing users to attempt write operations that would fail. This created a poor user experience where users could interact with controls that shouldn't be accessible.
Specifically, the following elements were not properly checking the
editProhibitedflag:Solution
Added comprehensive
editProhibitedchecks across all relevant UI components to ensure proper read-only enforcement:Token Sets
TokenSetListItemContent.tsxwherecanDeletewas using OR (||) instead of AND (&&)editProhibitedcheck tocanDuplicatepropTheme Management
ManageThemesModal.tsxSingleThemeEntry.tsxThemeListGroupHeader.tsxUser Feedback
editProhibitedis trueStorage Layer
canWrite()method toTokensStudioTokenStoragefor consistency with other storage providers (GitHub, GitLab, etc.)Testing
Notes
The Tokens Studio GraphQL API doesn't currently expose permission information upfront (unlike GitHub/GitLab). The
canWrite()method returnstrueoptimistically, with write operations failing gracefully when permissions are insufficient. This implementation ensures the UI properly respects theeditProhibitedflag whenever it's set, regardless of how that state is determined.Fixes #[issue-number]
Original prompt
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.