Refactored the Settings page (DRAFT) need feedback #2509
Closed
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- add a new settings webview using React, TypeScript, Vite, and Fluent UI - implement basic two-column layout for settings navigation and content - set up communication between the extension and settings webview 🔧 chore(build): integrate settings webview build process - add new build script for settings webview - update package script to build webview before package - configure knip to include settings webview 🐛 fix(commands): add command to open settings webview - add new command `roo-cline.openSettingsWebview` to open the new settings webview - update menu to include new command
- implement settings webview using react and fluentui - add esbuild configs for building the settings webview - add vscode api typings
- add general, permissions, and about settings - add placeholder settings for other categories - render settings based on selected category - add background color to webview
- add general, permissions, and about settings - add placeholder settings for other categories - render settings based on selected category - add background color to webview
- correct vscode api initialization for webview context - switch to MemoryRouter to fix routing issues within the webview - ensure image base URI is correctly passed to the webview
|
…mburn/refactor/settings/001
|
This looks great! Ideally we could open this by just clicking the settings button rather than Ctrl+Shift+P |
-Migrated from Fluent UI React to Tailwind CSS for improved customization and VS Code theme consistency. -【package.json】 -- Removed `@fluentui/react-components` dependency. -- Added `class-variance-authority`, `clsx`, and `tailwind-merge` dependencies. -- Added `autoprefixer`, `postcss`, and `tailwindcss` as dev dependencies. -【postcss.config.js】 -- Added new file for PostCSS configuration with Tailwind and Autoprefixer. -【tailwind.config.js】 -- Added new file for Tailwind CSS configuration, including VS Code theme colors. -【src/App.tsx】 -- Removed FluentProvider and theme logic. -- Updated styles to use Tailwind CSS classes for VS Code theme integration. -【src/components/*】 -- Replaced Fluent UI components with standard HTML elements styled with Tailwind CSS. -- Removed Fluent UI specific styling (e.g., makeStyles, shorthands, tokens). -【src/index.css】 -- Added Tailwind base, components, and utilities imports. -【src/utils/tailwind.ts】 -- Added utility for conditional class names with Tailwind.
Contributor
Author
|
correct, at the moment I split it out as I need to test the settings being
updated and emitted to the backend to store.
Regards,
B.Ramburn BSc (Hons) LLM MCIArb
Snr. Quantity Surveyor & Director at Icelabz
…On Tue, 15 Apr 2025 at 16:39, nickchomey ***@***.***> wrote:
This looks great! Ideally we could open this by just clicking the settings
button rather than Ctrl+Shift+P
—
Reply to this email directly, view it on GitHub
<#2509 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ACUTT3PHE5KHJQ3LUWDQJFD2ZUR4RAVCNFSM6AAAAAB27JSMV2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDQMBWGM3TCOJXGQ>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
*nickchomey* left a comment (RooCodeInc/Roo-Code#2509)
<#2509 (comment)>
This looks great! Ideally we could open this by just clicking the settings
button rather than Ctrl+Shift+P
—
Reply to this email directly, view it on GitHub
<#2509 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ACUTT3PHE5KHJQ3LUWDQJFD2ZUR4RAVCNFSM6AAAAAB27JSMV2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDQMBWGM3TCOJXGQ>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
|
…mburn/refactor/settings/001
- migrate from Fluent UI to Tailwind CSS for a lighter and more customizable UI - add heroicons for settings categories - implement a new SettingsSettings component for general app settings - improve classname handling with tailwind-merge - add vscode theme support - add a header with title and buttons - add a new dev command to start settings webview 📦 build(settings-webview): update dependencies and build process - update dependencies in package.json - add a new dev command to start settings webview - update build command to include settings-webview - updated copy script to include settings webview files ✅ test(settings-webview): update tests for Tailwind CSS - update tests to reflect the new tailwind css implementation - update tests to reflect the new heroicons implementation 🔧 chore(.vscode): add dev settings task and update watch task - add a new task to watch settings webview changes - update watch task to include settings webview - set up background process to check settings webview server 📝 docs(settings-webview): update README.md with Tailwind CSS info - update README.md to reflect changes to tailwind css
hannesrudolph
moved this from PR [Pre Approval Review]
to PR [Draft/WIP]
in Roo Code Roadmap
Member
|
Hey @bramburn, |
github-project-automation
bot
moved this from PR [Draft/WIP]
to Done
in Roo Code Roadmap
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
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.
Context
Because things are getting out of hand in the taskpane
https://www.youtube.com/watch?v=FMSjLmB2ejs
Implementation
use Ctrl + shift + p then select roo code settings for now
Screenshots
How to Test
Ctrl + shift + p for opening the settings page
Get in Touch