-
Notifications
You must be signed in to change notification settings - Fork 32
Staging #358
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
base: main
Are you sure you want to change the base?
Conversation
Fix #342 fix canvas component
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThis pull request introduces a series of modifications across multiple components in the application, focusing on enhancing graph interactions, correcting function names, and improving state management. Key changes include expanding the Changes
Possibly related PRs
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (4)
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 (
|
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.
PR Summary
Hi! Looks like you've reached your API usage limit. You can increase it from your account settings page here: app.greptile.com/settings/billing/code-review
💡 (1/5) You can manually trigger the bot by mentioning @greptileai in a comment!
9 file(s) reviewed, no comment(s)
Edit PR Review Bot Settings | Greptile
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
🔭 Outside diff range comments (2)
app/components/graphView.tsx (1)
Line range hint
105-166
: Improve double-click detection implementation.The current implementation has potential issues:
- The double-click detection uses a fixed 1000ms threshold which might not match the system's double-click speed setting.
- The implementation doesn't handle the case where a user clicks different nodes within the threshold.
Consider this improved implementation:
-const lastClick = useRef<{ date: Date, name: string }>({ date: new Date(), name: "" }) +const lastClick = useRef<{ time: number, id: number }>({ time: 0, id: 0 }) -const isDoubleClick = now.getTime() - date.getTime() < 1000 && name === node.name +const isDoubleClick = (now.getTime() - lastClick.current.time < 500) && (lastClick.current.id === node.id) +lastClick.current = { time: now.getTime(), id: node.id }app/components/chat.tsx (1)
Line range hint
157-215
: Improve zoom functionality implementation.Several improvements can be made to the zoom functionality:
- The setTimeout with 0ms delay is unnecessary
- Magic numbers should be constants
- Add proper error handling for undefined chart
Apply these changes:
+const ZOOM_DURATION = 1000; +const ZOOM_PADDING = 150; const handleSetSelectedPath = (p: PathData) => { const chart = chartRef.current - if (!chart) return + if (!chart) { + console.warn('Chart reference is not available'); + return; + } // ... rest of the function ... - setTimeout(() => { - chart.zoomToFit(1000, 150, (n: NodeObject<Node>) => p.nodes.some(node => node.id === n.id)); - }, 0) + chart.zoomToFit(ZOOM_DURATION, ZOOM_PADDING, (n: NodeObject<Node>) => p.nodes.some(node => node.id === n.id)); }🧰 Tools
🪛 Biome (1.9.4)
[error] 163-163: Comparing to itself is potentially pointless.
(lint/suspicious/noSelfCompare)
🧹 Nitpick comments (5)
e2e/tests/chat.spec.ts (1)
113-113
: Remove unnecessary empty line within the loop.The empty line within the loop affects readability without adding value.
for (let i = 0; i < 3; i++) { await chat.sendMessage(Node_Question); const result = await chat.getTextInLastChatElement(); const number = result.match(/\d+/g)?.[0]!; responses.push(number); - }
app/components/model.ts (2)
179-215
: Add error handling for edge cases.While the node creation logic is sound, it would benefit from additional error handling for edge cases.
let source = this.nodesMap.get(edgeData.src_node) let target = this.nodesMap.get(edgeData.dest_node) + if (edgeData.src_node === undefined || edgeData.dest_node === undefined) { + console.warn('Invalid edge data: Missing source or destination node ID'); + return; + } if (!source) {
229-253
: Add documentation for curve calculation logic.The curve calculation logic is complex and would benefit from documentation explaining the mathematical reasoning.
Add a comment block explaining the curve calculation:
+ // Calculate curve values for graph edges: + // - For self-loops (start === end): + // - Even indices: negative values starting from -3 + // - Odd indices: positive values starting from 2 + // - For regular edges: + // - Even indices: negative values starting from 0 + // - Odd indices: positive values starting from 1 + // The final curve value is scaled by 0.1 to create subtle curves newElements.links.forEach(link => {e2e/logic/POM/codeGraph.ts (1)
284-285
: Consider removing redundant delay.The code waits for the loading image to be hidden and then adds an additional 2-second delay, which might be unnecessary.
Consider removing the redundant delay:
async getTextInLastChatElement(): Promise<string>{ await this.page.waitForSelector('img[alt="Waiting for response"]', { state: 'hidden' }); - await delay(2000); return (await this.lastElementInChat.textContent())!; }
app/components/chat.tsx (1)
Line range hint
272-313
: Extract common zoom functionality.The zoom logic is duplicated between
handleSetSelectedPath
andhandleSubmit
. Consider extracting it into a reusable function.Apply these changes:
+const ZOOM_DURATION = 1000; +const ZOOM_PADDING = 150; + +const zoomToNodes = (chart: ForceGraphMethods, nodes: any[]) => { + if (!chart) { + console.warn('Chart reference is not available'); + return; + } + chart.zoomToFit(ZOOM_DURATION, ZOOM_PADDING, (n: NodeObject<Node>) => + nodes.some(node => node.id === n.id) + ); +}; const handleSubmit = async () => { const chart = chartRef.current if (!chart) return // ... rest of the function ... - setTimeout(() => { - chart.zoomToFit(1000, 150, (n: NodeObject<Node>) => - formattedPaths.some(p => p.nodes.some(node => node.id === n.id)) - ); - }, 0) + zoomToNodes(chart, formattedPaths.flatMap(p => p.nodes)); } const handleSetSelectedPath = (p: PathData) => { // ... rest of the function ... - setTimeout(() => { - chart.zoomToFit(1000, 150, (n: NodeObject<Node>) => - p.nodes.some(node => node.id === n.id) - ); - }, 0) + zoomToNodes(chart, p.nodes); }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
app/components/chat.tsx
(9 hunks)app/components/code-graph.tsx
(5 hunks)app/components/elementMenu.tsx
(3 hunks)app/components/graphView.tsx
(5 hunks)app/components/model.ts
(3 hunks)app/page.tsx
(1 hunks)e2e/logic/POM/codeGraph.ts
(4 hunks)e2e/tests/canvas.spec.ts
(1 hunks)e2e/tests/chat.spec.ts
(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: build
- GitHub Check: test
- GitHub Check: test
🔇 Additional comments (11)
e2e/tests/chat.spec.ts (1)
120-121
: LGTM! Good test isolation.Moving the API calls inside the test scope improves test isolation and follows testing best practices.
app/components/elementMenu.tsx (1)
17-17
: LGTM! Consistent function naming.The typo fix from
handelExpand
tohandleExpand
is applied consistently across the component.Also applies to: 22-22, 71-71, 77-77, 117-117, 123-123
app/components/model.ts (1)
55-55
: LGTM! Safe default parameter.Adding a default value of 0 ensures the function always returns a valid color.
app/page.tsx (1)
284-284
: LGTM! Enhanced graph interaction.Adding the chartRef prop to the Chat component enables improved graph visualization capabilities.
e2e/tests/canvas.spec.ts (1)
46-46
: LGTM! Good improvement to test reliability.Adding
clickCenter()
before zoom operations ensures consistent test behavior by establishing a known starting position.app/components/graphView.tsx (2)
64-87
: Good implementation of responsive graph sizing.The resize observer implementation properly handles both window resizing and parent container changes. The cleanup in the
useEffect
hook correctly removes event listeners and disconnects the observer.
173-174
: LGTM! Proper usage of dynamic dimensions.Using state-managed dimensions ensures the graph properly responds to container size changes.
app/components/code-graph.tsx (1)
Line range hint
244-357
: LGTM! Good cleanup of handler names.The renaming from 'handel*' to 'handle*' improves code consistency and fixes typos.
e2e/logic/POM/codeGraph.ts (2)
155-157
: LGTM! Good addition of loading state locator.The new locator helps track loading states consistently across tests.
426-426
: Verify the impact of changing to right-click.The change from left-click to right-click for node selection might affect other tests that depend on this behavior.
Let's verify the impact:
✅ Verification successful
Right-click change appears safe to implement
The tests use the
nodeClick()
abstraction method rather than direct click events, focusing on outcomes rather than the click mechanism. The change from left to right click is an implementation detail that won't affect the test behavior as long as thenodeClick()
method maintains its core functionality of node selection.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Search for tests that might be affected by the click behavior change rg -l "nodeClick" "e2e/tests"Length of output: 87
Script:
#!/bin/bash # Check the content of test files for click-related code echo "=== canvas.spec.ts ===" rg -A 5 -B 5 "click" "e2e/tests/canvas.spec.ts" echo -e "\n=== nodeDetailsPanel.spec.ts ===" rg -A 5 -B 5 "click" "e2e/tests/nodeDetailsPanel.spec.ts"Length of output: 8469
app/components/chat.tsx (1)
110-110
: LGTM!The function signature has been correctly updated to include the new
chartRef
prop.
… handling and neighbor deletion logic. Updated deleteNeighbors function to handle expanded nodes correctly and replaced direct calls with handleExpand in GraphView for better clarity and maintainability.
…/lucide-react-0.486.0 Bump lucide-react from 0.475.0 to 0.486.0
Bumps [eslint-config-next](https://github.com/vercel/next.js/tree/HEAD/packages/eslint-config-next) from 15.2.1 to 15.2.4. - [Release notes](https://github.com/vercel/next.js/releases) - [Changelog](https://github.com/vercel/next.js/blob/canary/release.js) - [Commits](https://github.com/vercel/next.js/commits/v15.2.4/packages/eslint-config-next) --- updated-dependencies: - dependency-name: eslint-config-next dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]>
Bumps [autoprefixer](https://github.com/postcss/autoprefixer) from 10.4.20 to 10.4.21. - [Release notes](https://github.com/postcss/autoprefixer/releases) - [Changelog](https://github.com/postcss/autoprefixer/blob/main/CHANGELOG.md) - [Commits](postcss/autoprefixer@10.4.20...10.4.21) --- updated-dependencies: - dependency-name: autoprefixer dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]>
Bumps [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) from 22.13.10 to 22.13.14. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node) --- updated-dependencies: - dependency-name: "@types/node" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]>
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
🧹 Nitpick comments (3)
package.json (3)
23-23
: New Dependencies Added
New libraries—canvas2svg
(line 23),embla-carousel-react
(line 27),html2canvas
(line 28),react-json-tree
(line 36),tailwindcss-animate
(line 41), andvaul
(line 42)—have been added. Ensure these additions are documented, integrated correctly in relevant components, and tested for compatibility along with their bundle impacts and licensing requirements.Also applies to: 27-28, 36-36, 41-42
25-26
: Miscellaneous Dependency Upgrades
Several other dependencies have undergone version updates:
clsx
(line 25)d3
(line 26)lucide-react
(line 29)next
(line 30)react
&react-dom
(lines 32-33)react-force-graph-2d
(line 34)tailwind-merge
(line 40)Please double-check these updates to confirm that their API changes (if any) do not affect your current implementation.
Also applies to: 29-30, 32-34, 40-40
45-53
: DevDependencies Upgrades
The devDependencies have been updated, including:
@playwright/test
(line 45)@types/node
,@types/react
, and@types/react-dom
(lines 46-48)eslint
andeslint-config-next
(lines 50-51)tailwindcss
(line 52)typescript
(line 53)Verify that these updates align with your development workflow and that ESLint as well as TypeScript configurations remain consistent.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.json
is excluded by!**/package-lock.json
📒 Files selected for processing (1)
package.json
(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: test
- GitHub Check: test
🔇 Additional comments (1)
package.json (1)
12-20
: Radix UI Dependencies Upgrades
The versions for the Radix UI components (react-checkbox, react-dialog, react-dropdown-menu, react-hover-card, react-progress, react-select, react-slot, react-toast, and react-tooltip) have been updated as expected. Please verify that these upgraded versions are fully compatible with your codebase and that no unintended breaking changes have been introduced.
Update README.md
…/eslint-config-next-15.2.4 Bump eslint-config-next from 15.2.1 to 15.2.4
…/autoprefixer-10.4.21 Bump autoprefixer from 10.4.20 to 10.4.21
…/types/node-22.13.14 Bump @types/node from 22.13.10 to 22.13.14
Bumps [eslint](https://github.com/eslint/eslint) from 9.22.0 to 9.23.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](eslint/eslint@v9.22.0...v9.23.0) --- updated-dependencies: - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]>
…/eslint-9.23.0 Bump eslint from 9.22.0 to 9.23.0
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
🧹 Nitpick comments (4)
README.md (4)
1-3
: Inconsistent Heading Levels in Header
The file begins with an h1 header on line 1 followed by an h3 header on line 3. This creates an abrupt jump in hierarchy. Consider changing line 3 from an h3 to an h2 to establish a more consistent and incremental heading structure.-### Visualize your repository with our graph for code analysis +## Visualize your repository with our graph for code analysis🧰 Tools
🪛 markdownlint-cli2 (0.17.2)
3-3: Heading levels should only increment by one level at a time
Expected: h2; Actual: h3(MD001, heading-increment)
9-10
: Unclear Use of a Dash
The single dash on line 9 appears out of context and may be unintentionally left in the file. If it is not meant to serve as a divider or bullet marker, consider removing it to avoid confusion.
46-50
: Improve Environment Variable Formatting for Readability
The environment variables on lines 46–50 are combined using backslash continuations. Splitting them into separate export statements could improve readability and reduce the risk of errors when users copy and paste commands. For example:-export FALKORDB_HOST=localhost FALKORDB_PORT=6379 \ - OPENAI_API_KEY=<YOUR_OPENAI_API_KEY> SECRET_TOKEN=<YOUR_SECRET_TOKEN> \ - FLASK_RUN_HOST=0.0.0.0 FLASK_RUN_PORT=5000 +export FALKORDB_HOST=localhost +export FALKORDB_PORT=6379 +export OPENAI_API_KEY=<YOUR_OPENAI_API_KEY> +export SECRET_TOKEN=<YOUR_SECRET_TOKEN> +export FLASK_RUN_HOST=0.0.0.0 +export FLASK_RUN_PORT=5000
110-111
: Consider Adjusting Tone in Community Section
Line 111 ends with an exclamation mark. While enthusiasm is great, a single exclamation mark can sometimes be viewed as overly informal in documentation. Consider using a period instead if a more formal tone is desired.🧰 Tools
🪛 LanguageTool
[style] ~111-~111: Using many exclamation marks might seem excessive (in this case: 3 exclamation marks for a text that’s 1748 characters long)
Context: ...elpful, please consider giving it a star! Knowledge Graph, Code Analysis, Code V...(EN_EXCESSIVE_EXCLAMATION)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.json
is excluded by!**/package-lock.json
📒 Files selected for processing (2)
README.md
(1 hunks)package.json
(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- package.json
🧰 Additional context used
🪛 LanguageTool
README.md
[style] ~111-~111: Using many exclamation marks might seem excessive (in this case: 3 exclamation marks for a text that’s 1748 characters long)
Context: ...elpful, please consider giving it a star! Knowledge Graph, Code Analysis, Code V...
(EN_EXCESSIVE_EXCLAMATION)
🪛 markdownlint-cli2 (0.17.2)
README.md
3-3: Heading levels should only increment by one level at a time
Expected: h2; Actual: h3
(MD001, heading-increment)
5-5: Heading style
Expected: atx; Actual: setext
(MD003, heading-style)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: test
- GitHub Check: test
🔇 Additional comments (1)
README.md (1)
88-93
: Verify Curl Command Formatting
The curl command provided for processing a local repository is correctly formatted with line breaks. Just ensure that these line breaks are preserved when users copy the command into their terminals, as loss of the backslashes may cause issues.
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
🧹 Nitpick comments (6)
app/components/dataPanel.tsx (5)
14-34
: Remove duplicate 'isPathSelected' property.There's a duplicate entry for "isPathSelected" in the excludedProperties array.
- "isPath", "isPathSelected", "visible", "index", "curve", "__indexColor", - "isPathSelected", "__controlPoints",
39-40
: Consider using TypeScript type guards for better type safety.The current approach uses property presence to differentiate between
Node
andLink
types, but TypeScript type guards would provide better type safety.- const type = "category" in obj - const label = type ? `${obj.category}: ${obj.name}` : obj.label + const isNode = (obj: Node | Link): obj is Node => 'category' in obj; + const isLink = (obj: Node | Link): obj is Link => 'source' in obj && 'target' in obj; + + const label = isNode(obj) + ? `${obj.category}: ${obj.name}` + : obj.label;
59-73
: Consider parameterizing the syntax highlighter language.The language for SyntaxHighlighter is hardcoded as "python", which might not be appropriate for all source code types.
You could extract the language detection to a helper function:
+ const detectLanguage = (src: string) => { + // Simple language detection based on file extension or content + if (src.includes('def ') || src.includes('import ')) return 'python'; + if (src.includes('function') || src.includes('const ')) return 'javascript'; + // Add more language detection logic as needed + return 'plaintext'; + } { key === "src" ? <SyntaxHighlighter - language="python" + language={detectLanguage(value as string)} style={{ ...dark, hljs: {
95-113
: Maintain consistency in syntax highlighting approach.The same language hardcoding issue exists in the nested valueRenderer for JSONTree.
Apply the same language detection function here:
valueRenderer={(valueAsString, value, keyPath) => { if (keyPath === "src") { return <SyntaxHighlighter - language="python" + language={detectLanguage(value as string)} style={{
138-147
: Handle potential race condition in window opening.When opening a new tab and trying to scroll immediately, there's a potential race condition as the page might not have loaded yet.
Consider adding a delay or using a message passing approach if possible:
onClick={() => { const newTab = window.open(url, '_blank'); if (!obj.src_start || !obj.src_end || !newTab) return + // Add a small delay to ensure the page has loaded + setTimeout(() => { newTab.scroll({ top: obj.src_start, behavior: 'smooth' }) + }, 1000); }}app/api/repo/route.ts (1)
25-25
: Be mindful of returning raw error messages
Returning(err as Error).message
may inadvertently expose sensitive details. Consider sanitizing error content before sending it to end users.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
app/api/repo/route.ts
(2 hunks)app/components/dataPanel.tsx
(2 hunks)app/page.tsx
(7 hunks)
🧰 Additional context used
🧬 Code Definitions (3)
app/components/dataPanel.tsx (1)
app/components/model.ts (2)
Node
(20-31)Link
(33-43)
app/api/repo/route.ts (2)
app/api/repo/[graph]/neighbors/route.ts (1)
POST
(4-34)app/api/utils.ts (1)
getEnvVariables
(1-12)
app/page.tsx (7)
app/components/model.ts (3)
Node
(20-31)Link
(33-43)Labels
(102-104)lib/utils.ts (4)
PathNode
(12-15)Message
(31-36)handleZoomToFit
(44-75)cn
(40-42)app/components/code-graph.tsx (1)
CodeGraph
(47-394)app/components/chat.tsx (1)
Chat
(54-454)app/components/toolbar.tsx (1)
Toolbar
(11-59)app/components/Input.tsx (1)
Input
(18-226)app/components/labels.tsx (1)
Labels
(6-28)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: test
- GitHub Check: test
🔇 Additional comments (34)
app/components/dataPanel.tsx (3)
1-3
: Good addition of import statements.The imports have been properly updated to support the new functionality, including adding
Link
type andJSONTree
component.
9-10
: Improved type flexibility.Updating the interface to accept both
Node
andLink
types enhances the component's flexibility and reusability.
121-154
: Good conditional rendering for footer actions.The approach to conditionally render buttons based on object type is appropriate. However, using type guards as suggested earlier would make this code more type-safe as well.
- "category" in obj && + isNode(obj) &&app/api/repo/route.ts (11)
1-1
: Add NextRequest to imports
This addition is correct and necessary for the new POST handler.
29-29
: POST handler creation
A clear and well-structured approach to adding a new POST endpoint for repo analysis.
31-31
: Use of searchParams
Retrieving theurl
viarequest.nextUrl.searchParams.get('url')
is straightforward. Review edge cases (e.g., empty string).
35-37
: Missing URL check
Clear error handling ensures users receive quick feedback when the URL param is absent.
39-39
: Retrieving environment variables
UsinggetEnvVariables()
remains consistent with your existing pattern for centrally managing config.
41-41
: Local path detection
UsingstartsWith("file://")
to branch logic between local or remote config is a neat solution.
43-51
: Fetch call to analyze endpoints
Solid approach for deciding whether to analyze a folder or repo, with a good ignore list to exclude unneeded directories.
53-55
: Error handling on fetch
Throwing a new Error withawait result.text()
provides clearer debugging information from the backend.
57-57
: Return success
Simple JSON confirmation indicating the operation is complete—keeps the response concise.
58-61
: Catching and returning errors
Logging to console and returning status400
is consistent with the rest of the file’s style and ensures the error is surfaced.
62-62
: End of POST function
No issues found.app/page.tsx (20)
3-3
: Use of React hooks
ImportinguseEffect
,useRef
, anduseState
is standard and matches the newly introduced state logic.
5-6
: Extended imports
Bringing inLinkType
andNode
for typed graph data is a beneficial addition, as are thelucide-react
icons for UI enhancements.
8-8
: Added panel imports
react-resizable-panels
components facilitate a more flexible layout.
20-20
: New ForceGraphMethods import
TypingdesktopChartRef
andmobileChartRef
withForceGraphMethods
ensures strong type checking for graph interactions.
23-23
: Utility imports
Importing shared utilities and types from@/lib/utils
reduces duplication and consolidates logic.
32-55
: DESKTOP_TIPS array
Providing user-friendly instructions for desktop users is a great UX improvement to guide them through the interface.
51-55
: MOBILE_TIPS definition
Having a separate tip set for mobile clarifies product usage on smaller screens.
70-85
: New state variables
The introduction ofdesktopChartRef
,mobileChartRef
,menuOpen
,chatOpen
, etc. demonstrates thoughtful handling for both desktop and mobile contexts.
87-90
: Opening chat on path selection
Auto-opening chat once a path is set can streamline user workflows.
92-98
: Carousel event handling
Making use ofcarouselApi.on('select')
for the active index fosters a reactive UI in the tips carousel.
124-124
: Resetting submit state
SettingsetIsSubmit(false)
ensures your creation form is reusable without lingering submission status.
162-164
: Disable path response
ResettingisPathResponse
tofalse
before expanding the chat panel clarifies subsequent user interactions.
193-219
: handleSearchSubmit
Nicely orchestrated logic that conditionally extends the graph, reveals hidden nodes, and zooms in for better clarity.
221-232
: onCategoryClick function
Straightforward toggling of node visibility by category. Preserves performance by updating only relevant nodes.
234-278
: handleDownloadImage
Capturing the currently visible canvas and converting to a downloadable image is a convenient feature for exporting graph states.
281-334
: Desktop layout revisions
The improved header, gradient divider, and usage of PanelGroup nicely organize the desktop workspace. The tip dropdown fosters user guidance.
337-382
: Conditional new project dialog
This dialog—toggled byNEXT_PUBLIC_LOCAL_MODE
—helps local users create repos. The form flow with loading indicators is well done.
390-415
: Desktop CodeGraph usage
Passing newly introduced states (searchNode
,cooldownTicks
) toCodeGraph
for robust searching and other advanced features is well-structured.
417-445
: Desktop Chat panel
Using the collapsible panel for chat fosters a flexible layout without obstructing the main workspace.
447-609
: Mobile layout & responsiveness
Creating a dedicated mobile view with drawers, a menu panel, and a carousel for tips establishes a user-friendly experience on smaller screens.
Bumps [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) from 22.13.16 to 22.15.26. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node) --- updated-dependencies: - dependency-name: "@types/node" dependency-version: 22.15.26 dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]>
…/types/node-22.15.26 Bump @types/node from 22.13.16 to 22.15.26
Summary by CodeRabbit
Release Notes
Bug Fixes
New Features
chartRef
prop for better integration between components.Link
type in theDataPanel
component.Toolbar
component with new buttons.Performance Improvements
Testing