mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-05-17 03:56:18 +00:00
b0e5766a65
Some checks failed
Publish Memory Graph / publish (push) Has been cancelled
## Summary Addresses user feedback about the graph view: content in node popovers was hard-truncated at 100 characters with no way to read the full text or navigate to the document. ### Changes **Scrollable popover content (no more truncation)** - Removed the `truncate(content, 100)` call -- full content is now rendered in the popover - Made the content area scrollable with `maxHeight: 100px` and `overflowY: auto` - Increased version timeline entry truncation from 60 to 120 characters - Increased version timeline container height from 120px to 160px **"View document" in shortcuts panel** - Added an eye icon + "View document" entry to the shortcuts panel (alongside existing arrow navigation) - Clicking opens the Document Modal for the corresponding document - Works for both document nodes (opens that document) and memory nodes (opens the parent document) - Popover is automatically dismissed before the modal opens (prevents z-index overlap) - Wired `onOpenDocument` callback through the full component chain: `page.tsx` -> `GraphLayoutView` -> `MemoryGraph` wrapper -> `MemoryGraphBase` -> `NodeHoverPopover` **Shortcuts panel visual cleanup** - Icon badges (`KeyBadge`) retain dark background and border for a keyboard-key badge look - All icons (including the new EyeIcon) are uniformly wrapped in `KeyBadge` for consistent styling - Removed background, border, and border-radius from the shortcuts panel container itself - Widened shortcuts panel from 100px to 160px so navigation labels are fully visible **Type safety improvement** - Changed `MemoryGraphProps.colors` from `GraphThemeColors` to `Partial<GraphThemeColors>` to match actual usage (callers pass partial overrides that get merged with defaults) - Replaced `as Partial<typeof import(...)>` cast with proper `satisfies Partial<GraphThemeColors>` using a direct type import ### Files changed - `packages/memory-graph/src/components/node-hover-popover.tsx` -- scrollable content, EyeIcon + "View document" in shortcuts, KeyBadge styling, NavButton icon type broadened to `React.ReactNode`, all icons wrapped in KeyBadge - `packages/memory-graph/src/components/memory-graph.tsx` -- popover dismissal wrapper (`handleOpenDocument`), prop forwarding - `packages/memory-graph/src/types.ts` -- `onOpenDocument` prop on `MemoryGraphProps`, `colors` changed to `Partial<GraphThemeColors>` - `apps/web/components/graph-layout-view.tsx` -- accepts and passes `onOpenDocument` - `apps/web/components/memory-graph/memory-graph-wrapper.tsx` -- `onOpenDocument` in wrapper props, clean type import - `apps/web/app/(app)/page.tsx` -- `handleOpenDocumentById` handler, wired to `GraphLayoutView` ## Testing ### Unit Tests (154/154 passed) - **Command:** `cd packages/memory-graph && bun run test` - **Result:** 9 test files, 154 tests passed (107 existing + 47 new) - **New test file:** `packages/memory-graph/src/__tests__/node-hover-popover.test.tsx` covering: - Layout constants (`SHORTCUTS_W=160`, `CARD_W=280`, `TOTAL_W` formula) - Content area scrollability (`maxHeight:100`, `overflowY:auto`, `flex:1 1 auto`, no truncation) - KeyBadge styles (has `backgroundColor: colors.controlBg`, has `border` with `colors.controlBorder`) - Shortcuts panel styles (no `backgroundColor`, no `border`, no `borderRadius`) - EyeIcon SVG component (`aria-hidden`, viewBox, path, circle, stroke) - "View document" button render guard (`onOpenDocument && documentId`) - `documentId` derivation (memory vs document node) - VersionTimeline truncation limit (120 chars) and container maxHeight (160) - `onOpenDocument` prop wiring - NavButton icon prop type (`React.ReactNode`), all icons wrapped in KeyBadge - `handleOpenDocument` wrapper in MemoryGraph (dismiss calls, ordering, useCallback deps) ### Build - **Command:** `bun run --filter=@supermemory/memory-graph build` - **Result:** Build succeeds, 0 errors ### Lint/Format - **Command:** `bunx biome ci --changed --since=origin/main --no-errors-on-unmatched` - **Result:** 6 files checked, no fixes applied, 0 errors ### Type Checking - `packages/memory-graph`: 0 errors - `apps/web`: 0 new errors introduced ### CI - "CI - Type Check, Format & Lint" workflow passes - "Claude Code Review" workflow fails due to repo config (`non-human actor: vorflux` not in `allowed_bots` list) -- not related to code changes --- **Session Details** - Session: [View Session](https://supermemory.us1.vorflux.com/agent-sessions/d0c067f1-38c1-40c5-ada9-b2ffb7331d1c) - Requested by: Mahesh Sanikommu (mahesh@supermemory.com) - Address comments on this PR. Add `(aside)` to your comment to have me ignore it.
66 lines
1.7 KiB
JSON
66 lines
1.7 KiB
JSON
{
|
|
"name": "@supermemory/memory-graph",
|
|
"version": "0.2.1",
|
|
"description": "Interactive graph visualization component for Supermemory - visualize and explore your memory connections",
|
|
"type": "module",
|
|
"main": "./src/index.tsx",
|
|
"module": "./src/index.tsx",
|
|
"types": "./src/index.tsx",
|
|
"exports": {
|
|
".": "./src/index.tsx",
|
|
"./mock-data": "./src/mock-data.ts",
|
|
"./package.json": "./package.json"
|
|
},
|
|
"files": [
|
|
"dist",
|
|
"README.md"
|
|
],
|
|
"scripts": {
|
|
"dev": "vite build --watch",
|
|
"build": "vite build && tsc --emitDeclarationOnly",
|
|
"check-types": "tsc --noEmit",
|
|
"prepack": "bun run build && bun run scripts/swap-exports.ts pack",
|
|
"postpack": "bun run scripts/swap-exports.ts unpack",
|
|
"test": "vitest run"
|
|
},
|
|
"keywords": [
|
|
"supermemory",
|
|
"graph",
|
|
"visualization",
|
|
"memory",
|
|
"interactive",
|
|
"canvas",
|
|
"react",
|
|
"component"
|
|
],
|
|
"author": "Supermemory",
|
|
"license": "MIT",
|
|
"repository": {
|
|
"type": "git",
|
|
"url": "https://github.com/supermemoryai/supermemory",
|
|
"directory": "packages/memory-graph"
|
|
},
|
|
"bugs": {
|
|
"url": "https://github.com/supermemoryai/supermemory/issues"
|
|
},
|
|
"homepage": "https://github.com/supermemoryai/supermemory/tree/main/packages/memory-graph#readme",
|
|
"peerDependencies": {
|
|
"react": ">=18.0.0",
|
|
"react-dom": ">=18.0.0"
|
|
},
|
|
"dependencies": {
|
|
"d3-force": "^3.0.0"
|
|
},
|
|
"devDependencies": {
|
|
"@testing-library/jest-dom": "^6.9.1",
|
|
"@testing-library/react": "^16.3.2",
|
|
"@types/d3-force": "^3.0.10",
|
|
"@types/react": "^19.2.2",
|
|
"@types/react-dom": "^19.2.2",
|
|
"@vitejs/plugin-react": "^5.1.0",
|
|
"happy-dom": "^20.9.0",
|
|
"typescript": "^5.9.3",
|
|
"vite": "^7.2.1",
|
|
"vitest": "^3.2.4"
|
|
}
|
|
}
|