aimeat 2.0.0 → 2.2.0

package/dist/public/views/profile/access-tab/connected-apps.js

@@ -3,11 +3,18 @@
  * @description Connected Apps section (H-2 app grants) — list + revoke the
  *   scoped, user-approved access tokens published apps hold. Extracted from
  *   access-tab.js to satisfy max-file-lines.
+ * @structure ConnectedAppsSection — loads GET /v1/app-grants, sorts by recency,
+ *   renders one card per app (scopes collapsed behind their count), single revoke
+ *   + a bulk revoke of grants unused for STALE_DAYS.
  * @version-history
  *   v1.0.0 — 2026-07-13 — Extracted from access-tab.js (max-file-lines)
+ *   v1.1.0 — 2026-07-25 — Readability pass: sort most-recently-used first, collapse the
+ *     scope-badge wall behind its count, and add a bulk revoke for long-unused grants.
+ *     (The duplicate rows that made this list unreadable are fixed server-side; this
+ *     keeps it readable once an owner legitimately connects a couple dozen apps.)
  */
 import { h } from 'preact';
-import { useState, useEffect, useCallback, useRef } from 'preact/hooks';
+import { useState, useEffect, useCallback, useRef, useMemo } from 'preact/hooks';
 import htm from 'htm';
 const html = htm.bind(h);
 import { t } from '/js/i18n.js';
@@ -15,6 +22,17 @@ import { escHtml } from '/js/utils.js';
 import { useConfirm } from '/components/Modal.js';
 import { apiGet, apiDelete } from '/js/api.js';
 
