-
Notifications
You must be signed in to change notification settings - Fork 518
feat: Add internal builtin tools (read_file, list_files) with compact shimmer rendering #1872
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
…invite parameters during redirects, and rename tool call ID generation.
…direction with SPA navigation.
…em from user-facing lists.
WalkthroughAdds a new internal built-in tool "list_files" with backend ReflyService support, registration in agent toolsets, frontend internal renderers, i18n strings, and documentation updates to expose canvas-scoped file listing. Changes
Sequence Diagram(s)sequenceDiagram
actor User
participant Frontend
participant Agent as BuiltinListFiles (Agent)
participant Refly as ReflyService
participant Drive as DriveService
User->>Frontend: Request file list (agent action)
Frontend->>Agent: Invoke BuiltinListFiles tool
Agent->>Refly: reflyService.listFiles(user, canvasId)
Refly->>Drive: listDriveFiles({ canvasId, scope: 'present' })
Drive-->>Refly: [{ fileId, fileName, type }, ...]
Refly-->>Agent: returns file array
Agent-->>Frontend: Tool result (files)
Frontend->>Frontend: Render via ListFilesRenderer / InternalToolRenderer
Frontend-->>User: Display file list (shimmer if executing)
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~35 minutes
Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
🧹 Nitpick comments (6)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx (1)
10-20: Wrap withReact.memoto prevent unnecessary re-renders.Per coding guidelines, pure components should be wrapped with
React.memo. This component renders the same output for the same props.Apply this diff:
-export const ListFilesRenderer: React.FC<InternalToolRendererProps> = ({ toolCallStatus }) => { +export const ListFilesRenderer: React.FC<InternalToolRendererProps> = React.memo(({ toolCallStatus }) => { const { t } = useTranslation(); const isExecuting = toolCallStatus === ToolCallStatus.EXECUTING; const label = t('components.markdown.internalTool.listFiles'); return ( <div className="flex items-center gap-1 py-1 px-3 text-sm"> <span className={isExecuting ? 'text-shimmer' : 'text-refly-text-0'}>{label}</span> </div> ); -}; +}); + +ListFilesRenderer.displayName = 'ListFilesRenderer';packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx (1)
21-31: Wrap withReact.memoto prevent unnecessary re-renders.
InternalToolRendereris a pure component that should be memoized per coding guidelines.Apply this diff:
-export const InternalToolRenderer: React.FC<InternalToolRendererMainProps> = (props) => { +export const InternalToolRenderer: React.FC<InternalToolRendererMainProps> = React.memo((props) => { const { toolsetKey, toolsetName, ...rest } = props; const Renderer = internalToolRenderers[toolsetKey]; if (Renderer) { return <Renderer toolsetKey={toolsetKey} {...rest} />; } // Fallback for unknown internal tools return <DefaultInternalRenderer toolsetKey={toolsetKey} toolsetName={toolsetName} {...rest} />; -}; +}); + +InternalToolRenderer.displayName = 'InternalToolRenderer';packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx (1)
18-22: Consider adding fallback UI for edge cases.While the component is simple, it could benefit from validation or fallback behavior when
toolsetNameis empty or undefined to prevent rendering empty or misleading content.Example enhancement:
return ( <div className="flex items-center gap-1 py-1 px-3 text-sm"> <span className={isExecuting ? 'text-shimmer' : 'text-refly-text-0'}> {toolsetName || 'Unknown Tool'} </span> </div> );Based on learnings and coding guidelines for **/*.{jsx,tsx}.
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (3)
18-23: Use useMemo for fileName computation to avoid repeated lookups.The fileName extraction involves multiple property accesses and should be memoized to optimize performance.
Apply this diff to use useMemo:
- // Try to get fileName from parameters first, then from result - const fileName = (parametersContent?.fileName || - parametersContent?.fileId || - resultContent?.fileName || - resultContent?.name || - '') as string; + // Try to get fileName from parameters first, then from result + const fileName = React.useMemo( + () => + (parametersContent?.fileName || + parametersContent?.fileId || + resultContent?.fileName || + resultContent?.name || + '') as string, + [parametersContent, resultContent] + );As per coding guidelines for **/*.{jsx,tsx}.
31-31: Simplify className and conditionally render the span.The nested span has unnecessary curly braces around the className string literal and is rendered even when empty.
Apply this diff for cleaner code:
{label} - <span className={'text-refly-text-3'}>{fileName && `: ${fileName}`}</span> + {fileName && <span className="text-refly-text-3">: {fileName}</span>}This removes the unnecessary curly braces and only renders the span when fileName exists.
27-34: Consider adding fallback UI for translation or rendering failures.While the component uses optional chaining, adding error handling for translation failures or unexpected data structures would improve robustness.
Example enhancement with error boundary or try-catch for translation:
const label = t('components.markdown.internalTool.readFile', { defaultValue: 'Reading' });Or wrap the component usage with an Error Boundary at a higher level.
Based on learnings and coding guidelines for **/*.{jsx,tsx}.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (16)
apps/api/src/modules/skill/skill-engine.service.ts(1 hunks)apps/api/src/modules/skill/skill.service.ts(1 hunks)apps/api/src/modules/tool/tool.service.ts(3 hunks)packages/agent-tools/src/builtin/index.ts(9 hunks)packages/agent-tools/src/builtin/interface.ts(1 hunks)packages/agent-tools/src/inventory.ts(2 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.scss(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsx(3 hunks)packages/i18n/src/en-US/ui.ts(1 hunks)packages/i18n/src/zh-Hans/ui.ts(1 hunks)packages/skill-template/src/prompts/node-agent.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (24)
**/*.{js,ts,jsx,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{js,ts,jsx,tsx}: Always use optional chaining (?.) when accessing object properties
Always use nullish coalescing (??) or default values for potentially undefined values
Always check array existence before using array methods
Always validate object properties before destructuring
Always use single quotes for string literals in JavaScript/TypeScript code
**/*.{js,ts,jsx,tsx}: Use semicolons at the end of statements
Include spaces around operators (e.g.,a + binstead ofa+b)
Always use curly braces for control statements
Place opening braces on the same line as their statement
**/*.{js,ts,jsx,tsx}: Group import statements in order: React/framework libraries, third-party libraries, internal modules, relative path imports, type imports, style imports
Sort imports alphabetically within each import group
Leave a blank line between import groups
Extract complex logic into custom hooks
Use functional updates for state (e.g.,setCount(prev => prev + 1))
Split complex state into multiple state variables rather than single large objects
Use useReducer for complex state logic instead of multiple useState calls
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,ts,tsx,jsx,py,java,cpp,c,cs,rb,go,rs,php,swift,kt,scala,r,m,mm,sql}
📄 CodeRabbit inference engine (.cursor/rules/00-language-priority.mdc)
**/*.{js,ts,tsx,jsx,py,java,cpp,c,cs,rb,go,rs,php,swift,kt,scala,r,m,mm,sql}: All code comments MUST be written in English
All variable names, function names, class names, and other identifiers MUST use English words
Comments should be concise and explain 'why' rather than 'what'
Use proper grammar and punctuation in comments
Keep comments up-to-date when code changes
Document complex logic, edge cases, and important implementation details
Use clear, descriptive names that indicate purpose
Avoid abbreviations unless they are universally understood
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,ts,tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/00-language-priority.mdc)
Use JSDoc style comments for functions and classes in JavaScript/TypeScript
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/01-code-style.mdc)
**/*.{js,jsx,ts,tsx}: Use single quotes for string literals in TypeScript/JavaScript
Always use optional chaining (?.) when accessing object properties in TypeScript/JavaScript
Always use nullish coalescing (??) or default values for potentially undefined values in TypeScript/JavaScript
Always check array existence before using array methods in TypeScript/JavaScript
Validate object properties before destructuring in TypeScript/JavaScript
Use ES6+ features like arrow functions, destructuring, and spread operators in TypeScript/JavaScript
Avoid magic numbers and strings - use named constants in TypeScript/JavaScript
Use async/await instead of raw promises for asynchronous code in TypeScript/JavaScript
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/03-typescript-guidelines.mdc)
**/*.{ts,tsx}: Avoid usinganytype whenever possible - useunknowntype instead with proper type guards
Always define explicit return types for functions, especially for public APIs
Prefer extending existing types over creating entirely new types
Use TypeScript utility types (Partial<T>,Pick<T, K>,Omit<T, K>,Readonly<T>,Record<K, T>) to derive new types
Use union types and intersection types to combine existing types
Always import types explicitly using theimport typesyntax
Group type imports separately from value imports
Minimize creating local type aliases for imported types
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,ts,jsx,tsx,css,json}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
Maximum line length of 100 characters
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,ts,jsx,tsx,css,json,yml,yaml}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
Use 2 spaces for indentation, no tabs
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{js,ts,jsx,tsx,css,json,yml,yaml,md}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
No trailing whitespace at the end of lines
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
apps/api/src/**/*.{controller,service}.ts
📄 CodeRabbit inference engine (.cursor/rules/06-api-structure.mdc)
Implement proper error handling in API modules
Files:
apps/api/src/modules/skill/skill.service.tsapps/api/src/modules/skill/skill-engine.service.tsapps/api/src/modules/tool/tool.service.ts
**/*.{css,scss,sass,less,js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/09-design-system.mdc)
**/*.{css,scss,sass,less,js,jsx,ts,tsx}: Primary color (#155EEF) should be used for main brand color in buttons, links, and accents
Error color (#F04438) should be used for error states and destructive actions
Success color (#12B76A) should be used for success states and confirmations
Warning color (#F79009) should be used for warnings and important notifications
Info color (#0BA5EC) should be used for informational elements
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.scsspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
**/*.{tsx,ts}: Use the translation wrapper component and useTranslation hook in components
Ensure all user-facing text is translatable
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{tsx,ts,json}
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
Support dynamic content with placeholders in translations
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{tsx,ts,jsx,js,vue,css,scss,less}
📄 CodeRabbit inference engine (.cursor/rules/11-ui-design-patterns.mdc)
**/*.{tsx,ts,jsx,js,vue,css,scss,less}: Use the primary blue (#155EEF) for main UI elements, CTAs, and active states
Use red (#F04438) only for errors, warnings, and destructive actions
Use green (#12B76A) for success states and confirmations
Use orange (#F79009) for warning states and important notifications
Use blue (#0BA5EC) for informational elements
Primary buttons should be solid with the primary color
Secondary buttons should have a border with transparent or light background
Danger buttons should use the error color
Use consistent padding, border radius, and hover states for all buttons
Follow fixed button sizes based on their importance and context
Use consistent border radius (rounded-lg) for all cards
Apply light shadows (shadow-sm) for card elevation
Maintain consistent padding inside cards (p-4orp-6)
Use subtle borders for card separation
Ensure proper spacing between card elements
Apply consistent styling to all form inputs
Use clear visual indicators for focus, hover, and error states in form elements
Apply proper spacing between elements using 8px, 16px, 24px increments
Ensure proper alignment of elements (left, center, or right)
Use responsive layouts that work across different device sizes
Maintain a minimum contrast ratio of 4.5:1 for text
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.scsspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{tsx,ts,jsx,js,vue}
📄 CodeRabbit inference engine (.cursor/rules/11-ui-design-patterns.mdc)
**/*.{tsx,ts,jsx,js,vue}: Include appropriate loading states for async actions in buttons
Group related form elements with appropriate spacing
Provide clear validation feedback for forms
Ensure proper labeling and accessibility for form elements
Ensure all interactive elements are keyboard accessible
Include appropriate ARIA attributes for complex components
Provide alternative text for images and icons
Support screen readers with semantic HTML elements
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursor/rules/08-contributing-guidelines.mdc)
**/*.{ts,tsx,js,jsx}: Follow the TypeScript/JavaScript style guidelines
Ensure code is well-tested and documented
Files:
apps/api/src/modules/skill/skill.service.tspackages/i18n/src/en-US/ui.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/agent-tools/src/inventory.tspackages/agent-tools/src/builtin/interface.tsapps/api/src/modules/skill/skill-engine.service.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/skill-template/src/prompts/node-agent.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/i18n/src/zh-Hans/ui.tsapps/api/src/modules/tool/tool.service.tspackages/agent-tools/src/builtin/index.ts
**/{i18n,locales,translations,lang}/**/*.{json,ts,tsx,js,jsx,properties}
📄 CodeRabbit inference engine (.cursor/rules/00-language-priority.mdc)
Use Chinese for all user-facing communication
Files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
packages/i18n/src/{en-US,zh-Hans}/**
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
Add new translation keys to both language files (en-US and zh-Hans)
Files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
packages/i18n/src/**
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
packages/i18n/src/**: Maintain consistency in translation key naming conventions
Use descriptive translation keys that reflect the content
Group related translation keys together in the translation file structure
Use namespaces for different sections of the application in translation keys
Follow a hierarchical structure for nested components in translation key organization
Files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{jsx,tsx}: Always use tailwind css to style the component
Always wrap pure components with React.memo to prevent unnecessary re-renders
Always use useMemo for expensive computations or complex object creation
Always use useCallback for function props to maintain referential equality
Always specify proper dependency arrays in useEffect to prevent infinite loops
Always avoid inline object/array creation in render to prevent unnecessary re-renders
Always use proper key props when rendering lists
Always split nested components with closures into separate components to avoid performance issues and improve code maintainability
**/*.{jsx,tsx}: Always wrap pure components with React.memo to prevent unnecessary re-renders
Always use useMemo for expensive computations or complex object creation in React
Always use useCallback for function props to maintain referential equality in React
Always specify proper dependency arrays in useEffect to prevent infinite loops in React
Always avoid inline object/array creation in render to prevent unnecessary re-renders in React
Always use proper key props when rendering lists in React (avoid using index when possible)
Always split nested components with closures into separate components in React
Use lazy loading for components that are not immediately needed in React
Debounce handlers for events that might fire rapidly (resize, scroll, input) in React
Implement fallback UI for components that might fail in React
Use error boundaries to catch and handle runtime errors in React
**/*.{jsx,tsx}: Place each attribute on a new line when a component has multiple attributes in JSX
Use self-closing tags for elements without children in JSX
Keep JSX expressions simple, extract complex logic to variables
Put closing brackets for multi-line JSX on a new line
**/*.{jsx,tsx}: Component file names should match the component name
Organize function components in order: imports, type definitions, constants, component function, hook calls, e...
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
**/*.{jsx,tsx,css}
📄 CodeRabbit inference engine (.cursor/rules/01-code-style.mdc)
**/*.{jsx,tsx,css}: Use Tailwind CSS for styling components
Follow the utility-first approach with Tailwind CSS
Group related utility classes together in Tailwind CSS
Prefer Tailwind utilities over custom CSS when possible
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
**/*.{jsx,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/05-code-organization.mdc)
Each component file should contain only one main component
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/05-code-organization.mdc)
Explicitly type props with interfaces or types in React components
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
**/*.{tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/08-contributing-guidelines.mdc)
Use React best practices for frontend code
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
**/index.{js,ts,jsx,tsx}
📄 CodeRabbit inference engine (.cursor/rules/05-code-organization.mdc)
Use index files to export multiple components from a directory
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/agent-tools/src/builtin/index.ts
🧠 Learnings (12)
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to packages/i18n/src/{en-US,zh-Hans}/** : Add new translation keys to both language files (en-US and zh-Hans)
Applied to files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to packages/i18n/src/** : Group related translation keys together in the translation file structure
Applied to files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to packages/i18n/src/** : Use descriptive translation keys that reflect the content
Applied to files:
packages/i18n/src/en-US/ui.ts
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to packages/i18n/src/** : Maintain consistency in translation key naming conventions
Applied to files:
packages/i18n/src/en-US/ui.ts
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to packages/i18n/src/** : Follow a hierarchical structure for nested components in translation key organization
Applied to files:
packages/i18n/src/en-US/ui.ts
📚 Learning: 2025-11-25T03:04:41.334Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/09-i18n-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:41.334Z
Learning: Applies to **/*.{tsx,ts} : Ensure all user-facing text is translatable
Applied to files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
📚 Learning: 2025-11-25T03:03:19.158Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/00-language-priority.mdc:0-0
Timestamp: 2025-11-25T03:03:19.158Z
Learning: Applies to **/{i18n,locales,translations,lang}/**/*.{json,ts,tsx,js,jsx,properties} : Use Chinese for all user-facing communication
Applied to files:
packages/i18n/src/en-US/ui.tspackages/i18n/src/zh-Hans/ui.ts
📚 Learning: 2025-11-25T03:04:21.098Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/07-extension-structure.mdc:0-0
Timestamp: 2025-11-25T03:04:21.098Z
Learning: Applies to apps/extension/src/i18n/**/*.{ts,tsx,js,jsx,json} : Translations and internationalization resources should be located in apps/extension/src/i18n directory
Applied to files:
packages/i18n/src/en-US/ui.ts
📚 Learning: 2025-11-25T03:04:05.715Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/05-code-organization.mdc:0-0
Timestamp: 2025-11-25T03:04:05.715Z
Learning: Applies to **/*.tsx : Explicitly type props with interfaces or types in React components
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.tspackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx
📚 Learning: 2025-11-25T03:03:31.945Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/01-code-style.mdc:0-0
Timestamp: 2025-11-25T03:03:31.945Z
Learning: Applies to **/*.{jsx,tsx} : Implement fallback UI for components that might fail in React
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
📚 Learning: 2025-11-26T05:04:26.523Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/08-contributing-guidelines.mdc:0-0
Timestamp: 2025-11-26T05:04:26.523Z
Learning: Applies to **/*.{tsx,jsx} : Use React best practices for frontend code
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx
📚 Learning: 2025-11-25T03:04:51.017Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/10-testing-guidelines.mdc:0-0
Timestamp: 2025-11-25T03:04:51.017Z
Learning: Applies to **/*.{test,spec}.{ts,tsx,js,jsx} : Test component rendering, interactions, prop handling, state changes, error states and edge cases in component tests
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx
🧬 Code graph analysis (9)
apps/api/src/modules/skill/skill.service.ts (3)
packages/openapi-schema/src/types.gen.ts (1)
GenericToolset(6983-7016)packages/request/src/requests/types.gen.ts (1)
GenericToolset(6922-6955)packages/ai-workspace-common/src/requests/types.gen.ts (1)
GenericToolset(6926-6959)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsx (1)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx (1)
InternalToolRenderer(21-31)
packages/agent-tools/src/inventory.ts (1)
packages/agent-tools/src/builtin/index.ts (2)
BuiltinListFilesDefinition(188-200)BuiltinListFilesToolset(916-919)
packages/agent-tools/src/builtin/interface.ts (1)
packages/openapi-schema/src/types.gen.ts (2)
User(474-483)DriveFile(7671-7740)
apps/api/src/modules/skill/skill-engine.service.ts (1)
apps/api/src/modules/tool/sandbox/wrapper/base.ts (1)
canvasId(200-202)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx (1)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts (1)
InternalToolRendererProps(6-11)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx (4)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts (2)
InternalToolRendererProps(6-11)InternalToolRendererMainProps(16-18)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (1)
ReadFileRenderer(10-35)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx (1)
ListFilesRenderer(10-20)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx (1)
DefaultInternalRenderer(12-23)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (1)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts (1)
InternalToolRendererProps(6-11)
apps/api/src/modules/tool/tool.service.ts (1)
packages/agent-tools/src/inventory.ts (1)
builtinToolsetInventory(39-78)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: build / Build
🔇 Additional comments (8)
packages/i18n/src/zh-Hans/ui.ts (1)
3330-3333: LGTM! Clean translation additions for internal tool labels.The new
internalTooltranslation keys are well-structured and appropriately localized:
readFile: '阅读'- Concise and clear for file reading operationslistFiles: '翻阅文件列表'- Natural Chinese phrasing that conveys browsing through a file listThe translations are properly grouped under
components.markdownand align with the parallel English translations mentioned in the AI summary. Based on learnings, this follows the guideline to add new translation keys to both language files.packages/i18n/src/en-US/ui.ts (1)
3233-3236: Translation keys properly added to both language files.The zh-Hans file has matching
internalToolkeys at the same structural path, with proper Chinese localizations:readFile: '阅读'andlistFiles: '翻阅文件列表'. The key naming convention and translation structure are consistent across both language files per coding guidelines.packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.scss (1)
1-23: LGTM!The shimmer animation is well-implemented with proper cross-browser compatibility via
-webkit-background-clip. Using custom CSS for this animation effect is appropriate since it's not achievable with standard Tailwind utilities.packages/ai-workspace-common/src/components/markdown/plugins/tool-call/render.tsx (2)
178-190: LGTM!The
resultContentParsedmemoization is correctly implemented with proper error handling and optional chaining for the nested data structure.
294-306: LGTM!The internal tool rendering branch cleanly handles the early return pattern with proper optional chaining on
toolsetDefinition?.internal.packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts (1)
1-18: LGTM!Type definitions are well-structured with proper JSDoc documentation, correct use of
Record<string, unknown>instead ofany, and appropriate optional marking forresultContent.packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/index.tsx (1)
12-15: LGTM!The registry pattern is clean and extensible for adding new internal tool renderers in the future.
packages/agent-tools/src/builtin/index.ts (1)
767-770: The optionalfileNamefield is utilized in the internal tool renderer.The
read-file-renderer.tsxdisplays the file name from this field in the tool execution UI. However, note that while the input parameter is accepted in the schema, the implementation returns the file name from the service result (file.name) rather than using the input parameter. The renderer handles this correctly by attempting to display thefileNameparameter first, then falling back toresult.name.
...ommon/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
Outdated
Show resolved
Hide resolved
...mon/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
♻️ Duplicate comments (2)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx (1)
12-24: Component is already properly memoized.The past review comment suggested wrapping with React.memo, which has been correctly implemented using
memofrom React. The component includes adisplayNamefor better debugging, follows React best practices, and is correctly structured.packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (1)
10-35: Component is already properly memoized.The past review comment suggested wrapping with React.memo, which has been correctly implemented using
memofrom React. The component includes adisplayNameand follows the established pattern for internal tool renderers.
🧹 Nitpick comments (2)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (2)
16-20: Consider adding type validation before casting to string.The code casts values from
Record<string, unknown>directly tostringwithout runtime validation. If any of these properties contain non-string values (numbers, objects, etc.), this could lead to unexpected rendering behavior.🔎 Apply this diff to add type-safe string conversion:
- const fileName = (parametersContent?.fileName || - parametersContent?.fileId || - resultContent?.fileName || - resultContent?.name || - '') as string; + const fileName = String( + parametersContent?.fileName || + parametersContent?.fileId || + resultContent?.fileName || + resultContent?.name || + '' + );Alternatively, for stricter type checking:
+ const getStringValue = (value: unknown): string => { + return typeof value === 'string' ? value : ''; + }; + - const fileName = (parametersContent?.fileName || - parametersContent?.fileId || - resultContent?.fileName || - resultContent?.name || - '') as string; + const fileName = + getStringValue(parametersContent?.fileName) || + getStringValue(parametersContent?.fileId) || + getStringValue(resultContent?.fileName) || + getStringValue(resultContent?.name) || + '';As per coding guidelines for **/*.{ts,tsx}, avoid type assertions without proper type guards.
28-28: Remove unnecessary curly braces from static className.The
classNameuses curly braces around a static string literal, which is unnecessary and less idiomatic in JSX.🔎 Apply this diff for cleaner JSX syntax:
- <span className={'text-refly-text-3'}>{fileName && `: ${fileName}`}</span> + <span className="text-refly-text-3">{fileName && `: ${fileName}`}</span>
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx(1 hunks)packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/list-files-renderer.tsx
🧰 Additional context used
📓 Path-based instructions (19)
**/*.{jsx,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{jsx,tsx}: Always use tailwind css to style the component
Always wrap pure components with React.memo to prevent unnecessary re-renders
Always use useMemo for expensive computations or complex object creation
Always use useCallback for function props to maintain referential equality
Always specify proper dependency arrays in useEffect to prevent infinite loops
Always avoid inline object/array creation in render to prevent unnecessary re-renders
Always use proper key props when rendering lists
Always split nested components with closures into separate components to avoid performance issues and improve code maintainability
**/*.{jsx,tsx}: Always wrap pure components with React.memo to prevent unnecessary re-renders
Always use useMemo for expensive computations or complex object creation in React
Always use useCallback for function props to maintain referential equality in React
Always specify proper dependency arrays in useEffect to prevent infinite loops in React
Always avoid inline object/array creation in render to prevent unnecessary re-renders in React
Always use proper key props when rendering lists in React (avoid using index when possible)
Always split nested components with closures into separate components in React
Use lazy loading for components that are not immediately needed in React
Debounce handlers for events that might fire rapidly (resize, scroll, input) in React
Implement fallback UI for components that might fail in React
Use error boundaries to catch and handle runtime errors in React
**/*.{jsx,tsx}: Place each attribute on a new line when a component has multiple attributes in JSX
Use self-closing tags for elements without children in JSX
Keep JSX expressions simple, extract complex logic to variables
Put closing brackets for multi-line JSX on a new line
**/*.{jsx,tsx}: Component file names should match the component name
Organize function components in order: imports, type definitions, constants, component function, hook calls, e...
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,jsx,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{js,ts,jsx,tsx}: Always use optional chaining (?.) when accessing object properties
Always use nullish coalescing (??) or default values for potentially undefined values
Always check array existence before using array methods
Always validate object properties before destructuring
Always use single quotes for string literals in JavaScript/TypeScript code
**/*.{js,ts,jsx,tsx}: Use semicolons at the end of statements
Include spaces around operators (e.g.,a + binstead ofa+b)
Always use curly braces for control statements
Place opening braces on the same line as their statement
**/*.{js,ts,jsx,tsx}: Group import statements in order: React/framework libraries, third-party libraries, internal modules, relative path imports, type imports, style imports
Sort imports alphabetically within each import group
Leave a blank line between import groups
Extract complex logic into custom hooks
Use functional updates for state (e.g.,setCount(prev => prev + 1))
Split complex state into multiple state variables rather than single large objects
Use useReducer for complex state logic instead of multiple useState calls
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,tsx,jsx,py,java,cpp,c,cs,rb,go,rs,php,swift,kt,scala,r,m,mm,sql}
📄 CodeRabbit inference engine (.cursor/rules/00-language-priority.mdc)
**/*.{js,ts,tsx,jsx,py,java,cpp,c,cs,rb,go,rs,php,swift,kt,scala,r,m,mm,sql}: All code comments MUST be written in English
All variable names, function names, class names, and other identifiers MUST use English words
Comments should be concise and explain 'why' rather than 'what'
Use proper grammar and punctuation in comments
Keep comments up-to-date when code changes
Document complex logic, edge cases, and important implementation details
Use clear, descriptive names that indicate purpose
Avoid abbreviations unless they are universally understood
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/00-language-priority.mdc)
Use JSDoc style comments for functions and classes in JavaScript/TypeScript
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/01-code-style.mdc)
**/*.{js,jsx,ts,tsx}: Use single quotes for string literals in TypeScript/JavaScript
Always use optional chaining (?.) when accessing object properties in TypeScript/JavaScript
Always use nullish coalescing (??) or default values for potentially undefined values in TypeScript/JavaScript
Always check array existence before using array methods in TypeScript/JavaScript
Validate object properties before destructuring in TypeScript/JavaScript
Use ES6+ features like arrow functions, destructuring, and spread operators in TypeScript/JavaScript
Avoid magic numbers and strings - use named constants in TypeScript/JavaScript
Use async/await instead of raw promises for asynchronous code in TypeScript/JavaScript
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{jsx,tsx,css}
📄 CodeRabbit inference engine (.cursor/rules/01-code-style.mdc)
**/*.{jsx,tsx,css}: Use Tailwind CSS for styling components
Follow the utility-first approach with Tailwind CSS
Group related utility classes together in Tailwind CSS
Prefer Tailwind utilities over custom CSS when possible
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/03-typescript-guidelines.mdc)
**/*.{ts,tsx}: Avoid usinganytype whenever possible - useunknowntype instead with proper type guards
Always define explicit return types for functions, especially for public APIs
Prefer extending existing types over creating entirely new types
Use TypeScript utility types (Partial<T>,Pick<T, K>,Omit<T, K>,Readonly<T>,Record<K, T>) to derive new types
Use union types and intersection types to combine existing types
Always import types explicitly using theimport typesyntax
Group type imports separately from value imports
Minimize creating local type aliases for imported types
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,jsx,tsx,css,json}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
Maximum line length of 100 characters
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,jsx,tsx,css,json,yml,yaml}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
Use 2 spaces for indentation, no tabs
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{js,ts,jsx,tsx,css,json,yml,yaml,md}
📄 CodeRabbit inference engine (.cursor/rules/04-code-formatting.mdc)
No trailing whitespace at the end of lines
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{jsx,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/05-code-organization.mdc)
Each component file should contain only one main component
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/05-code-organization.mdc)
Explicitly type props with interfaces or types in React components
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{css,scss,sass,less,js,jsx,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/09-design-system.mdc)
**/*.{css,scss,sass,less,js,jsx,ts,tsx}: Primary color (#155EEF) should be used for main brand color in buttons, links, and accents
Error color (#F04438) should be used for error states and destructive actions
Success color (#12B76A) should be used for success states and confirmations
Warning color (#F79009) should be used for warnings and important notifications
Info color (#0BA5EC) should be used for informational elements
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
**/*.{tsx,ts}: Use the translation wrapper component and useTranslation hook in components
Ensure all user-facing text is translatable
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{tsx,ts,json}
📄 CodeRabbit inference engine (.cursor/rules/09-i18n-guidelines.mdc)
Support dynamic content with placeholders in translations
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{tsx,ts,jsx,js,vue,css,scss,less}
📄 CodeRabbit inference engine (.cursor/rules/11-ui-design-patterns.mdc)
**/*.{tsx,ts,jsx,js,vue,css,scss,less}: Use the primary blue (#155EEF) for main UI elements, CTAs, and active states
Use red (#F04438) only for errors, warnings, and destructive actions
Use green (#12B76A) for success states and confirmations
Use orange (#F79009) for warning states and important notifications
Use blue (#0BA5EC) for informational elements
Primary buttons should be solid with the primary color
Secondary buttons should have a border with transparent or light background
Danger buttons should use the error color
Use consistent padding, border radius, and hover states for all buttons
Follow fixed button sizes based on their importance and context
Use consistent border radius (rounded-lg) for all cards
Apply light shadows (shadow-sm) for card elevation
Maintain consistent padding inside cards (p-4orp-6)
Use subtle borders for card separation
Ensure proper spacing between card elements
Apply consistent styling to all form inputs
Use clear visual indicators for focus, hover, and error states in form elements
Apply proper spacing between elements using 8px, 16px, 24px increments
Ensure proper alignment of elements (left, center, or right)
Use responsive layouts that work across different device sizes
Maintain a minimum contrast ratio of 4.5:1 for text
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{tsx,ts,jsx,js,vue}
📄 CodeRabbit inference engine (.cursor/rules/11-ui-design-patterns.mdc)
**/*.{tsx,ts,jsx,js,vue}: Include appropriate loading states for async actions in buttons
Group related form elements with appropriate spacing
Provide clear validation feedback for forms
Ensure proper labeling and accessibility for form elements
Ensure all interactive elements are keyboard accessible
Include appropriate ARIA attributes for complex components
Provide alternative text for images and icons
Support screen readers with semantic HTML elements
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursor/rules/08-contributing-guidelines.mdc)
**/*.{ts,tsx,js,jsx}: Follow the TypeScript/JavaScript style guidelines
Ensure code is well-tested and documented
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
**/*.{tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/08-contributing-guidelines.mdc)
Use React best practices for frontend code
Files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
🧠 Learnings (10)
📚 Learning: 2025-11-25T03:02:45.779Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T03:02:45.779Z
Learning: Applies to **/*.{jsx,tsx} : Always wrap pure components with React.memo to prevent unnecessary re-renders
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:03:31.945Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/01-code-style.mdc:0-0
Timestamp: 2025-11-25T03:03:31.945Z
Learning: Applies to **/*.{jsx,tsx} : Always use useMemo for expensive computations or complex object creation in React
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:02:45.779Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T03:02:45.779Z
Learning: Applies to **/*.{jsx,tsx} : Always use useMemo for expensive computations or complex object creation
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:03:31.945Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/01-code-style.mdc:0-0
Timestamp: 2025-11-25T03:03:31.945Z
Learning: Applies to **/*.{jsx,tsx} : Always avoid inline object/array creation in render to prevent unnecessary re-renders in React
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:03:31.945Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/01-code-style.mdc:0-0
Timestamp: 2025-11-25T03:03:31.945Z
Learning: Applies to **/*.{jsx,tsx} : Always use useCallback for function props to maintain referential equality in React
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-26T05:04:26.523Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/08-contributing-guidelines.mdc:0-0
Timestamp: 2025-11-26T05:04:26.523Z
Learning: Applies to **/*.{tsx,jsx} : Use React best practices for frontend code
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:02:45.779Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T03:02:45.779Z
Learning: Applies to **/*.{jsx,tsx} : Always use useCallback for function props to maintain referential equality
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:02:45.779Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T03:02:45.779Z
Learning: Applies to **/*.{jsx,tsx} : Always avoid inline object/array creation in render to prevent unnecessary re-renders
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:02:45.779Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T03:02:45.779Z
Learning: Applies to **/*.{jsx,tsx} : Always split nested components with closures into separate components to avoid performance issues and improve code maintainability
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsxpackages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx
📚 Learning: 2025-11-25T03:03:31.945Z
Learnt from: CR
Repo: refly-ai/refly PR: 0
File: .cursor/rules/01-code-style.mdc:0-0
Timestamp: 2025-11-25T03:03:31.945Z
Learning: Applies to **/*.{jsx,tsx} : Implement fallback UI for components that might fail in React
Applied to files:
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/default-renderer.tsx
🧬 Code graph analysis (1)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/read-file-renderer.tsx (1)
packages/ai-workspace-common/src/components/markdown/plugins/tool-call/internal-tool-renderers/types.ts (1)
InternalToolRendererProps(6-11)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: build / Build
Summary
Add internal builtin tools (
read_file,list_files) that are auto-included but hidden from user selection, with compact shimmer rendering.Backend - Internal Tools:
internal: trueflag toToolsetDefinitionfor system-level toolsread_fileandlist_filesmarked as internal (hidden from mentionList)get_timeandexecute_coderemain user-selectablelist_filestool to list canvas files viaDriveServiceFrontend - Compact Rendering:
internal-tool-renderers/folder with modular component structurei18n:
readFileandlistFileslabels (zh-Hans, en-US)Prompts:
node-agent.tswithlist_filestool documentationImpact Areas
Checklist
dev/reformat(backend) andcd web && npx lint-staged(frontend) to appease the lint godsSummary by CodeRabbit
New Features
UI/UX Improvements
Internationalization
Documentation
✏️ Tip: You can customize this high-level summary in your review settings.