refactor(renderer): normalize static shell file organization#130
Conversation
Reviewer's guide (collapsed on small PRs)Reviewer's GuideRefactors the renderer’s static shell layout by moving index.html and styles into scoped renderer/public and renderer/styles directories, updating all paths and references (Electron main, Tailwind config/CLI, QA screenshot server, and asset links) and documenting the structure in the README. Sequence diagram for QA screenshot server static file handling after refactorsequenceDiagram
actor QAEngineer
participant Script as capture-ui-screenshot.js
participant Playwright as Playwright browser
participant StaticServer
participant FileSystem
QAEngineer ->> Script: run npm run qa:screenshot
Script ->> StaticServer: start server with routes
Script ->> Playwright: launch Chromium and open /
Playwright ->> StaticServer: GET /
StaticServer ->> FileSystem: read src/renderer/public/index.html
FileSystem -->> StaticServer: index.html contents
StaticServer -->> Playwright: 200 index.html
Playwright ->> StaticServer: GET /dist/renderer/output.css
StaticServer ->> FileSystem: read dist/renderer/output.css
FileSystem -->> StaticServer: output.css contents
StaticServer -->> Playwright: 200 output.css
Playwright ->> StaticServer: GET /dist/renderer/bundle.js
StaticServer ->> FileSystem: read dist/renderer/bundle.js
FileSystem -->> StaticServer: bundle.js contents
StaticServer -->> Playwright: 200 bundle.js
Playwright ->> StaticServer: GET /assets/icon.png
StaticServer ->> FileSystem: read src/assets/icon.png
FileSystem -->> StaticServer: icon.png
StaticServer -->> Playwright: 200 icon.png
Playwright ->> Script: rendered page ready
Script ->> Playwright: capture screenshot
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
📝 WalkthroughWalkthroughThe PR reorganizes the renderer structure by moving Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
🧪 Generate unit tests (beta)
No actionable comments were generated in the recent review. 🎉 🧹 Recent nitpick comments
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 OpenGrep (1.16.0)package.json┌──────────────┐ �[32m✔�[39m �[1mOpengrep OSS�[0m �[1m Loading rules from local config...�[0m scripts/capture-ui-screenshot.js┌──────────────┐ �[32m✔�[39m �[1mOpengrep OSS�[0m �[1m Loading rules from local config...�[0m src/main/index.ts┌──────────────┐ �[32m✔�[39m �[1mOpengrep OSS�[0m �[1m Loading rules from local config...�[0m
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Review Summary by QodoOrganize renderer static files into scoped folders
WalkthroughsDescription• Move renderer static files into organized scoped folders - index.html moved to src/renderer/public/ - styles.css moved to src/renderer/styles/ • Update all runtime and build references to new file paths - Main process renderer index path - Tailwind configuration content paths - QA screenshot static server routes - CSS build script input paths • Adjust asset links and stylesheet config paths for new structure • Add renderer folder structure documentation to README Diagramflowchart LR
A["Renderer Files<br/>Reorganization"] --> B["Move to<br/>public/ & styles/"]
B --> C["Update Path<br/>References"]
C --> D["Main Process"]
C --> E["Tailwind Config"]
C --> F["QA Screenshot"]
C --> G["CSS Build Scripts"]
B --> H["Adjust Asset<br/>Links"]
A --> I["Document<br/>Structure"]
File Changes1. src/main/index.ts
|
Summary of ChangesHello @Mehdi-Bl, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request refactors the renderer's static file organization by relocating core files like Highlights
🧠 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
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hey - I've left some high level feedback:
- Both
src/main/index.tsandscripts/capture-ui-screenshot.jshardcode the rendererindex.htmlpath separately; consider centralizing this path in a shared config/module to avoid future drift when the structure changes again. - The relative
href/srcpaths inpublic/index.htmlnow depend on an extra../level; if you expect more structure changes, you might want to switch to a more resilient pattern (e.g., root-relative or injected asset base paths) to reduce the chance of breakage.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- Both `src/main/index.ts` and `scripts/capture-ui-screenshot.js` hardcode the renderer `index.html` path separately; consider centralizing this path in a shared config/module to avoid future drift when the structure changes again.
- The relative `href`/`src` paths in `public/index.html` now depend on an extra `../` level; if you expect more structure changes, you might want to switch to a more resilient pattern (e.g., root-relative or injected asset base paths) to reduce the chance of breakage.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
Dependency Review✅ No vulnerabilities or license issues found.Scanned FilesNone |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
The refactoring successfully normalizes the renderer's static file organization by moving the HTML shell and stylesheet into scoped directories. All build and runtime references have been updated accordingly. However, moving index.html to a deeper directory level (public/) changes the base URL for relative paths in the renderer, which breaks existing asset links in React components that were not updated in this PR.
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>AI Code Fusion</title> | ||
| <link rel="stylesheet" href="../../dist/renderer/output.css" /> | ||
| <link rel="stylesheet" href="../../../dist/renderer/output.css" /> |
There was a problem hiding this comment.
Moving index.html to src/renderer/public/ changes the base path for relative URLs resolved by the browser. This breaks the application icon link in src/renderer/components/App.tsx (line 83), which currently uses src='../assets/icon.png'.
Since the HTML shell is now one level deeper, that path should be updated to ../../assets/icon.png in App.tsx to correctly point to src/assets/icon.png when running in Electron. Please verify if other components use similar relative paths to assets.
Code Review by Qodo
1. Sonar excludes wrong CSS
|
|
1 participant
Summary
src/renderer/public/index.htmlsrc/renderer/styles/styles.cssmainload file path, Tailwind input/content, QA screenshot static server)index.htmlasset links and moved stylesheet@config/@sourcepathsREADME.mdBacklog
Validation
npm run lintnpm test -- --runInBandnpm run qa:screenshotmake sonarSummary by Sourcery
Normalize renderer static shell file organization and update references to the new locations.
Enhancements:
Summary by CodeRabbit
Documentation
Chores