Conversation
WalkthroughThe changes introduce a new Node.js script for exporting Figma icons, update related npm scripts, and revise documentation with instructions for updating icons. The pre-commit hook is enhanced by adding a new step, and the cleanup script for TypeScript artifacts is simplified using the Changes
Sequence Diagram(s)sequenceDiagram
participant Dev as Developer
participant PreCommit as Pre-commit Hook
participant Lint as lint-staged
participant TSRef as auto:ts:references
participant TSCheck as auto:typecheck
Dev->>PreCommit: git commit
PreCommit->>Lint: npm run lint-staged
Lint-->>PreCommit: done
PreCommit->>TSRef: npm run auto:ts:references
TSRef-->>PreCommit: done
PreCommit->>TSCheck: npm run auto:typecheck
TSCheck-->>PreCommit: done
sequenceDiagram
participant Dev as Developer
participant Script as figma-export-env.js
participant Env as .env.local
participant Figma as Figma API
participant FS as File System
participant Prettier as Prettier
Dev->>Script: npm run figma:export-env
Script->>Env: Read FIGMA_TOKEN
alt Token found
Script->>FS: Remove src/figma-icons
Script->>Figma: Export icons using token
Figma-->>Script: Icons exported
Script->>Prettier: Format src/figma-icons
else Token missing
Script-->>Dev: Log error and exit
end
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes 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. 🔧 ESLint
npm error Exit handler never called! Note ⚡️ Unit Test Generation is now available in beta!Learn more here, or try it out under "Finishing Touches" below. ✨ Finishing Touches
🧪 Generate unit tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
😭 Deploy PR Preview d33f322 failed. Build logs
🤖 By surge-preview |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (5)
.husky/pre-commit(1 hunks)README.md(2 hunks)package.json(2 hunks)packages/default-icons/figma-export-env.js(1 hunks)packages/default-icons/package.json(1 hunks)
🧰 Additional context used
🪛 LanguageTool
README.md
[grammar] ~21-~21: Use correct spacing
Context: ... running local dev server ### Updating icons Icons used across packages are sourced f...
(QB_NEW_EN_OTHER_ERROR_IDS_5)
[grammar] ~23-~23: There might be a mistake here.
Context: ...ourced from Figma. To export the latest icons: 1. Navigate to packages/default-icons. 2...
(QB_NEW_EN_OTHER)
[grammar] ~27-~27: Use correct spacing
Context: ...npm run figma:export-env if you saved the token in a .env.local file). After exporti...
(QB_NEW_EN_OTHER_ERROR_IDS_5)
[grammar] ~28-~28: Use correct spacing
Context: ...ou saved the token in a .env.local file). After exporting icons, run `npm run buil...
(QB_NEW_EN_OTHER_ERROR_IDS_5)
[grammar] ~30-~30: Use correct spacing
Context: ...n npm run build to regenerate package bundles. ## Setup ### Package management To add de...
(QB_NEW_EN_OTHER_ERROR_IDS_5)
[grammar] ~117-~117: There might be a mistake here.
Context: ...ent major version 2. Change the version num from vN to vN+1 in lerna.json and...
(QB_NEW_EN_OTHER)
[grammar] ~117-~117: Use articles correctly
Context: ...nge the version num from vN to vN+1 in lerna.json and `.github/workflows/dep...
(QB_NEW_EN_OTHER_ERROR_IDS_11)
[grammar] ~117-~117: There might be a mistake here.
Context: ...sonand.github/workflows/deploy.ymlfiles 3. Push the branch 4. Runnpm run release`...
(QB_NEW_EN_OTHER)
🔇 Additional comments (7)
package.json (2)
27-27: Excellent cross-platform improvement using rimraf.The replacement of the complex
findcommand withrimrafimproves cross-platform compatibility and readability. The change from&to&&ensures proper sequential execution, only running the TypeScript clean command if the directory removal succeeds.
121-122: Proper dependency addition for the rimraf usage.The rimraf dev dependency is correctly added to support the updated
ts:cleanscript. The version ^5.0.5 appears to be a recent stable version..husky/pre-commit (1)
4-4: Logical improvement to the pre-commit workflow.Adding
auto:ts:referencesbetween linting and type checking ensures TypeScript project references are current before type checking runs. This prevents potential false positive type errors due to stale references in a monorepo setup.packages/default-icons/figma-export-env.js (1)
1-28: Excellent refactoring from shell commands to Node.js script.This script successfully consolidates the Figma export logic into a maintainable, cross-platform Node.js solution. The token handling is secure, and the overall structure is clean and logical.
packages/default-icons/package.json (1)
17-17: Clean simplification by delegating to the dedicated script.The replacement of the complex inline shell command with a simple Node.js script call improves maintainability and cross-platform compatibility. This aligns perfectly with the new
figma-export-env.jsscript.README.md (2)
21-30: Excellent documentation addition for icon management.The new "Updating icons" section provides clear, step-by-step instructions for exporting icons from Figma. The documentation is well-structured and includes appropriate cross-references to detailed setup instructions.
117-117: Good catch on the typo fix.Correcting "leran.json" to "lerna.json" improves the accuracy of the documentation.
| function getToken() { | ||
| if (process.env.FIGMA_TOKEN) return process.env.FIGMA_TOKEN; | ||
| const envPath = path.resolve('.env.local'); | ||
| if (existsSync(envPath)) { | ||
| const content = readFileSync(envPath, 'utf8'); | ||
| const match = content.match(/^FIGMA_TOKEN=(.*)$/m); | ||
| if (match) return match[1].trim(); | ||
| } | ||
| return null; | ||
| } |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Improve regex pattern for environment variable parsing.
The current regex pattern /^FIGMA_TOKEN=(.*)$/m could be more robust. It doesn't handle quoted values or potential whitespace around the equals sign.
Consider this more robust pattern:
- const match = content.match(/^FIGMA_TOKEN=(.*)$/m);
+ const match = content.match(/^FIGMA_TOKEN\s*=\s*(.*)$/m);Or even better, handle quoted values:
- const match = content.match(/^FIGMA_TOKEN=(.*)$/m);
- if (match) return match[1].trim();
+ const match = content.match(/^FIGMA_TOKEN\s*=\s*(.*)$/m);
+ if (match) {
+ const value = match[1].trim();
+ return value.replace(/^["']|["']$/g, ''); // Remove surrounding quotes
+ }📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function getToken() { | |
| if (process.env.FIGMA_TOKEN) return process.env.FIGMA_TOKEN; | |
| const envPath = path.resolve('.env.local'); | |
| if (existsSync(envPath)) { | |
| const content = readFileSync(envPath, 'utf8'); | |
| const match = content.match(/^FIGMA_TOKEN=(.*)$/m); | |
| if (match) return match[1].trim(); | |
| } | |
| return null; | |
| } | |
| function getToken() { | |
| if (process.env.FIGMA_TOKEN) return process.env.FIGMA_TOKEN; | |
| const envPath = path.resolve('.env.local'); | |
| if (existsSync(envPath)) { | |
| const content = readFileSync(envPath, 'utf8'); | |
| - const match = content.match(/^FIGMA_TOKEN=(.*)$/m); | |
| - if (match) return match[1].trim(); | |
| + const match = content.match(/^FIGMA_TOKEN\s*=\s*(.*)$/m); | |
| + if (match) { | |
| + const value = match[1].trim(); | |
| + return value.replace(/^["']|["']$/g, ''); // Remove surrounding quotes | |
| + } | |
| } | |
| return null; | |
| } |
🤖 Prompt for AI Agents
In packages/default-icons/figma-export-env.js around lines 5 to 14, the regex
used to parse the FIGMA_TOKEN from the .env.local file is too simplistic and
does not handle cases with quotes or whitespace around the equals sign. Update
the regex pattern to allow optional whitespace around the equals sign and to
correctly capture values enclosed in single or double quotes, trimming any
surrounding whitespace or quotes from the captured token before returning it.
| rmSync('src/figma-icons', { recursive: true, force: true }); | ||
| execSync('figma-export use-config .figmaexportrc.cjs', { | ||
| stdio: 'inherit', | ||
| env: { ...process.env, FIGMA_TOKEN: token }, | ||
| }); | ||
| execSync('prettier --write src/figma-icons/*', { stdio: 'inherit' }); |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Consider adding error handling for external commands.
While the script handles missing tokens well, it doesn't handle potential failures of the figma-export or prettier commands. Consider wrapping the execSync calls in try-catch blocks for better error reporting.
-execSync('figma-export use-config .figmaexportrc.cjs', {
- stdio: 'inherit',
- env: { ...process.env, FIGMA_TOKEN: token },
-});
-execSync('prettier --write src/figma-icons/*', { stdio: 'inherit' });
+try {
+ execSync('figma-export use-config .figmaexportrc.cjs', {
+ stdio: 'inherit',
+ env: { ...process.env, FIGMA_TOKEN: token },
+ });
+ execSync('prettier --write src/figma-icons/*', { stdio: 'inherit' });
+} catch (error) {
+ console.error('Export failed:', error.message);
+ process.exit(1);
+}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| rmSync('src/figma-icons', { recursive: true, force: true }); | |
| execSync('figma-export use-config .figmaexportrc.cjs', { | |
| stdio: 'inherit', | |
| env: { ...process.env, FIGMA_TOKEN: token }, | |
| }); | |
| execSync('prettier --write src/figma-icons/*', { stdio: 'inherit' }); | |
| rmSync('src/figma-icons', { recursive: true, force: true }); | |
| try { | |
| execSync('figma-export use-config .figmaexportrc.cjs', { | |
| stdio: 'inherit', | |
| env: { ...process.env, FIGMA_TOKEN: token }, | |
| }); | |
| execSync('prettier --write src/figma-icons/*', { stdio: 'inherit' }); | |
| } catch (error) { | |
| console.error('Export failed:', error.message); | |
| process.exit(1); | |
| } |
🤖 Prompt for AI Agents
In packages/default-icons/figma-export-env.js around lines 22 to 27, the
execSync calls for running external commands lack error handling. Wrap each
execSync call in a try-catch block to catch any exceptions thrown during
execution, and log or handle the errors appropriately to improve error reporting
and prevent silent failures.
1 participant
Summary
lerna.jsontypo in release docsfigma:export-envscriptTesting
npm testnpm run auto:linthttps://chatgpt.com/codex/tasks/task_e_68822756d3e8832fb50ac8d28ed0ff10
Summary by CodeRabbit