Skip to content

Mind map ↔ knowledge graph bidirectional sync#292

Open
d-oit wants to merge 1 commit into
mainfrom
feat/mindmap-graph-sync-5123436395854815461
Open

Mind map ↔ knowledge graph bidirectional sync#292
d-oit wants to merge 1 commit into
mainfrom
feat/mindmap-graph-sync-5123436395854815461

Conversation

@d-oit

@d-oit d-oit commented Jun 8, 2026

Copy link
Copy Markdown
Owner

This PR adds a long-requested feature: bidirectional synchronization between the mind map and knowledge graph.

Key changes:

  1. Shared State: A new Zustand store src/store/graph-sync-store.ts acts as an event bus between the two views.
  2. Adapters: src/features/mindmap/sync-adapter.ts and src/features/graph/sync-adapter.ts translate internal library events (like addChild or nodeAdded) into shared GraphSyncEvents.
  3. Synchronization Logic:
    • Both views subscribe to the store and consume events originating from the other view.
    • Infinite loops are prevented by source filtering and explicit label comparisons before applying updates.
    • Conflicts are handled via last-writer-wins, with warnings logged to the console.
  4. UI: A SyncToggle component allows users to enable/disable synchronization on the fly.
  5. Quality:
    • Unit tests for the store.
    • Integration tests for the bidirectional flow.
    • Memory leak prevention by properly cleaning up Graphology listeners.

Fixes #286


PR created automatically by Jules for task 5123436395854815461 started by @d-oit

…d store

Implemented bidirectional synchronization between Mind Map (mind-elixir) and Knowledge Graph (graphology) features.
- Created `GraphSyncStore` Zustand slice to manage sync state and event queue.
- Implemented sync adapters for both Mind Map and Graph to map library-specific operations to shared events.
- Integrated sync logic into `MindMapView` and `GraphView` with loop prevention and last-writer-wins conflict resolution.
- Added `SyncToggle` UI component to both feature toolbars.
- Fixed potential listener leaks and update loops in GraphView.
- Added unit and integration tests for sync logic.

Co-authored-by: d-oit <6849456+d-oit@users.noreply.github.com>
@google-labs-jules

Copy link
Copy Markdown
Contributor

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

@deepsource-io

deepsource-io Bot commented Jun 8, 2026

Copy link
Copy Markdown

DeepSource Code Review

We reviewed changes in 1d652e1...d2882c7 on this pull request. Below is the summary for the review, and you can see the individual issues we found as inline review comments.

See full review on DeepSource ↗

Important

Some issues found as part of this review are outside of the diff in this pull request and aren't shown in the inline review comments due to GitHub's API limitations. You can see those issues on the DeepSource dashboard.

PR Report Card

Overall Grade   Security  

Reliability  

Complexity  

Hygiene  

Code Review Summary

Analyzer Status Updated (UTC) Details
JavaScript Jun 8, 2026 2:40p.m. Review ↗
Python Jun 8, 2026 2:40p.m. Review ↗
Shell Jun 8, 2026 2:40p.m. Review ↗
SQL Jun 8, 2026 2:40p.m. Review ↗

Important

AI Review is run only on demand for your team. We're only showing results of static analysis review right now. To trigger AI Review, comment @deepsourcebot review on this thread.

@@ -0,0 +1,87 @@
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, act } from '@testing-library/react';

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

'render' is defined but never used


Unused variables are generally considered a code smell and should be avoided.

@@ -0,0 +1,87 @@
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, act } from '@testing-library/react';
import React from 'react';

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

'React' is defined but never used


Unused variables are generally considered a code smell and should be avoided.

setupGraphSyncListeners(graph);

// Simulate setupMindMapSyncListeners
let mindMapListener: (op: any) => void = () => {};

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected any. Specify a different type


The any type can sometimes leak into your codebase. TypeScript compiler skips the type checking of the any typed variables, so it creates a potential safety hole, and source of bugs in your codebase. We recommend using unknown or never type variable.

setupGraphSyncListeners(graph);

// Simulate setupMindMapSyncListeners
let mindMapListener: (op: any) => void = () => {};

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected empty arrow function