+// A grant untouched for this long is offered for bulk revoke. Long enough that a seasonal app
+// (something used a few times a year) is not swept away without the owner meaning to.
+const STALE_DAYS = 90;
+
+/** ms since the grant was last used, falling back to when it was granted (never-used grants). */
+function idleMs(g, now) {
+  const ts = g.last_used_at || g.granted_at;
+  const parsed = ts ? Date.parse(ts) : NaN;
+  return Number.isNaN(parsed) ? Infinity : now - parsed;
+}
+
 // Apps the owner has explicitly granted scoped access to (the H-2 app-grant flow). Each
 // holds its OWN revocable token bound to a narrow scope set — never the login session.
 export function ConnectedAppsSection({ showToast, initial }) {
@@ -22,6 +40,8 @@ export function ConnectedAppsSection({ showToast, initial }) {
   // `initial` (the app-grants slice of GET /v1/access/overview) seeds us so the mount does no fetch of
   // its own; live-update + post-revoke still reload via the individual endpoint. Absent → self-load.
   const [grants, setGrants] = useState(initial?.grants ?? null);
+  const [expanded, setExpanded] = useState(() => new Set());
+  const [busy, setBusy] = useState(false);
 
   const load = useCallback(async () => {
     try { const r = await apiGet('/v1/app-grants'); setGrants(r.data?.grants || []); }
@@ -37,6 +57,22 @@ export function ConnectedAppsSection({ showToast, initial }) {
     return () => window.removeEventListener('aimeat-live-update', handler);
   }, []);
 
+  // Most recently used first (never-used sink to the bottom by their grant date), so the apps that
+  // actually touch the owner's data are the ones they see without scrolling.
+  const { sorted, stale } = useMemo(() => {
+    const now = Date.now();
+    const list = [...(grants || [])].sort((a, b) => idleMs(a, now) - idleMs(b, now));
+    return { sorted: list, stale: list.filter(g => idleMs(g, now) > STALE_DAYS * 86400000) };
+  }, [grants]);
+
+  const toggleScopes = useCallback((id) => {
+    setExpanded((prev) => {
+      const next = new Set(prev);
+      if (next.has(id)) next.delete(id); else next.add(id);
+      return next;
+    });
+  }, []);
+
   const handleRevoke = useCallback((id, name) => {
     confirm(
       (t('profile.access.agConfirmRevoke') || 'Revoke access for "{name}"? It loses access immediately.').replace('{name}', name),
@@ -51,26 +87,66 @@ export function ConnectedAppsSection({ showToast, initial }) {
     );
   }, [confirm, showToast, load]);
 
+  // Bulk revoke of the stale set. Sequential DELETEs against the existing per-grant endpoint (no new
+  // API surface); partial failures are reported with the count that did go through, never swallowed.
+  const handleRevokeStale = useCallback(() => {
+    confirm(
+      (t('profile.access.agConfirmRevokeUnused') || 'Revoke access for {count} apps unused for over {days} days? They lose access immediately.')
+        .replace('{count}', String(stale.length)).replace('{days}', String(STALE_DAYS)),
+      async () => {
+        setBusy(true);
+        let done = 0, failed = 0;
+        for (const g of stale) {
+          try { await apiDelete('/v1/app-grants/' + g.grant_id); done++; }
+          catch { failed++; }
+        }
+        setBusy(false);
+        showToast(failed
+          ? (t('profile.access.agRevokedSome') || '{done} revoked, {failed} failed').replace('{done}', String(done)).replace('{failed}', String(failed))
+          : (t('profile.access.agRevokedCount') || '{count} app grants revoked').replace('{count}', String(done)));
+        load();
+      },
+      { danger: true },
+    );
+  }, [confirm, showToast, load, stale]);
+
   return html`
     <h3 class="card-h3 access-h3 mt-section">${t('profile.access.agTitle') || 'Connected Apps'}</h3>
     <div class="section-desc">${t('profile.access.agDesc') || 'Published apps you have granted scoped access to your data. Each holds its own revocable token — never your login session.'}</div>
 
+    ${stale.length > 0 && html`
+      <div class="access-empty-row">
+        <span class="text-meta-sm">
+          ${(t('profile.access.agUnusedNote') || '{count} of these have not been used in over {days} days.')
+            .replace('{count}', String(stale.length)).replace('{days}', String(STALE_DAYS))}
+        </span>
+        <button class="btn-outline btn-sm" disabled=${busy} onClick=${handleRevokeStale}>
+          ${(t('profile.access.agRevokeUnused') || 'Revoke {count} unused').replace('{count}', String(stale.length))}
+        </button>
+      </div>
+    `}
+
     ${grants === null
       ? html`<div class="empty">${t('profile.access.agLoading') || 'Loading...'}</div>`
-      : grants.length === 0
+      : sorted.length === 0
         ? html`<div class="access-empty-row"><span class="text-meta-sm">${t('profile.access.agEmpty') || 'No apps have access to your data.'}</span></div>`
-        : grants.map(g => html`
+        : sorted.map(g => html`
             <div class="card" key=${g.grant_id}>
               <div class="flex-between">
                 <div class="card-title">${escHtml(g.app_name || g.app)}</div>
-                <span class="badge badge-info">${(g.scopes || []).length} ${t('profile.access.agScopes') || 'scopes'}</span>
+                <button
+                  class="badge badge-info ag-scope-toggle"
+                  aria-expanded=${expanded.has(g.grant_id) ? 'true' : 'false'}
+                  title=${t('profile.access.agScopesToggle') || 'Show or hide the granted permissions'}
+                  onClick=${() => toggleScopes(g.grant_id)}
+                >${(g.scopes || []).length} ${t('profile.access.agScopes') || 'scopes'}</button>
               </div>
               <div class="card-subtitle access-mono">${escHtml(g.app_origin || '')}</div>
               <div class="detail-grid">
                 <div class="detail-item"><span class="detail-label">${t('profile.access.agGrantedAt') || 'Granted'}</span><span class="detail-value">${g.granted_at ? new Date(g.granted_at).toLocaleDateString() : '-'}</span></div>
                 <div class="detail-item"><span class="detail-label">${t('profile.access.agLastUsed') || 'Last used'}</span><span class="detail-value">${g.last_used_at ? new Date(g.last_used_at).toLocaleString() : (t('profile.access.agNever') || 'never')}</span></div>
               </div>
-              ${(g.scopes || []).length > 0 && html`
+              ${expanded.has(g.grant_id) && (g.scopes || []).length > 0 && html`
                 <div class="flex-row-wrap mt-half">
                   ${g.scopes.map(s => html`<span class="badge badge-muted" key=${s}>${escHtml(s)}</span>`)}
                 </div>

package/dist/public/views/profile/apps-tab.js

@@ -24,11 +24,12 @@ import { h } from 'preact';
 import { useState, useEffect, useRef, useCallback } from 'preact/hooks';
 import htm from 'htm';
 const html = htm.bind(h);
-import { t } from '/js/i18n.js';
+import { t, getLocale } from '/js/i18n.js';
 import { escHtml, handleImgError, timeAgo } from '/js/utils.js';
 import { Spinner } from './shared.js';
 import { useConfirm } from '/components/Modal.js';
 import { listApps, uploadApp, deleteApp, patchApp, deployAppAgent, undeployAppAgent, appAgentStatus } from '/js/services/apps.js';
+import { getMemory } from '/js/services/memory.js';
 import { listAgents } from '/js/services/agents.js';
 import { listOrganisms } from '/js/services/organisms.js';
 import * as skillsService from '/js/services/skills.js';
@@ -289,6 +290,8 @@ export default function AppsTab({ session, showToast, onStats }) {
   const [editDesc, setEditDesc] = useState('');
   const [editingAgents, setEditingAgents] = useState(null);
   const [agentsJson, setAgentsJson] = useState('');
+  // Promoted apps (from the owner's public app-catalog.promoted doc), keyed by "owner/filename".
+  const [promoted, setPromoted] = useState({});
 
   // Reload the app lists when the session becomes available / changes. loadData closes over the
   // optional onStats prop (not guaranteed memoized), so we key on session only to avoid re-running
@@ -306,6 +309,14 @@ export default function AppsTab({ session, showToast, onStats }) {
       setAllApps(list);
       onStats?.({ apps: own.length });
     } catch { setMyApps([]); setAllApps([]); }
+    // Promoted apps: read the owner's own app-catalog.promoted doc (soft = no 404 when unset).
+    try {
+      const res = await getMemory('app-catalog.promoted', { soft: true });
+      const items = res?.data?.value?.items;
+      const map = {};
+      if (Array.isArray(items)) items.forEach(it => { if (it && it.ref) map[it.ref] = it.text || {}; });
+      setPromoted(map);
+    } catch { setPromoted({}); }
   }
 
   async function handleUpload(file, description, screenshot, accessCode) {
@@ -480,12 +491,18 @@ export default function AppsTab({ session, showToast, onStats }) {
               ${a.protected ? html`<span class="badge badge-warn">\u{1F512}</span>` : ''}
               ${a.parked ? html`<span class="badge badge-dim">\u{1F17F}️ ${t('profile.apps.parkedBadge') || 'Parked'}</span>` : ''}
               ${a.manifest?.cortex?.agents?.length ? html`<span class="badge badge-info" title=${t('profile.apps.agentBadgeHint') || 'This app ships its own agent — deploy it onto your fleet below'}>\u{1F916} ${t('profile.apps.agentBadge') || 'Ships an agent'}</span>` : ''}
+              ${promoted[`${a.owner || session.owner}/${a.filename || a.name}`] ? html`<span class="badge badge-success" title=${t('profile.apps.promotedBadgeHint') || 'Promoted on your public profile — manage the pitch in the app catalog'}>\u{1F4E3} ${t('profile.apps.promotedBadge') || 'Promoted'}</span>` : ''}
               ${a.operator_hidden ? html`<span class="badge badge-danger">\u{1F6AB} ${t('profile.apps.operatorHiddenBadge') || 'Moderated by operator: hidden'}</span>` : ''}
             </div>
           </div>
           ${a.operator_hidden ? html`<div class="text-meta-sm mb-half">${t('profile.apps.operatorHiddenHint') || 'An operator has hidden this app from public view. Only you can still see it. Contact the operator to appeal.'}${a.operator_hide_reason ? ' — ' + escHtml(a.operator_hide_reason) : ''}</div>` : ''}
           ${a.parked ? html`<div class="text-meta-sm mb-half">${t('profile.apps.parkedHint') || 'Only you can see and use this — hidden from the public catalogue.'}</div>` : ''}
           ${a.manifest?.description ? html`<div class="text-meta mb-half">${escHtml(a.manifest.description)}</div>` : ''}
+          ${(() => {
+            const pt = promoted[`${a.owner || session.owner}/${a.filename || a.name}`];
+            const txt = pt ? (pt[getLocale()] || pt.en || pt.fi || '') : '';
+            return txt ? html`<div class="text-meta-sm mb-half">\u{1F4E3} ${escHtml(txt)}</div>` : '';
+          })()}
           <div class="card-subtitle">
             <a href="${NODE_URL}/v1/apps/${encodeURIComponent(a.owner || session.owner)}/${encodeURIComponent(a.filename || a.name)}" target="_blank">${t('profile.apps.download')}</a>
             ${a.size ? ' \u2022 ' + Math.round(a.size / 1024) + ' KB' : ''}

package/dist/public/views/profile/extensions-tab.maturity.js

@@ -36,5 +36,8 @@ export function maturityBadge(html, t, ledger, name) {
   const proven = proofs.map(pr => `${pr.model} → ${pr.verdict}${pr.tokens ? ' (' + Math.round(pr.tokens / 1000) + 'k)' : ''}`).join(', ');
   const title = t('profile.extensions.tier.' + p.modelTier)
     + ' · ' + (proofs.length ? t('profile.extensions.measuredOn') + ' ' + proven : t('profile.extensions.notMeasured'));
-  return html`<span class="ext-tier ext-tier-${p.modelTier}${proofs.length ? ' ext-tier-measured' : ''}" title=${title}>${p.modelTier}${proofs.length ? ' ✓' : ''}</span>`;
+  // Show the instruction ("READ THE DOC"), not the raw key — `needs-doc` reads as
+  // "documentation missing", which is the opposite of what the tier means.
+  const label = t('profile.extensions.tierLabel.' + p.modelTier) || p.modelTier;
+  return html`<span class="ext-tier ext-tier-${p.modelTier}${proofs.length ? ' ext-tier-measured' : ''}" title=${title}>${label}${proofs.length ? ' ✓' : ''}</span>`;
 }

package/dist/public/views/profile/inbox-tab/ai-actions.js

@@ -0,0 +1,86 @@
+/**
+ * @file public/views/profile/inbox-tab/ai-actions.js
+ * @description Builds the config objects behind the Inbox thread-head AI actions, so InboxTab's handlers
+ *   stay one-liners (and the file stays under max-file-lines). Two families:
+ *     - Reply with AI (TARGET-031): buildConversationReplyProps / buildMessageReplyProps → { title, build }
+ *       for ReplyWithAiPopover (build(mode) → copy/mcp prompt).
+ *     - Conversation → Notebook: buildConversationNotebookProps → { title, promptText, runServerSummary,
+ *       parkConversation } for ConversationToNotebookPopover. runServerSummary calls /v1/ai/complete on the
+ *       owner's own OpenRouter key (vision-aware, up to 8 images); parkConversation files the whole thread.
+ * @structure
+ *   - collectThreadImages(thread, urlMap) — [{messageId,id,name,url}] for every image attachment
+ *   - buildConversationReplyProps({ activeConv, thread, peerName, peerDisplayName })
+ *   - buildMessageReplyProps({ activeConv, msg, peerName })
+ *   - buildConversationNotebookProps({ activeConv, thread, urlMap, peerName, title })
+ * @usage
+ *   import { buildConversationNotebookProps } from './inbox-tab/ai-actions.js';
+ *   setNbConv(buildConversationNotebookProps({ activeConv, thread, urlMap, peerName, title }));
+ * @version-history
+ *   v1.0.0 — 2026-07-19 — Initial: extracted the Reply-with-AI + Conversation→Notebook assembly from inbox-tab.js.
+ */
+import { api } from '/js/api.js';
+import { t } from '/js/i18n.js';
+import { parkConversationToNotebook } from '/js/services/notebook.js';
+import { buildConversationReplyPrompt, buildMessageReplyPrompt, buildConversationSummaryPrompt } from '/js/services/messages-ai-prompts.js';
+import { attachKind } from './helpers.js';
+
+/** Reply-with-AI props for the whole open conversation (ReplyWithAiPopover: build(mode) → prompt). */
+export function buildConversationReplyProps({ activeConv, thread, peerName, peerDisplayName }) {
+  const src = { peerGhii: activeConv.peerGhii, subject: activeConv.subject, conversationId: activeConv.conversationId, thread, peerName };
+  return { title: `${t('inbox.ai.replyTo')} ${peerDisplayName}`, build: (mode) => buildConversationReplyPrompt(src, mode) };
+}
+
+/** Reply-with-AI props scoped to one message the user pointed at. */
+export function buildMessageReplyProps({ activeConv, msg, peerName }) {
+  const src = { peerGhii: activeConv.peerGhii, subject: activeConv.subject, conversationId: activeConv.conversationId, message: msg, peerName };
+  return { title: t('inbox.ai.replyToMessage'), build: (mode) => buildMessageReplyPrompt(src, mode) };
+}
+
+/** Every image attachment across the loaded thread, resolved to a viewable url (urlMap is keyed
+ *  `${messageId}::${attachmentId}`). Used both for the vision summary call and the notebook embeds. */
+export function collectThreadImages(msgs, urls) {
+  const out = [];
+  for (const m of (msgs || [])) {
+    for (const a of (m.attachments || [])) {
+      if (attachKind(a) !== 'image' || a.expired) continue;
+      const url = urls[`${m.id}::${a.id}`];
+      if (url) out.push({ messageId: m.id, id: a.id, name: a.name || a.storageKey || 'image', url });
+    }
+  }
+  return out;
+}
+
+/**
+ * Build the ConversationToNotebookPopover config for the open thread: the summary prompt, plus the
+ * server-summary and park callbacks (the popover picks the mode and calls back).
+ * @param {object} args
+ * @param {{ conversationId?:string, peerGhii?:string, subject?:string }} args.activeConv
+ * @param {Array} args.thread
+ * @param {Record<string,string>} args.urlMap
+ * @param {string} [args.peerName]
+ * @param {string} args.title
+ */
+export function buildConversationNotebookProps({ activeConv, thread, urlMap, peerName, title }) {
+  const src = { peerGhii: activeConv.peerGhii, subject: activeConv.subject, thread, peerName };
+  const images = collectThreadImages(thread, urlMap);
+  const promptText = buildConversationSummaryPrompt(src);
+  // Server-side summary on the owner's own OpenRouter key. Text-only on purpose: the thread's image
+  // attachments are JWT-presigned `/v1/download/…` urls that OpenRouter's servers can't fetch (→ 502),
+  // so we never send them to the model. The images are still captured into the notebook entry below
+  // (transcript embeds + source.attachments) for the owner to view; the durable value is the text.
+  const runServerSummary = async () => {
+    const resp = await api('/v1/ai/complete', {
+      method: 'POST',
+      body: JSON.stringify({ prompt: promptText }),
+      timeoutMs: 1_800_000,
+      retries: 0,
+    });
+    if (resp?.ok === false) throw new Error(resp.error?.message || t('inbox.failed'));
+    return resp?.data?.content || '';
+  };
+  const parkConversation = ({ summary }) => parkConversationToNotebook({
+    conv: { conversationId: activeConv.conversationId, peerGhii: activeConv.peerGhii, subject: activeConv.subject },
+    thread, peerName, summary, images,
+  });
+  return { title, promptText, runServerSummary, parkConversation };
+}

package/dist/public/views/profile/inbox-tab/components.js

@@ -6,6 +6,10 @@
  *   chat.commands), SchedulePanel (own-agent scheduler), and ReplyWithAiPopover (TARGET-031). Each is
  *   self-contained (owns its own hooks). Extracted from inbox-tab.js to satisfy max-file-lines.
  * @version-history
+ *   v1.9.0 — 2026-07-25 — MessageBubble gets a ⧉ copy action next to the other bubble buttons: copies the
+ *     message's raw markdown to the clipboard (✓ for ~1.6s as feedback).
+ *   v1.8.0 — 2026-07-21 — MessageBubble renders link-preview cards under the body (MessageLinkPreviews),
+ *     gated by the `showLinkPreviews` prop (the persisted thread-head toggle).
  *   v1.0.0 — 2026-07-13 — Extracted from inbox-tab.js (max-file-lines)
  *   v1.1.0 — 2026-07-14 — Composer: pasted/dropped images route to the file-attachment path (upload +
  *     shown as an image) instead of Toast UI base64-inlining them into the body (which blew the 50k
@@ -22,14 +26,20 @@
  *   v1.5.0 — 2026-07-18 — Mobile composer is a plain auto-growing textarea (`mode:'simple'`, no Toast UI
  *     toolbar/Write-Preview/WYSIWYG — a phone keyboard + heavy WYSIWYG is miserable); ≤760px opens straight
  *     into it so Toast UI never even loads there. Desktop keeps the rich editor.
+ *   v1.6.0 — 2026-07-19 — Composer gets an expand toggle (⤢/⤡): enlarges the editor to ~60% of the
+ *     viewport so long/formatted drafts are fully visible. Rich mode resizes via Toast UI `setHeight`;
+ *     the markdown fallback + simple textarea grow via the `.inbox-composer--tall` class / lifted cap.
+ *   v1.7.0 — 2026-07-19 — ConversationToNotebookPopover: capture a whole thread (with images) into the
+ *     Notebook via three modes — server-side AI summary (owner's key), copy-prompt (own chat), or raw.
  */
 import { h } from 'preact';
 import { useState, useEffect, useCallback, useRef } from 'preact/hooks';
 import htm from 'htm';
 const html = htm.bind(h);
 import { t } from '/js/i18n.js';
-import { escHtml } from '/js/utils.js';
+import { escHtml, copyToClipboard } from '/js/utils.js';
 import { Markdown } from '/components/Markdown.js';
+import { MessageLinkPreviews } from '/components/LinkPreview.js';
 import { minidenticon } from '/lib/minidenticons.min.js';
 import * as schedules from '/js/services/schedules.js';
 import { MODES } from '/js/services/messages-ai-prompts.js';
@@ -243,7 +253,18 @@ export function PollBuilder({ questions, setQuestions }) {
     </div>`;
 }
 
-export function MessageBubble({ msg, mine, urlMap, starred, onStar, onTrack, onPark, onReplyAi, onQuote, quoted, quotedName, onJumpTo, domId, tracked, onOpenMarkdown, answeredWith, onAnswer, submitting }) {
+export function MessageBubble({ msg, mine, urlMap, starred, onStar, onTrack, onPark, onReplyAi, onQuote, quoted, quotedName, onJumpTo, domId, tracked, onOpenMarkdown, answeredWith, onAnswer, submitting, showLinkPreviews }) {
+  // Copy the message text to the clipboard (the raw markdown the sender wrote — that's what pastes
+  // usefully into an AI chat or a document; the rendered body's presigned image URLs are transient).
+  const [copied, setCopied] = useState(false);
+  const copyTimer = useRef(null);
+  useEffect(() => () => { if (copyTimer.current) clearTimeout(copyTimer.current); }, []);
+  const copyBody = async () => {
+    await copyToClipboard(String(msg.body || ''));
+    setCopied(true);
+    if (copyTimer.current) clearTimeout(copyTimer.current);
+    copyTimer.current = setTimeout(() => setCopied(false), 1600);
+  };
   const nonInline = (msg.attachments || []).filter(a => !a.inline);
   const expiredIds = new Set((msg.attachments || []).filter(a => a.expired).map(a => a.id));
   // urlMap is keyed by `${messageId}::${attachmentId}` because per-message attachment ids (at0, at1…)
@@ -262,6 +283,9 @@ export function MessageBubble({ msg, mine, urlMap, starred, onStar, onTrack, onP
         <div class="inbox-bubble-actions">
           ${onQuote ? html`<button class="inbox-bubble-act" title=${t('inbox.quoteReply')}
             onClick=${() => onQuote(msg)}>↩</button>` : null}
+          <button class=${`inbox-bubble-act${copied ? ' inbox-bubble-act--on' : ''}`}
+            title=${copied ? t('inbox.copied') : t('inbox.copyMessage')}
+            aria-label=${t('inbox.copyMessage')} onClick=${copyBody}>${copied ? '✓' : '⧉'}</button>
           <button class=${`inbox-bubble-act${starred ? ' inbox-bubble-act--on' : ''}`} title=${t('inbox.markImportant')}
             onClick=${() => onStar?.(msg)}>${starred ? '⭐' : '☆'}</button>
           <button class=${`inbox-bubble-act${tracked ? ' inbox-bubble-act--on' : ''}`}
@@ -277,6 +301,7 @@ export function MessageBubble({ msg, mine, urlMap, starred, onStar, onTrack, onP
           <span class="inbox-quote-text">${escHtml(quoteSnippet(quoted.body))}</span>
         </button>` : null}
         <div class="inbox-bubble-body"><${Markdown} text=${prepareBody(msg.body, urls, expiredIds)} /></div>
+        ${showLinkPreviews ? html`<${MessageLinkPreviews} msg=${msg} />` : null}
         ${msg.interactive?.role === 'questions' ? (
           answeredWith
             ? html`<${InteractiveAnswered} spec=${msg.interactive} answers=${answeredWith.answers || {}} />`
@@ -310,6 +335,8 @@ export function Composer({ recipient, sendLabel, sending, onSend, initialText =
   const isNarrow = typeof window !== 'undefined' && window.matchMedia?.('(max-width: 760px)').matches;
   const [mode, setMode] = useState(isNarrow ? 'simple' : 'rich');
   const [md, setMd] = useState(seeded);
+  // Temporarily enlarge the editor (~60% of the viewport) so long/formatted drafts are fully visible.
+  const [expanded, setExpanded] = useState(false);
   const [files, setFiles] = useState([]);
   const containerRef = useRef(null);
   const editorRef = useRef(null);
@@ -419,10 +446,26 @@ export function Composer({ recipient, sendLabel, sending, onSend, initialText =
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [focusNonce]);
 
-  // Auto-grow the simple (mobile) textarea to fit its content, capped so it never eats the thread.
-  const autoGrow = (ta) => { if (!ta) return; ta.style.height = 'auto'; ta.style.height = Math.min(ta.scrollHeight, 132) + 'px'; };
-  // Size the simple textarea to any seeded draft on mount (and keep it 1 row when empty).
-  useEffect(() => { if (mode === 'simple') autoGrow(taRef.current); }, [mode]);
+  // Resize the Toast UI editor when the expand toggle flips (rich mode sets its own inline height via
+  // JS, so a CSS class can't reach it — the fallback/simple textareas are sized by `.inbox-composer--tall`
+  // in CSS instead). `160px` matches the construction default.
+  useEffect(() => {
+    if (mode !== 'rich' || !editorRef.current?.setHeight) return;
+    const tall = typeof window !== 'undefined' ? Math.round(window.innerHeight * 0.6) : 400;
+    try { editorRef.current.setHeight(expanded ? tall + 'px' : '160px'); } catch { /* noop */ }
+  }, [expanded, mode]);
+
+  // Auto-grow the simple (mobile) textarea to fit its content, capped so it never eats the thread. When
+  // expanded, the cap lifts to ~60vh so a long draft is fully visible.
+  const autoGrow = (ta) => {
+    if (!ta) return;
+    const cap = expanded && typeof window !== 'undefined' ? Math.round(window.innerHeight * 0.6) : 132;
+    ta.style.height = 'auto'; ta.style.height = Math.min(ta.scrollHeight, cap) + 'px';
+  };
+  // Size the simple textarea to any seeded draft on mount (and keep it 1 row when empty); re-fit when the
+  // expand cap changes.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  useEffect(() => { if (mode === 'simple') autoGrow(taRef.current); }, [mode, expanded]);
 
   const getText = () => (mode === 'rich' && editorRef.current) ? editorRef.current.getMarkdown() : md;
   const reset = () => {
@@ -441,7 +484,7 @@ export function Composer({ recipient, sendLabel, sending, onSend, initialText =
   });
 
   return html`
-    <div class="inbox-composer">
+    <div class="inbox-composer ${expanded ? 'inbox-composer--tall' : ''}">
       ${files.length > 0 ? html`<div class="inbox-file-chips">
         ${files.map((f, i) => html`<span class="inbox-file-chip" key=${f.name + i}>📎 ${escHtml(f.name)}
           <button class="inbox-bc-chip-x" title=${t('inbox.attachmentRemove')} onClick=${() => removeFile(i)}>✕</button></span>`)}
@@ -459,9 +502,13 @@ export function Composer({ recipient, sendLabel, sending, onSend, initialText =
             <div class="inbox-md-preview"><${Markdown} text=${md} /></div>
           </div>`}
       <div class="inbox-composer-bar">
-        <label class="inbox-attach-btn" title=${t('inbox.attach')}>
-          📎<input ref=${fileRef} type="file" multiple hidden onChange=${(e) => setFiles(Array.from(e.target.files || []))} />
-        </label>
+        <div class="inbox-bar-left">
+          <label class="inbox-attach-btn" title=${t('inbox.attach')}>
+            📎<input ref=${fileRef} type="file" multiple hidden onChange=${(e) => setFiles(Array.from(e.target.files || []))} />
+          </label>
+          <button type="button" class="inbox-attach-btn" title=${expanded ? t('inbox.collapse') : t('inbox.expand')}
+            aria-pressed=${expanded} onClick=${() => setExpanded((v) => !v)}>${expanded ? '⤡' : '⤢'}</button>
+        </div>
         <button class="btn-primary btn-sm" disabled=${sending || !recipient} onClick=${submit}>
           ${sending ? t('inbox.sending') : sendLabel}
         </button>
@@ -590,3 +637,87 @@ export function ReplyWithAiPopover({ title, build, onClose, showToast }) {
       </div>
     </div>`;
 }
+
+/* ── Conversation → Notebook — capture a WHOLE thread (with its images) into the notebook for later
+ *    filing/enrichment into a workspace. Three modes, all landing in parkConversationToNotebook:
+ *      ✨ ai   — summarize server-side with the owner's own OpenRouter key (runServerSummary), edit, park.
+ *      📋 copy — copy the summary prompt into the owner's own AI chat, paste the result back, park.
+ *      📥 raw  — park the whole chain (text + images) as-is; enrich it later in the Notebook.
+ *    The parent (InboxTab) owns the async work (AI call + park + toasts) via the passed callbacks. ── */
+export function ConversationToNotebookPopover({ title, promptText, runServerSummary, parkConversation, onClose, showToast }) {
+  const [mode, setMode] = useState('ai');       // 'ai' | 'copy' | 'raw'
+  const [copied, setCopied] = useState(false);
+  const [aiSummary, setAiSummary] = useState('');
+  const [pasted, setPasted] = useState('');
+  const [running, setRunning] = useState(false);
+  const [parking, setParking] = useState(false);
+
+  const copy = async () => {
+    try {
+      if (navigator.clipboard?.writeText) await navigator.clipboard.writeText(promptText);
+      else { const ta = document.createElement('textarea'); ta.value = promptText; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); ta.remove(); }
+      setCopied(true); setTimeout(() => setCopied(false), 1800);
+      showToast?.(t('inbox.ai.copied'));
+    } catch { showToast?.(t('inbox.failed'), true); }
+  };
+
+  const genSummary = async () => {
+    setRunning(true);
+    try {
+      const s = await runServerSummary();
+      if (s && s.trim()) setAiSummary(s.trim());
+      else showToast?.(t('inbox.notebook.summaryEmpty'), true);
+    } catch (e) { showToast?.(e?.message || t('inbox.failed'), true); }
+    finally { setRunning(false); }
+  };
+
+  const doPark = async (summary) => {
+    setParking(true);
+    try { await parkConversation({ summary: summary || '' }); showToast?.(t('inbox.notebook.parked')); onClose(); }
+    catch (e) { showToast?.(e?.message || t('inbox.failed'), true); setParking(false); }
+  };
+
+  return html`
+    <div class="inbox-ai-overlay" onClick=${onClose}>
+      <div class="inbox-ai-modal" onClick=${(e) => e.stopPropagation()}>
+        <div class="inbox-ai-head">
+          <span class="inbox-ai-title">📓 ${title}</span>
+          <button class="btn-ghost btn-sm" onClick=${onClose} title=${t('inbox.close')}>✕</button>
+        </div>
+        <div class="inbox-ai-modes">
+          <button class=${`inbox-ai-mode${mode === 'ai' ? ' inbox-ai-mode--on' : ''}`} onClick=${() => setMode('ai')}>✨ ${t('inbox.notebook.modeAi')}</button>
+          <button class=${`inbox-ai-mode${mode === 'copy' ? ' inbox-ai-mode--on' : ''}`} onClick=${() => setMode('copy')}>📋 ${t('inbox.notebook.modeCopy')}</button>
+          <button class=${`inbox-ai-mode${mode === 'raw' ? ' inbox-ai-mode--on' : ''}`} onClick=${() => setMode('raw')}>📥 ${t('inbox.notebook.modeRaw')}</button>
+        </div>
+        ${mode === 'ai' ? html`
+          <div class="inbox-ai-hint">${t('inbox.notebook.hintAi')}</div>
+          ${!aiSummary ? html`
+            <div class="inbox-ai-actions">
+              <button class="btn-primary btn-sm" disabled=${running} onClick=${genSummary}>${running ? '… ' + t('inbox.notebook.summarizing') : '✨ ' + t('inbox.notebook.genSummary')}</button>
+            </div>`
+          : html`
+            <textarea class="inbox-ai-text" rows="12" value=${aiSummary} onInput=${(e) => setAiSummary(e.target.value)}></textarea>
+            <div class="inbox-ai-actions">
+              <button class="btn-ghost btn-sm" disabled=${running} onClick=${genSummary}>${running ? '…' : '↻ ' + t('inbox.notebook.regen')}</button>
+              <button class="btn-primary btn-sm" disabled=${parking} onClick=${() => doPark(aiSummary)}>${parking ? '…' : '📓 ' + t('inbox.notebook.park')}</button>
+            </div>`}
+        ` : mode === 'copy' ? html`
+          <div class="inbox-ai-hint">${t('inbox.notebook.hintCopy')}</div>
+          <textarea class="inbox-ai-text" readOnly rows="8" value=${promptText}></textarea>
+          <div class="inbox-ai-actions">
+            <button class="btn-primary btn-sm" onClick=${copy}>${copied ? '✓ ' + t('inbox.ai.copied') : '📋 ' + t('inbox.ai.copy')}</button>
+          </div>
+          <div class="inbox-ai-hint">${t('inbox.notebook.pasteHint')}</div>
+          <textarea class="inbox-ai-text" rows="8" placeholder=${t('inbox.notebook.pastePh')} value=${pasted} onInput=${(e) => setPasted(e.target.value)}></textarea>
+          <div class="inbox-ai-actions">
+            <button class="btn-primary btn-sm" disabled=${parking || !pasted.trim()} onClick=${() => doPark(pasted)}>${parking ? '…' : '📓 ' + t('inbox.notebook.park')}</button>
+          </div>
+        ` : html`
+          <div class="inbox-ai-hint">${t('inbox.notebook.hintRaw')}</div>
+          <div class="inbox-ai-actions">
+            <button class="btn-primary btn-sm" disabled=${parking} onClick=${() => doPark('')}>${parking ? '…' : '📥 ' + t('inbox.notebook.parkRaw')}</button>
+          </div>
+        `}
+      </div>
+    </div>`;
+}

package/dist/public/views/profile/inbox-tab/helpers.js

@@ -5,11 +5,37 @@
  *   pixel defense), tracked-state labels, attachment classification, the interactive-answer summary +
  *   poll tally, and the lazy Toast UI editor loader. Extracted from inbox-tab.js to satisfy max-file-lines.
  * @version-history
+ *   v1.2.0 — 2026-07-21 — resolveThreadAttachmentUrls(): resolve non-inline attachment URLs for a loaded
+ *     thread (reusing the previous conversation's cache), extracted from inbox-tab loadThread.
  *   v1.1.0 — 2026-07-17 — quoteSnippet(): one-line plain-text excerpt of a message body for reply-quotes.
  *   v1.0.0 — 2026-07-13 — Extracted from inbox-tab.js (max-file-lines)
  */
 import { t, getLocale } from '/js/i18n.js';
 
+/**
+ * Resolve presigned URLs for a thread's non-inline attachments, reusing already-resolved URLs from the
+ * SAME conversation's previous cache (a refresh/new message must not re-download every existing image).
+ * Keyed by `${messageId}::${attachmentId}` (per-message ids repeat across messages). Inbound resolves the
+ * recipient's duplicated local copy; outbound resolves the original. `resolveUrl` = messages.attachmentUrl.
+ * Returns { convId, map } to store as the new cache.
+ */
+export async function resolveThreadAttachmentUrls(msgs, conversationId, prevCache, resolveUrl) {
+  const prev = prevCache?.convId === conversationId ? (prevCache.map || {}) : {};
+  const map = {};
+  await Promise.all(msgs.flatMap(m => (m.attachments || [])
+    .filter(a => !a.inline)
+    .map(async a => {
+      const uk = `${m.id}::${a.id}`;
+      if (prev[uk]) { map[uk] = prev[uk]; return; }
+      const key = (a.mode === 'duplicate' && a.localKey) ? a.localKey
+        : (m.direction === 'outbound' && a.storageKey) ? a.storageKey : null;
+      if (!key) return;
+      const u = await resolveUrl(key).catch(() => null);
+      if (u) map[uk] = u;
+    })));
+  return { convId: conversationId, map };
+}
+
 /* Lazy-load the vendored Toast UI Editor (MIT, /lib/toastui/) — the same editor the workspace
  * document space uses, so composing a message feels like editing a document (Markdown⇄WYSIWYG).
  * ~520KB, so it stays out of the main bundle and loads only when the Inbox composer mounts. */

package/dist/public/views/profile/inbox-tab/panels.js

@@ -6,6 +6,11 @@
  *   (broadcast/poll results). Each is a presentational component driven entirely by props from InboxTab;
  *   the stateful container keeps all hooks. Extracted from inbox-tab.js to satisfy max-file-lines.
  * @version-history
+ *   v1.4.0 — 2026-07-21 — ThreadPanel head: "Show all messages / Last 50" toggle (threadAll/
+ *     toggleThreadAll), shown once a thread has ≥50 messages. Threads default to the full history;
+ *     the toggle collapses to the newest 50.
+ *   v1.3.0 — 2026-07-21 — ThreadPanel: link-preview toggle button in the head (showLinkPreviews /
+ *     toggleLinkPreviews) + passes the flag down to each MessageBubble.
  *   v1.2.0 — 2026-07-18 — Clicking ↩ Reply on a bubble now focuses the composer (via `onQuoteReply` +
  *     `composerFocus` bump) so the cursor lands in the input; the ✕ cancel still uses the raw setter.
  *   v1.1.0 — 2026-07-17 — Reply-to with quote: ThreadPanel resolves each message's `replyToId` to the
@@ -99,8 +104,9 @@ export function ThreadPanel({
   activeConv, thread, urlMap, important, trackedByMsg, awaitingForConv, awaitingDrafts,
   schedOpen, setSchedOpen, cmdFill, agentCommands, sending, draftPrefill, prefillNonce, msgsRef,
   peerDisplay, showToast, toggleImportant, onTrackMsg, onParkMsg, openMessageAi, submitInteractiveAnswers,
-  setMdViewer, openConversationAi, insertCommand, setCmdFill, cancelTracked, openRecord, startSuggestedReply, doSend,
-  replyQuote, setReplyQuote, onQuoteReply, composerFocus,
+  setMdViewer, openConversationAi, openConversationNotebook, insertCommand, setCmdFill, cancelTracked, openRecord, startSuggestedReply, doSend,
+  replyQuote, setReplyQuote, onQuoteReply, composerFocus, showLinkPreviews, toggleLinkPreviews,
+  threadAll, toggleThreadAll,
 }) {
   let lastDay = '';
   // Reply-to quotes: resolve a message's `replyToId` to the original within the loaded page (a parent
@@ -142,6 +148,15 @@ export function ThreadPanel({
           <div class="inbox-sub">${escHtml(activeConv.peerGhii)}</div>
         </div>
         ${!viaAgentName ? html`<button class="btn-ghost btn-sm inbox-ai-btn" onClick=${openConversationAi} title=${t('inbox.ai.replyWithAi')}>✨ <span class="inbox-ai-btn-label">${t('inbox.ai.replyWithAi')}</span></button>` : null}
+        ${!viaAgentName ? html`<button class="btn-ghost btn-sm inbox-ai-btn" onClick=${openConversationNotebook} title=${t('inbox.notebook.toNotebook')}>📓 <span class="inbox-ai-btn-label">${t('inbox.notebook.toNotebookShort')}</span></button>` : null}
+        <button class=${`btn-ghost btn-sm inbox-linkprev-toggle${showLinkPreviews ? ' inbox-linkprev-toggle--on' : ''}`}
+          aria-pressed=${!!showLinkPreviews} onClick=${toggleLinkPreviews}
+          title=${showLinkPreviews ? t('inbox.linkPreview.hideAll') : t('inbox.linkPreview.showAll')}>
+          <span class="inbox-ai-btn-label">${t('inbox.linkPreview.label')}</span></button>
+        ${(thread.length >= 50) ? html`<button class=${`btn-ghost btn-sm inbox-linkprev-toggle${threadAll ? ' inbox-linkprev-toggle--on' : ''}`}
+          aria-pressed=${!!threadAll} onClick=${toggleThreadAll}
+          title=${threadAll ? t('inbox.thread.showRecent') : t('inbox.thread.showAll')}>
+          <span class="inbox-ai-btn-label">${threadAll ? t('inbox.thread.showRecent') : t('inbox.thread.showAll')}</span></button>` : null}
         ${peerIsMyAgent && !viaAgentName ? html`<button class=${`btn-ghost btn-sm inbox-sched-btn${schedOpen ? ' inbox-sched-btn--on' : ''}`}
           onClick=${() => setSchedOpen(o => !o)} title=${t('inbox.schedTitle')}>📅</button>` : null}
       </div>
@@ -159,7 +174,7 @@ export function ThreadPanel({
               onQuote=${(onQuoteReply && !activeConv.viaAgent) ? onQuoteReply : null}
               starred=${important.has(m.id)} onStar=${toggleImportant} onTrack=${onTrackMsg} onPark=${onParkMsg} onReplyAi=${openMessageAi} tracked=${trackedByMsg[m.id]}
               answeredWith=${m.interactive?.role === 'questions' ? answersByQ[m.id] : null}
-              onAnswer=${submitInteractiveAnswers} submitting=${sending}
+              onAnswer=${submitInteractiveAnswers} submitting=${sending} showLinkPreviews=${showLinkPreviews}
               onOpenMarkdown=${(url, name) => setMdViewer({ url, name })} />`;
         })}
       </div>