- Branch-aware retrieval
+ {t('s.sub.a')}
{branch ? (
<>
- {' '}
- on {branch}
+ {t('s.sub.on')}
+ {branch}
) : null}
- . Each hit shows why it ranked — semantic, branch, recency, graduated, pin.
+ {t('s.sub.b')}
- claude-mem not detected — searching shared pins + graduated only.
+ {t('s.sharedonly')}
) : null}
{q.trim() === '' ? (
-
{hits.map((h, i) => (
diff --git a/web/views/ShareCard.tsx b/web/views/ShareCard.tsx
new file mode 100644
index 0000000..4fce2bf
--- /dev/null
+++ b/web/views/ShareCard.tsx
@@ -0,0 +1,121 @@
+import { useCallback } from 'react';
+
+import { useI18n } from '../i18n.js';
+import type { ContributorStat, GroveSource } from '../lib.js';
+
+interface ShareCardProps {
+ project: string;
+ contributors: ContributorStat[];
+ source: GroveSource;
+ facts: number;
+ branches: number;
+}
+
+function token(name: string, fallback: string): string {
+ const v = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+ return v || fallback;
+}
+
+/**
+ * Render a bamboo-framed summary of the grove to an offscreen canvas and hand it
+ * back as a PNG download — the shareable, post-it-anywhere artifact. Drawn fresh
+ * each click so it always reflects current stats and the active theme.
+ */
+export function ShareCard({ project, contributors, source, facts, branches }: ShareCardProps) {
+ const { t } = useI18n();
+ const onShare = useCallback(async () => {
+ // Canvas silently falls back to a system font if a face isn't loaded yet —
+ // pull the weights we draw with so the PNG is crisp on first click.
+ try {
+ await Promise.all([
+ document.fonts?.load("700 64px 'Baloo 2'"),
+ document.fonts?.load("800 84px 'Baloo 2'"),
+ document.fonts?.load("600 40px 'Be Vietnam Pro'"),
+ document.fonts?.load("400 30px 'Be Vietnam Pro'"),
+ ]);
+ } catch {
+ /* fonts unavailable (offline) — fall back to system, still renders */
+ }
+ const W = 1200;
+ const H = 630;
+ const canvas = document.createElement('canvas');
+ canvas.width = W;
+ canvas.height = H;
+ const ctx = canvas.getContext('2d');
+ if (!ctx) return;
+
+ const bamboo = token('--bamboo', '#2e7d52');
+ const growth = token('--growth', '#3aa35a');
+ const paper = token('--surface', '#ffffff');
+ const ink = token('--ink', '#1c1c1c');
+ const soft = token('--ink-soft', '#555');
+
+ ctx.fillStyle = paper;
+ ctx.fillRect(0, 0, W, H);
+ // bamboo side-stripe
+ ctx.fillStyle = growth;
+ ctx.fillRect(0, 0, 16, H);
+ ctx.fillStyle = bamboo;
+ ctx.fillRect(16, 0, 6, H);
+
+ const display = "'Baloo 2', system-ui, sans-serif";
+ const body = "'Be Vietnam Pro', system-ui, sans-serif";
+
+ ctx.fillStyle = ink;
+ ctx.font = `700 64px ${display}`;
+ ctx.fillText('🎋 ' + project, 80, 140);
+
+ ctx.fillStyle = soft;
+ ctx.font = `400 30px ${body}`;
+ ctx.fillText(t('card.tagline'), 80, 190);
+
+ const top = contributors[0];
+ ctx.fillStyle = ink;
+ ctx.font = `600 40px ${body}`;
+ if (top) {
+ const metric =
+ source === 'git-fallback'
+ ? t('metric.commits', { n: top.commits })
+ : t('metric.score', { n: top.value_score });
+ ctx.fillText(`🥇 ${top.author}`, 80, 300);
+ ctx.fillStyle = soft;
+ ctx.font = `400 30px ${body}`;
+ ctx.fillText(metric, 80, 344);
+ }
+
+ const stats: Array<[string, string]> = [
+ [String(contributors.length), t('card.contributors')],
+ [String(facts), t('card.facts')],
+ [String(branches), t('card.branches')],
+ ];
+ stats.forEach(([n, k], i) => {
+ const x = 80 + i * 360;
+ ctx.fillStyle = growth;
+ ctx.font = `800 84px ${display}`;
+ ctx.fillText(n, x, 500);
+ ctx.fillStyle = soft;
+ ctx.font = `400 28px ${body}`;
+ ctx.fillText(k, x, 540);
+ });
+
+ ctx.fillStyle = soft;
+ ctx.font = '400 24px ui-monospace, monospace';
+ ctx.fillText('npm i -g tre-mem', 80, 600);
+
+ canvas.toBlob((blob) => {
+ if (!blob) return;
+ const url = URL.createObjectURL(blob);
+ const a = document.createElement('a');
+ a.href = url;
+ a.download = `${project}-grove.png`;
+ a.click();
+ URL.revokeObjectURL(url);
+ }, 'image/png');
+ }, [project, contributors, source, facts, branches, t]);
+
+ return (
+
+ );
+}
diff --git a/web/views/TeamMemory.tsx b/web/views/TeamMemory.tsx
index e5dcb0d..0cf7673 100644
--- a/web/views/TeamMemory.tsx
+++ b/web/views/TeamMemory.tsx
@@ -1,3 +1,4 @@
+import { useI18n } from '../i18n.js';
import { Badge, Empty, Skeletons, timeAgo, useApi, type Graduated, type Pin } from '../lib.js';
interface TeamMemoryProps {
@@ -16,6 +17,7 @@ interface GradResponse {
}
export function TeamMemory({ project, refreshKey, onOpenBranch }: TeamMemoryProps) {
+ const { t } = useI18n();
const q = `project=${encodeURIComponent(project)}`;
const pins = useApi
(`/api/pins?${q}`, refreshKey);
const grad = useApi(`/api/graduated?${q}`, refreshKey);
@@ -28,48 +30,50 @@ export function TeamMemory({ project, refreshKey, onOpenBranch }: TeamMemoryProp
return (
<>
- Team memory
+ {t('tm.title')}
- What the team chose to remember about {project} — pinned decisions and the
- facts that graduated to repo-wide knowledge. Shared rows live in .tre-mem/ and
- travel through git; run tre share to publish them.
+ {t('tm.sub.a')}
+ {project}
+ {t('tm.sub.b')}
+ .tre-mem/
+ {t('tm.sub.c')}
+ tre share
+ {t('tm.sub.d')}
{!loading && pendingCount > 0 ? (
- {pendingCount} pin{pendingCount === 1 ? '' : 's'} not shared yet — run{' '}
- tre share to push {pendingCount === 1 ? 'it' : 'them'} to your team's git.
+ {t('tm.callout.a', { n: pendingCount })}
+ tre share
+ {t('tm.callout.b')}
) : null}
{loading ? (
) : pinRows.length === 0 && gradRows.length === 0 ? (
-
+
) : (
<>
-
Pinned decisions
+ {t('tm.pinned')}
{pinRows.length}
{pinRows.map((p) => (
- pin
- {p.title ?? p.note ?? '(pinned fact)'}
+ {t('entry.pin')}
+ {p.title ?? p.note ?? t('entry.pinnedfact')}
- {p.shared ? 'shared via git ✓' : 'not shared yet'}
+ {p.shared ? t('entry.shared.git') : t('entry.notshared')}
{p.body && p.body !== p.title ? {p.body}
: null}
{p.note && p.note !== p.title ? (
- note · {p.note}
+ {t('entry.note')} · {p.note}
) : null}
@@ -86,25 +90,22 @@ export function TeamMemory({ project, refreshKey, onOpenBranch }: TeamMemoryProp
-
Graduated facts
+ {t('tm.graduated')}
{gradRows.length}
{gradRows.length === 0 ? (
-
+
) : (
{gradRows.map((g) => (
- graduated
+ {t('entry.graduated')}
{g.title ?? `#${g.observation_id}`}
{g.body ? {g.body}
: null}
- from
+ {t('entry.from')}