Mitt Digitala Minne

A personal knowledge management app where you save, organize, and search memories — thoughts, links, articles, images, YouTube videos, and social media posts. Features a web UI and an MCP server for saving memories directly via Claude AI.

Swedish UI · Full-text search · AI-powered via MCP · Self-hosted

Architecture

mittdigitalaminne/
├── web/                    # Next.js web app (frontend + API)
├── mcp-server/             # MCP server (Claude AI integration)
├── supabase/
│   └── migrations/         # Database schema (run in order)
└── README.md

How it works

• Web UI — Browse, search, filter, create, and edit memories at your-app.vercel.app
• MCP server — Claude AI can save/search/manage memories via tool calls
  • stdio transport — for Claude Desktop (local)
  • HTTP transport — for Claude.ai via Cloudflare Workers (remote)

Prerequisites

• Node.js 20+
• Supabase account (free tier works)
• Vercel account (free tier works) — for web deployment
• Cloudflare account (free tier works) — for MCP deployment
• Claude Desktop or Claude.ai Pro — for MCP usage

Setup Guide

1. Clone and install

git clone https://github.com/Pluggentipsar/mittdigitalaminne.git
cd mittdigitalaminne

# Install dependencies for both packages
cd web && npm install && cd ..
cd mcp-server && npm install && cd ..

2. Create Supabase project

1. Go to supabase.com/dashboard and create a new project
2. Note your Project URL and API keys from Settings > API
3. Run the database migrations in order via the SQL Editor:

supabase/migrations/001_initial_schema.sql
supabase/migrations/002_improved_search.sql
supabase/migrations/003_memory_notes.sql
supabase/migrations/004_new_content_types.sql
supabase/migrations/005_smart_spaces.sql
supabase/migrations/006_inbox.sql
supabase/migrations/007_projects.sql
supabase/migrations/008_snapshots.sql

1. Create a storage bucket for images:
   • Go to Storage in the Supabase dashboard
   • Create a new bucket called memory-images
   • Set it to Public

3. Configure environment variables

Web app — create web/.env.local:

NEXT_PUBLIC_SUPABASE_URL=https://YOUR_PROJECT.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_anon_key_here
SUPABASE_SERVICE_ROLE_KEY=your_service_role_key_here
OPENAI_API_KEY=your_openai_key_here           # For AI features (summarize, tags, etc.)

MCP server — create mcp-server/.env:

SUPABASE_URL=https://YOUR_PROJECT.supabase.co
SUPABASE_SERVICE_ROLE_KEY=your_service_role_key_here

You'll find these values in your Supabase project under Settings > API.

4. Run locally

# Terminal 1: Web app
cd web
npm run dev
# Opens at http://localhost:3000

# Terminal 2: MCP server (for testing)
cd mcp-server
npm run dev

Deployment

Deploy web app to Vercel

cd web
npx vercel --prod

Set these environment variables in your Vercel project settings:

Deploy MCP server to Cloudflare Workers

cd mcp-server
npm run build

# Set secrets (you'll be prompted for values)
wrangler secret put SUPABASE_URL
wrangler secret put SUPABASE_SERVICE_ROLE_KEY
wrangler secret put MCP_AUTH_TOKEN       # Choose a strong random token

# Deploy
npm run worker:deploy

Your MCP server will be available at https://your-worker.your-subdomain.workers.dev.

Connect Claude AI

Option A: Claude Desktop (local, stdio)

Add to your Claude Desktop config (claude_desktop_config.json):

{
  "mcpServers": {
    "mitt-digitala-minne": {
      "command": "node",
      "args": ["C:/path/to/mittdigitalaminne/mcp-server/dist/index.js"],
      "env": {
        "SUPABASE_URL": "https://YOUR_PROJECT.supabase.co",
        "SUPABASE_SERVICE_ROLE_KEY": "your_service_role_key"
      }
    }
  }
}

Build first with cd mcp-server && npm run build.

Option B: Claude.ai (remote, HTTP via Cloudflare Workers)

1. Go to claude.ai/settings/integrations
2. Add a new MCP integration:
   • URL: https://your-worker.your-subdomain.workers.dev/mcp
   • Authentication: Bearer token (the MCP_AUTH_TOKEN you set)
3. Claude.ai can now save memories, search, add notes, etc.

MCP Tools

The MCP server exposes 10 tools that Claude can use:

Features

Content Types

• 7 content types: Thought, Link, Article, Image, YouTube, LinkedIn, Instagram
• Auto-detection of platform from pasted URLs

Rich Previews

• YouTube — embedded video player with thumbnail and play button overlay
• Instagram — full embed of posts/reels with dynamic height via postMessage
• LinkedIn — branded text preview with platform colors
• Articles & Links — OG image previews with favicon and domain
• Smart title handling — auto-truncation of long social media titles at ~120 chars

Search & Filtering

