feat: add drag-and-drop foundation and fix build errors#7
feat: add drag-and-drop foundation and fix build errors#7
Conversation
…ng unused import 🤖 Generated with [opencode](https://opencode.ai) Co-Authored-By: opencode <noreply@opencode.ai>
|
WalkthroughThis update introduces development guidelines, adds drag-and-drop functionality to the ChatMap component, and updates dependencies to fix build errors. It also addresses an import issue in Changes
Uplevel your code reviews with CodeRabbit ProCodeRabbit ProIf you like this project, please support us by purchasing the Pro version. The Pro version has advanced context, superior noise reduction and several proprietary improvements compared to the open source version. Moreover, CodeRabbit Pro is free for open source projects. |
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
Files selected (4)
- AGENTS.md (1)
- src/components/ChatMap.svelte (3)
- src/services/template-strings.ts (1)
- src/stores/contextual-stores.ts (1)
Files ignored due to filter (1)
- package.json
Files skipped from review due to trivial changes (2)
- AGENTS.md
- src/services/template-strings.ts
Review comments generated (5)
- Review: 2
- LGTM: 3
Tips
Chat with 
CodeRabbit Bot (@coderabbitai)
- Reply on review comments left by this bot to ask follow-up questions. A review comment is a comment on a diff or a file.
- Invite the bot into a review comment chain by tagging
@coderabbitaiin a reply.
Code suggestions
- The bot may make code suggestions, but please review them carefully before committing since the line number ranges may be misaligned.
- You can edit the comment made by the bot and manually tweak the suggestion if it is slightly off.
Pausing incremental reviews
- Add
@coderabbitai: ignoreanywhere in the PR description to pause further reviews from the bot.
| reorderChatPoints(newOrderIds: string[]): void { | ||
| const points = this.chatPoints.getValue(); | ||
| const reordered = newOrderIds.map(id => points.find(cp => cp.id === id)).filter(Boolean) as ChatPoint[]; | ||
| this.chatPoints.next(reordered); | ||
| } |
There was a problem hiding this comment.
The reorderChatPoints function could potentially have performance issues if the number of chat points is large. The current implementation has a time complexity of O(n^2) because for each id in newOrderIds, it performs a find operation on points which is an O(n) operation. This can be optimized to O(n) by creating a map of ids to chat points before reordering.
- const reordered = newOrderIds.map(id => points.find(cp => cp.id === id)).filter(Boolean) as ChatPoint[];
+ const pointsMap = new Map(points.map(cp => [cp.id, cp]));
+ const reordered = newOrderIds.map(id => pointsMap.get(id)).filter(Boolean) as ChatPoint[];| let linkSVG: any; | ||
|
|
||
| // drag-and-drop items | ||
| let dndItems: Array<{ id: string; item: any }> = []; | ||
| const unsubscribeTree = treeDisplay.subscribe(items => { dndItems = items.map(item => ({ id: item.id, item })); }); | ||
| function handleDndFinalize(e: CustomEvent) { | ||
| console.log('Reordered items:', e.detail.items); | ||
| } |
There was a problem hiding this comment.
The unsubscribeTree subscription is not being cleaned up. This could lead to memory leaks if the component is destroyed and recreated multiple times. Consider unsubscribing in an onDestroy lifecycle hook.
+ import { onDestroy } from 'svelte';
let mindmap: SVGSVGElement;
let linkSVG: any;
// drag-and-drop items
let dndItems: Array<{ id: string; item: any }> = [];
- const unsubscribeTree = treeDisplay.subscribe(items => { dndItems = items.map(item => ({ id: item.id, item })); });
+ const unsubscribeTree = treeDisplay.subscribe(items => { dndItems = items.map(item => ({ id: item.id, item })); });
+ onDestroy(unsubscribeTree);
function handleDndFinalize(e: CustomEvent) {
console.log('Reordered items:', e.detail.items);
}1 participant
Summary
• Add foundational drag-and-drop functionality to ChatMap mindmap using svelte-dnd-action
• Fix critical build errors by updating markmap dependencies to latest versions
• Add AGENTS.md development guidelines for coding agents
Test plan
npm run build)🤖 Generated with opencode
Summary by CodeRabbit
New Feature:
Bug Fix:
template-strings.tsservice due to changes inmarkmap-lib.Documentation:
Agent Guidelinesproviding development commands, style guidelines, and rules.Refactor:
contextual-stores.tswith a new methodreorderChatPointsfor reordering chat points based on user input.These updates aim to improve user experience and application stability while providing clear guidelines for future development.