mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-08-28 05:25:33 +00:00
2bbc7fc7a5
### feat(mcp): add memory graph visualization MCP App #### Summary - Add interactive force-directed graph visualization as an MCP App using `force-graph` + `d3-force-3d` - Register `memory-graph` and `fetch-graph-data` tools with MCP Apps SDK UI resources - Add graph API client methods (`getGraphBounds`, `getGraphViewport`) to `SupermemoryClient` - Set up Vite + `vite-plugin-singlefile` build pipeline to produce a self-contained HTML bundle - Support light/dark theme, zoom controls, node popups, and legend #### Files changed - `apps/mcp/src/server.ts` — register app tools + HTML resource - `apps/mcp/src/client.ts` — add graph API types and methods - `apps/mcp/src/ui/mcp-app.ts` — force-graph visualization app - `apps/mcp/src/ui/global.css`, `mcp-app.css` — styling - `apps/mcp/mcp-app.html` — entry HTML for Vite - `apps/mcp/vite.config.ts` — Vite single-file build config - `apps/mcp/package.json` — add UI deps and build scripts - `apps/mcp/wrangler.jsonc` — add HTML text import rule
37 lines
1 KiB
TypeScript
37 lines
1 KiB
TypeScript
import { cn } from "@lib/utils";
|
|
import { Button } from "@ui/components/button";
|
|
|
|
export interface ExternalAuthButtonProps extends React.ComponentProps<"button"> {
|
|
authProvider: string;
|
|
authIcon: React.ReactNode;
|
|
}
|
|
|
|
export function ExternalAuthButton({
|
|
authProvider,
|
|
authIcon,
|
|
className,
|
|
...props
|
|
}: ExternalAuthButtonProps) {
|
|
return (
|
|
<Button
|
|
className={cn(
|
|
"flex flex-grow cursor-pointer max-w-full items-center justify-center gap-[0.625rem] rounded-xl px-6 py-5 hover:opacity-75",
|
|
className,
|
|
)}
|
|
style={{
|
|
borderRadius: "12px",
|
|
background:
|
|
"linear-gradient(180deg, #00264F 0%, #001933 100%), linear-gradient(180deg, #0A0E14 0%, #05070A 100%)",
|
|
boxShadow:
|
|
"0 1px 2px 0 rgba(0, 43, 87, 0.10), 1px 1px 1px 1px #002B57 inset",
|
|
height: "44px",
|
|
}}
|
|
{...props}
|
|
>
|
|
<span className="aspect-square">{authIcon}</span>
|
|
<span className="text-foreground text-left text-[0.875rem] tracking-[-0.2px] leading-[1.25rem]">
|
|
Continue with {authProvider}
|
|
</span>
|
|
</Button>
|
|
);
|
|
}
|