Having empty functions hurts readability, and is considered a code-smell. There's almost always a way to avoid using them. If you must use one, consider adding a comment to inform the reader of its purpose.

mockMindMap.bus.addListener.mockImplementation((name, cb) => {
if (name === 'operation') mindMapListener = cb;
});
setupMindMapSyncListeners(mockMindMap as any);

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected any. Specify a different type


The any type can sometimes leak into your codebase. TypeScript compiler skips the type checking of the any typed variables, so it creates a potential safety hole, and source of bugs in your codebase. We recommend using unknown or never type variable.

});
};

const onEdgeDropped = ({ key }: any) => {

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected any. Specify a different type


The any type can sometimes leak into your codebase. TypeScript compiler skips the type checking of the any typed variables, so it creates a potential safety hole, and source of bugs in your codebase. We recommend using unknown or never type variable.

const events = useGraphSyncStore.getState().consumeEvents('mindmap');
if (events.length === 0) return;

events.forEach(event => {

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Function has a cyclomatic complexity of 8 with "medium" risk


A function with high cyclomatic complexity can be hard to understand and
maintain. Cyclomatic complexity is a software metric that measures the number of
independent paths through a function. A higher cyclomatic complexity indicates
that the function has more decision points and is more complex.

Comment on lines +5 to +44
export function setupMindMapSyncListeners(
mindMap: MindElixirInstance
) {
const store = useGraphSyncStore.getState();

mindMap.bus.addListener('operation', (op: any) => {
if (!useGraphSyncStore.getState().syncEnabled) return;

if (op.name === 'addChild' || op.name === 'insertSibling') {
const obj = op.obj;
store.emitEvent({
type: 'node:add',
source: 'mindmap',
payload: { id: obj.id, label: obj.topic } as SharedNode,
});
}

if (op.name === 'finishEdit') {
const obj = op.obj;
store.emitEvent({
type: 'node:update',
source: 'mindmap',
payload: { id: obj.id, label: obj.topic } as SharedNode,
});
}

if (op.name === 'removeNodes') {
const objs = op.objs;
if (Array.isArray(objs)) {
objs.forEach(obj => {
store.emitEvent({
type: 'node:remove',
source: 'mindmap',
payload: { id: obj.id, label: '' } as SharedNode,
});
});
}
}
});
}

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected function declaration in the global scope, wrap in an IIFE for a local variable, assign as global property for a global variable


It is considered a best practice to avoid 'polluting' the global scope with variables that are intended to be local to the script. Global variables created from a script can produce name collisions with global variables created from another script, which will usually lead to runtime errors or unexpected behavior. It is mostly useful for browser scripts.

) {
const store = useGraphSyncStore.getState();

mindMap.bus.addListener('operation', (op: any) => {

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Function has a cyclomatic complexity of 7 with "medium" risk


A function with high cyclomatic complexity can be hard to understand and
maintain. Cyclomatic complexity is a software metric that measures the number of
independent paths through a function. A higher cyclomatic complexity indicates
that the function has more decision points and is more complex.

) {
const store = useGraphSyncStore.getState();

mindMap.bus.addListener('operation', (op: any) => {

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected any. Specify a different type


The any type can sometimes leak into your codebase. TypeScript compiler skips the type checking of the any typed variables, so it creates a potential safety hole, and source of bugs in your codebase. We recommend using unknown or never type variable.

@codacy-production

Copy link
Copy Markdown
Contributor

Not up to standards ⛔

🔴 Issues 2 critical · 10 high

Alerts:
⚠ 12 issues (≤ 0 issues of at least minor severity)

Results:
12 new issues

Category Results
BestPractice 10 high
Security 2 critical

View in Codacy

🟢 Metrics 93 complexity · 0 duplication

Metric Results
Complexity 93
Duplication 0

View in Codacy

NEW Get contextual insights on your PRs based on Codacy's metrics, along with PR and Jira context, without leaving GitHub. Enable AI reviewer
TIP This summary will be updated as you push new changes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

config tests Related to automated/manual tests

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: Mind map ↔ knowledge graph bidirectional sync via shared Zustand store

1 participant