From eddd799504d66d4a59ec9c301df927712312e4f9 Mon Sep 17 00:00:00 2001 From: Ishaan Gupta Date: Tue, 12 May 2026 20:55:55 +0530 Subject: [PATCH] enhance UI of personalisation section --- apps/web/components/dashboard-view.tsx | 251 ++++++++++++------------- 1 file changed, 123 insertions(+), 128 deletions(-) diff --git a/apps/web/components/dashboard-view.tsx b/apps/web/components/dashboard-view.tsx index 37582908..92f2faf7 100644 --- a/apps/web/components/dashboard-view.tsx +++ b/apps/web/components/dashboard-view.tsx @@ -300,37 +300,32 @@ const PLUGIN_STATIC = [ // Plugin catalog for tool usage display - maps plugin IDs to display names and icons const PLUGIN_DISPLAY_CATALOG: Record< string, - { name: string; icon: string; type: "Plugin"; description: string } + { name: string; icon: string; type: "Plugin" } > = { claude_code: { name: "Claude Code", icon: "/images/plugins/claude-code.svg", type: "Plugin", - description: "Persistent memory across coding sessions", }, opencode: { name: "OpenCode", icon: "/images/plugins/opencode.svg", type: "Plugin", - description: "Context that carries forward automatically", }, openclaw: { name: "OpenClaw", icon: "/images/plugins/openclaw.svg", type: "Plugin", - description: "Cross-channel memory for messaging", }, hermes: { name: "Hermes", icon: "/images/plugins/hermes.svg", type: "Plugin", - description: "Persistent conversation memory", }, codex: { name: "OpenAI Codex", icon: "/images/plugins/codex.svg", type: "Plugin", - description: "AI-powered code generation with memory", }, } @@ -343,7 +338,8 @@ interface ToolUsageItem { lastUsedAt: Date | null hasBeenUsed: boolean connectedAt: Date | null - description: string | null + lastDocumentTitle: string | null + lastDocumentId: string | null } type ToolUsageApiKey = { @@ -369,6 +365,9 @@ function parseToolUsage( let latestMcpClientName: string | null = null let latestMcpDocumentAt: Date | null = null + // Track latest document per plugin client + const latestDocPerPlugin = new Map() + for (const key of apiKeys) { let meta: Record = {} try { @@ -405,7 +404,8 @@ function parseToolUsage( lastUsedAt: lastUsed, hasBeenUsed: !!key.lastRequest, connectedAt: toValidDate(key.createdAt), - description: catalog?.description ?? null, + lastDocumentTitle: null, + lastDocumentId: null, }) } } @@ -432,7 +432,8 @@ function parseToolUsage( lastUsedAt: lastUsed, hasBeenUsed: !!key.lastRequest, connectedAt: toValidDate(key.createdAt), - description: "Query your saved knowledge from any AI client", + lastDocumentTitle: null, + lastDocumentId: null, }) } } @@ -481,9 +482,22 @@ function parseToolUsage( lastUsedAt: createdAt, hasBeenUsed: true, connectedAt: toolMap.get("mcp")?.connectedAt ?? null, - description: "Query your saved knowledge from any AI client", + lastDocumentTitle: doc.title?.trim() || null, + lastDocumentId: doc.id ?? null, }) } + + // Also track latest doc per plugin client name for plugin items + if (clientName && clientName !== "unknown" && createdAt && doc.id) { + const existing = latestDocPerPlugin.get(clientName) + if (!existing || createdAt.getTime() > existing.at.getTime()) { + latestDocPerPlugin.set(clientName, { + title: doc.title?.trim() || "Untitled", + id: doc.id, + at: createdAt, + }) + } + } } if (latestMcpClientName) { @@ -496,6 +510,18 @@ function parseToolUsage( } } + // Attach latest document info to plugin items where available from MCP documents + for (const [, item] of toolMap) { + if (item.type === "Plugin" && !item.lastDocumentTitle) { + // Try to find matching documents by plugin name + const docInfo = latestDocPerPlugin.get(item.name) + if (docInfo) { + item.lastDocumentTitle = docInfo.title + item.lastDocumentId = docInfo.id + } + } + } + // Sort by lastUsedAt (most recent first), then by hasBeenUsed return Array.from(toolMap.values()).sort((a, b) => { // Items that have been used come first @@ -547,11 +573,11 @@ function isRecentlyActive(date: Date | null): boolean { function RecentToolUsageCard({ items, onOpenPlugins, - onOpenIntegrations, + onNavigateToMemories, }: { items: ToolUsageItem[] onOpenPlugins: () => void - onOpenIntegrations: (integration?: IntegrationParamValue) => void + onNavigateToMemories: () => void }) { // Show at most 3 items const displayItems = items.slice(0, 3) @@ -590,7 +616,6 @@ function RecentToolUsageCard({
    {displayItems.map((item, index) => { const recentlyActive = isRecentlyActive(item.lastUsedAt) - const isMostRecent = index === 0 && item.hasBeenUsed return ( - - - - - -
    -

    {item.name}

    - {item.hasBeenUsed && item.lastUsedAt && ( -

    - Last used: {formatAbsoluteTime(item.lastUsedAt)} -

    - )} - {item.connectedAt && ( -

    - Connected: {formatAbsoluteTime(item.connectedAt)} -

    - )} - {!item.hasBeenUsed && ( -

    Not yet used

    + )}
    -     -     + +     ) })} @@ -1408,7 +1403,7 @@ export function DashboardView({ @@ -1421,7 +1416,7 @@ export function DashboardView({ @@ -1455,7 +1450,7 @@ export function DashboardView({ @@ -1467,7 +1462,7 @@ export function DashboardView({