• Swedish full-text search with relevance ranking (weighted: title > summary > content)
• Filters — by content type, tags, project, date range, favorites, inbox status
• Smart Spaces — save any active filter combination as a named space in the sidebar

Organization

• Tags with colors for categorization
• Projects & collections — group related memories with name, color, icon, deadline, and status (active/archived)
• Inbox — new memories land in inbox until organized
• Favorites — star important memories for quick access

AI Features

• AI summarization — automatic summary of articles and posts
• AI tag suggestions — keyword extraction matched against existing tags
• AI actions panel — process memories with AI directly in the detail view (summarize, extract key points, translate, etc.)
• Related memories — automatic connections between similar memories based on shared tags

Web Snapshots

• Save HTML snapshots of web pages for offline reading
• View snapshots in a sandboxed iframe within the app

Export & Download

• Download as .txt — clean text file with title, summary, content, metadata, and tags
• Download as .docx — formatted Word document with typography, headings, bullet lists, and metadata
• Available from both the context menu (right-click on cards) and the detail view toolbar
• Works on mobile via long-press

Context Menu (Desktop & Mobile)

• Right-click (desktop) or long-press (mobile, 500ms) on memory cards:
  • Toggle favorite
  • Add to project (submenu with active projects)
  • Download as .txt
  • Download as .docx
  • Open original link
  • Delete memory
• Haptic feedback on mobile (vibration API)
• Viewport-aware positioning (menu stays on screen)

Dashboard

• Statistics overview with type distribution chart
• Recent memories list
• Resurfacing — rediscover old memories that may be relevant again

Comment Threads

• Add notes/comments to any memory
• Threaded discussion per memory

Design

• "Amber Glow" theme — warm amber accents with content-type colored card glows
• Fonts: Instrument Serif (headings) + DM Sans (body text)
• Collapsible sidebar (72px collapsed, 272px expanded) with localStorage persistence
• Responsive — works on desktop and mobile
• Ambient gradient orbs and decorative dividers
• Swedish UI throughout

Project Structure

web/
├── src/
│   ├── app/
│   │   ├── api/                # API routes
│   │   │   ├── memories/       # CRUD + notes + related
│   │   │   ├── projects/       # Projects CRUD + member management
│   │   │   ├── spaces/         # Smart Spaces CRUD
│   │   │   ├── suggest-tags/   # AI tag suggestions
│   │   │   ├── resurface/      # Memory resurfacing
│   │   │   ├── unfurl/         # URL metadata + article extraction
│   │   │   ├── statistics/     # Dashboard stats
│   │   │   ├── tags/           # Tag management
│   │   │   └── upload/         # Image upload
│   │   ├── dashboard/          # Dashboard page
│   │   ├── inkorg/             # Inbox page
│   │   ├── lagg-till/          # Create memory page
│   │   ├── minnen/             # Memory list + detail + edit pages
│   │   ├── projekt/            # Project list + detail pages
│   │   └── taggar/             # Tag management page
│   ├── components/
│   │   ├── memories/           # MemoryCard, MemoryGrid, CardContextMenu, AiActionsPanel
│   │   │   └── previews/       # YouTubePreview, InstagramEmbed, SocialPreview, LinkPreview
│   │   ├── projects/           # AddToProjectDialog, ProjectCard
│   │   ├── spaces/             # SaveSpaceDialog
│   │   ├── dashboard/          # Stats, charts, recent list, resurfacing
│   │   ├── filters/            # FilterBar (type, tags, project, search, save space)
│   │   ├── layout/             # Sidebar navigation + spaces
│   │   ├── contexts/           # SidebarContext
│   │   └── ui/                 # MarkdownContent, SnapshotViewer
│   ├── hooks/                  # SWR data hooks (memories, tags, spaces, projects, suggestions)
│   └── lib/                    # Supabase clients, types, utils, export utilities, stopwords

mcp-server/
├── src/
│   ├── server.ts               # MCP server factory (shared logic)
│   ├── index.ts                # stdio entry point (Claude Desktop)
│   ├── worker.ts               # Cloudflare Workers entry (Claude.ai)
│   ├── tools/                  # Individual tool handlers
│   ├── utils/                  # URL detection, tag helpers
│   └── db/                     # Supabase client factory
├── wrangler.toml               # Cloudflare Workers config
└── tsconfig.json

supabase/
└── migrations/
    ├── 001_initial_schema.sql          # Core tables, FTS, RLS
    ├── 002_improved_search.sql         # Enhanced search with tags in FTS
    ├── 003_memory_notes.sql            # Comment/notes table
    ├── 004_new_content_types.sql       # YouTube, LinkedIn, Instagram types
    ├── 005_smart_spaces.sql            # Smart Spaces (saved filters)
    ├── 006_inbox.sql                   # Inbox flag for memories
    ├── 007_projects.sql                # Projects & memory_projects tables
    └── 008_snapshots.sql               # Snapshot HTML storage

License

MIT