Skip to content

Conversation

@tculig
Copy link
Contributor

@tculig tculig commented Feb 5, 2026

Description

Ticket: https://jira.mongodb.org/browse/VSCODE-727

Base Monaco readonly implementation
image

Checklist

Motivation and Context

  • Bugfix
  • New feature
  • Dependency update
  • Misc

Open Questions

Dependents

Types of changes

  • Backport Needed
  • Patch (non-breaking change which fixes an issue)
  • Minor (non-breaking change which adds functionality)
  • Major (fix or feature that would cause existing functionality to change)

@tculig tculig requested a review from lerouxb February 5, 2026 22:53
@tculig tculig marked this pull request as ready for review February 5, 2026 22:53
@tculig tculig requested a review from a team as a code owner February 5, 2026 22:53
@tculig tculig requested a review from lerouxb February 9, 2026 11:19
return 'hc-black';
case vscode.ColorThemeKind.Dark:
default:
return 'vs-dark';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

super nit, feel free to ignore, but I'm wondering if we should just do some kind of substring checks for things like light/dark, etc

We could then at least have a test that lists all the known themes that ship with vscode, loop through them and see which one we pick:

Image

I wonder where they store those groupings. Some metadata we have access to perhaps? Because somehow vscode itself knows to group everything under light, dark or high contrast 🤔

Anyway. Not necessary for this PR.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

its definitely a rabbit hole...I'd leave if for last if we have the time TBH.

themeColors?: TokenColors;
themeKind: MonacoBaseTheme;
}
const monacoWrapperStyles = css({
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are you sure this is necessary? I just removed it now and don't see the white boxes. Wasn't it something else that hid them?

I checked because this is just moving it to a specific spot, not seeing anything that actually hides it.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for me, if I remove this, the white box flashes on first load, but then disappears...looks janky.

}, [themeColors]);

useEffect(() => {
if (monaco) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tiniest style nit, but if the whole function body is contained inside one if I'd just if (!monaco) { return; } at the top so that the nesting is less and it is easier to read. ie. no one then has to scan to find the closing curly bracket.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

totally agree, will update for the next PR.

Copy link
Contributor

@lerouxb lerouxb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good work! Let's get it in and iterate on top of it.

@tculig tculig merged commit df71f00 into mongodb-js:main Feb 9, 2026
13 of 15 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants