@molecule/app-ide-react 1.6.0 → 1.8.0

package/dist/components/ChatPanel.js

@@ -135,6 +135,7 @@ function renderCardSegment(seg, key) {
 }
 /** All stream event types that can trigger a notification sound. */
 const SOUND_EVENTS = [
+    'message',
     'done',
     'error',
     'tool_result',
@@ -147,6 +148,7 @@ const SOUND_EVENTS = [
 ];
 /** User-friendly labels for each sound event (used as i18n defaultValues). */
 const SOUND_EVENT_LABELS = {
+    message: 'Team message',
     done: 'Response complete',
     error: 'Error',
     tool_result: 'Tool finished',
@@ -159,6 +161,7 @@ const SOUND_EVENT_LABELS = {
 };
 /** Brief descriptions for each sound event. */
 const SOUND_EVENT_DESCRIPTIONS = {
+    message: 'A teammate posted a team-only note',
     done: '{{agentName}} finished responding',
     error: 'Something went wrong during a response',
     tool_result: 'A tool call (file read, command, etc.) completed',
@@ -176,7 +179,10 @@ const SOUND_MODE_LABELS = {
     whenNotFocused: 'when not focused',
     always: 'always',
 };
+/** Per-device sounds preference (see the soundsConfig state comment). */
+const SOUNDS_STORAGE_KEY = 'molecule.ide.sounds';
 const DEFAULT_SOUNDS_CONFIG = {
+    message: 'always',
     done: 'whenNotFocused',
     error: 'whenNotFocused',
     tool_result: 'off',
@@ -191,8 +197,13 @@ let audioCtx = null;
 /**
  * Play a short notification tone using the Web Audio API.
  * Creates the AudioContext lazily on first call (after user interaction).
+ *
+ * The default variant is a single 660 Hz blip (status events). The `team`
+ * variant is the SAME blip an octave up (1320 Hz) — recognizably "a message,
+ * not a status event" while staying consistent with the sound family.
+ * @param variant - Which tone to play.
  */
-function playTone() {
+function playTone(variant = 'default') {
     try {
         if (!audioCtx)
             audioCtx = new AudioContext();
@@ -201,8 +212,12 @@ function playTone() {
         osc.connect(gain);
         gain.connect(audioCtx.destination);
         osc.type = 'sine';
-        osc.frequency.value = 660;
-        gain.gain.setValueAtTime(0.15, audioCtx.currentTime);
+        osc.frequency.value = variant === 'team' ? 1320 : 660;
+        // Equal-loudness compensation: hearing is far more sensitive near 1–4 kHz
+        // than at 660 Hz, so the octave-up tone needs roughly half the amplitude
+        // to sound the same volume as the default blip.
+        const peak = variant === 'team' ? 0.08 : 0.15;
+        gain.gain.setValueAtTime(peak, audioCtx.currentTime);
         gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.15);
         osc.start(audioCtx.currentTime);
         osc.stop(audioCtx.currentTime + 0.15);
@@ -928,7 +943,7 @@ export function CommitCardItem({ card, onRevert, }) {
  * @returns The rendered message item.
  */
 const MessageItem = memo(function MessageItem(props) {
-    const { msg, sendMessage, handleAskUserResponse, isLoading, streamingStatus, onNavigatePreview, undoneTcIds, handleUndoToggle, onFileOpen, onFileDoubleClick, onFileDiff, handleFileRevert, setInputAndCursorEnd, setModelPicker, userAvatar, onAvatarClick, discovery, buildUpgradeCta, agentName, } = props;
+    const { msg, sendMessage, handleAskUserResponse, isLoading, streamingStatus, onNavigatePreview, undoneTcIds, handleUndoToggle, onFileOpen, onFileDoubleClick, onFileDiff, handleFileRevert, setInputAndCursorEnd, setModelPicker, chatMode, userAvatar, onAvatarClick, discovery, buildUpgradeCta, agentName, canEdit, } = props;
     const cm = getClassMap();
     const themeMode = useThemeMode();
     const isLight = themeMode === 'light';
@@ -1006,13 +1021,30 @@ const MessageItem = memo(function MessageItem(props) {
                                         defaultValue: 'Team only — visible to your team; {{agentName}} will ignore it',
                                     }), "aria-label": t('ide.chat.teamOnly.badge', { agentName: agentName ?? 'the assistant' }, {
                                         defaultValue: 'Team only — visible to your team; {{agentName}} will ignore it',
-                                    }), style: { display: 'inline-flex', alignSelf: 'center', flexShrink: 0 }, "data-mol-id": "chat-team-only-badge", children: _jsx(Icon
-                                    // Same size as the username text (textSize('sm') ≈ 14px) so the
-                                    // badge reads as part of the header line, not a footnote.
+                                    }), 
+                                    // Centered in the header row with a -0.5px optical nudge. Platform
+                                    // font metrics make a single integer offset impossible: against
+                                    // plain center, macOS rendered the glyph ~1px low and Ubuntu spot-on
+                                    // (measured in Brave on both, 2026-08-27), so -0.5 splits the
+                                    // difference — each platform lands within half a pixel, and retina
+                                    // displays render the half-pixel crisply. (Baseline alignment was
+                                    // tried and rode too HIGH: a text-less inline-flex item's
+                                    // synthesized baseline is its bottom edge.)
+                                    style: {
+                                        display: 'inline-flex',
+                                        alignSelf: 'center',
+                                        flexShrink: 0,
+                                        position: 'relative',
+                                        top: -0.5,
+                                    }, "data-mol-id": "chat-team-only-badge", children: _jsx(Icon
+                                    // 16px so the glyph reads at the username's optical size — the
+                                    // people glyph has internal viewBox padding, so a nominal 14px
+                                    // renders visibly smaller than the 14px text next to it.
                                     , { 
-                                        // Same size as the username text (textSize('sm') ≈ 14px) so the
-                                        // badge reads as part of the header line, not a footnote.
-                                        name: "people", size: 14, "aria-hidden": "true", style: { color: NOTICE_TONE.gold.accent } }) })), typeof msg.timestamp === 'number' && (_jsx("span", { className: cm.textMuted, style: { fontSize: 11 }, children: relativeTimeLong(msg.timestamp) }))] })), _jsx(CollapsibleUserMessage, { content: msg.content, isLight: isLight }), msg.attachments && msg.attachments.length > 0 && (_jsx("div", { style: { marginTop: 4, display: 'flex', gap: 4, flexWrap: 'wrap' }, children: msg.attachments.map((att, ai) => (_jsxs("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { display: 'inline-flex', alignItems: 'center', gap: 2 }, children: [att.mediaType.startsWith('image/')
+                                        // 16px so the glyph reads at the username's optical size — the
+                                        // people glyph has internal viewBox padding, so a nominal 14px
+                                        // renders visibly smaller than the 14px text next to it.
+                                        name: "people", size: 16, "aria-hidden": "true", style: { color: NOTICE_TONE.gold.accent } }) })), typeof msg.timestamp === 'number' && (_jsx("span", { className: cm.textMuted, style: { fontSize: 11 }, children: relativeTimeLong(msg.timestamp) }))] })), _jsx(CollapsibleUserMessage, { content: msg.content, isLight: isLight }), msg.attachments && msg.attachments.length > 0 && (_jsx("div", { style: { marginTop: 4, display: 'flex', gap: 4, flexWrap: 'wrap' }, children: msg.attachments.map((att, ai) => (_jsxs("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { display: 'inline-flex', alignItems: 'center', gap: 2 }, children: [att.mediaType.startsWith('image/')
                                         ? '\uD83D\uDDBC\uFE0F'
                                         : att.mediaType.startsWith('audio/')
                                             ? '\uD83C\uDFB5'
@@ -1091,11 +1123,11 @@ const MessageItem = memo(function MessageItem(props) {
                     const tc = msg.toolCalls?.find((c) => c.id === block.id);
                     if (!tc)
                         return null;
-                    return (_jsx("div", { style: { marginTop: '4px' }, children: _jsx(ToolCallCard, { id: tc.id, name: tc.name, input: tc.input, output: tc.output, status: tc.status, fileDiff: tc.fileDiff, isUndone: undoneTcIds.has(tc.id), onUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: handleFileRevert, onAskUserResponse: handleAskUserResponse }) }, tc.id));
+                    return (_jsx("div", { style: { marginTop: '4px' }, children: _jsx(ToolCallCard, { id: tc.id, name: tc.name, input: tc.input, output: tc.output, status: tc.status, fileDiff: tc.fileDiff, isUndone: undoneTcIds.has(tc.id), onUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: canEdit === false ? undefined : handleFileRevert, onAskUserResponse: canEdit === false ? undefined : handleAskUserResponse }) }, tc.id));
                 })) : msg.content ? (_jsx(MarkdownContent, { text: msg.content, isStreaming: msg.isStreaming, statusLabel: msg.isStreaming ? streamingStatus : undefined, statusStartedAt: typeof msg.timestamp === 'number' ? msg.timestamp : undefined, onNavigatePreview: onNavigatePreview, hideStreamingIndicator: true })) : null, msg.toolCalls &&
                     msg.toolCalls.length > 0 &&
                     (!msg.blocks || msg.blocks.length === 0) &&
-                    msg.toolCalls.map((tc) => (_jsx(ToolCallCard, { id: tc.id, name: tc.name, input: tc.input, output: tc.output, status: tc.status, fileDiff: tc.fileDiff, isUndone: undoneTcIds.has(tc.id), onUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: handleFileRevert, onAskUserResponse: handleAskUserResponse }, tc.id))), msg.aborted && (_jsx("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { display: 'block', marginTop: 4, fontStyle: 'italic' }, children: t('ide.chat.responseStopped', undefined, {
+                    msg.toolCalls.map((tc) => (_jsx(ToolCallCard, { id: tc.id, name: tc.name, input: tc.input, output: tc.output, status: tc.status, fileDiff: tc.fileDiff, isUndone: undoneTcIds.has(tc.id), onUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: canEdit === false ? undefined : handleFileRevert, onAskUserResponse: canEdit === false ? undefined : handleAskUserResponse }, tc.id))), msg.aborted && (_jsx("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { display: 'block', marginTop: 4, fontStyle: 'italic' }, children: t('ide.chat.responseStopped', undefined, {
                         defaultValue: 'Response stopped',
                     }) })), msg.loopLimitReached &&
                     !msg.isStreaming &&
@@ -1107,7 +1139,7 @@ const MessageItem = memo(function MessageItem(props) {
                                 }),
                                 action: () => {
                                     setInputAndCursorEnd('/model ');
-                                    setModelPicker({ selectedIdx: -1 });
+                                    setModelPicker({ selectedIdx: -1, mode: chatMode });
                                 },
                             },
                             {
@@ -1186,11 +1218,15 @@ const MessageItem = memo(function MessageItem(props) {
  * @param props - Component props (see {@link MessageItemProps}).
  * @returns The rendered chat inner component.
  */
-function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent, isPro, isAnonymous, canEdit, buildUpgradeCta, buildHelpUpgradeSection, activeFile, openTabs, onFileOpen, onFileDoubleClick, onFileDiff, onFileRevert, onFileChange, onFileDeleted, onCommit, onConversationId, onActivityClick, onRenderError, onProfileClick, currentUserId, onReadyToBuild, awaitingSandboxBoot, onClientAction, onTurnComplete, onLoadingChange, onNavigatePreview, onRegisterPushHandler, autoSubmitSignal, openSettingsSignal, onManageCustomModels, modelSelectionSignal, openReportSignal, openShareSignal, initialInputValue, pendingMessage, pendingMessageKey, pendingMessageSuppressUser, pendingMessageUserInitiated, userEditedFile, userEditedFileKey, gitStatusTick: externalGitStatusTick, discovery, userAvatar, agentName = DEFAULT_AGENT_NAME, productName = DEFAULT_PRODUCT_NAME, version, extraCommands,
+function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent, isPro, isAnonymous, canEdit, canShare, buildUpgradeCta, buildHelpUpgradeSection, activeFile, openTabs, onFileOpen, onFileDoubleClick, onFileDiff, onFileRevert, onFileChange, onFileDeleted, onCommit, onConversationId, onActivityClick, onRenderError, onProfileClick, currentUserId, onReadyToBuild, awaitingSandboxBoot, onClientAction, onTurnComplete, onLoadingChange, onNavigatePreview, onRegisterPushHandler, autoSubmitSignal, openSettingsSignal, onManageCustomModels, modelSelectionSignal, openReportSignal, openShareSignal, initialInputValue, pendingMessage, pendingMessageKey, pendingMessageSuppressUser, pendingMessageUserInitiated, userEditedFile, userEditedFileKey, gitStatusTick: externalGitStatusTick, discovery, userAvatar, agentName = DEFAULT_AGENT_NAME, productName = DEFAULT_PRODUCT_NAME, version, extraCommands,
 // feedbackUrl: prop kept for back-compat (callers still pass it), but no longer
 // consumed here — its only use was the command-menu footer link removed in P3-21.
  }) {
     const cm = getClassMap();
+    // Share-link management may be gated ABOVE canEdit by the host (molecule.dev
+    // mints/lists/revokes at admin+) — every /share surface below uses this, so
+    // an editor without the capability gets no dead modal.
+    const shareAllowed = canShare ?? canEdit !== false;
     const themeMode = useThemeMode();
     const isLight = themeMode === 'light';
     // Phone-width / touch-first branches: popovers cap with dvh, hover-revealed
@@ -1265,16 +1301,11 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             clearInterval(autoFixIntervalRef.current);
     }, []);
     // Ref so the stream-event callback can push activity cards without depending
-    // on the state setter (mirrors appendCardMessageRef).
+    // on the state setter.
     const addActivityCardRef = useRef(() => { });
-    // Ref to useChat's appendCardMessage, so the broadcast path (a teammate's `card` event,
-    // applied through handleStreamEvent) can append a card-message to the ONE message store.
-    // This client's OWN `card` events are appended internally by useChat's stream handler.
-    const appendCardMessageRef = useRef(() => { });
-    // Ref to useChat's appendCompleteMessage — same contract as appendCardMessageRef, for a
-    // teammate's broadcast `message` event (a complete non-streaming message, e.g. a
-    // human-only team note). This client's OWN `message` events append internally in useChat.
-    const appendCompleteMessageRef = useRef(() => { });
+    // (A teammate's broadcast `card` / `message` events are ingested by
+    // useChat.applyRemoteEvent — applyPushedStreamEvent routes every pushed frame
+    // through it before this panel's handler runs, so no append refs live here.)
     // Kept current each render so handleStreamEvent (memoized) always calls the latest.
     const onReadyToBuildRef = useRef(onReadyToBuild);
     onReadyToBuildRef.current = onReadyToBuild;
@@ -1292,9 +1323,15 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 contextWindow: event.usage.contextWindow,
             });
         }
-        // Capture verification errors to trigger countdown after stream ends.
+        // Capture verification errors to trigger countdown after stream ends —
+        // SENDER-ONLY: a pushed frame from a teammate's turn must not arm this
+        // client's auto-fix (the sender's client owns the follow-up; two clients
+        // arming it would double-send the fix).
         // Also drop any deferred preview error — verification's countdown handles it.
-        if (event.type === 'verification_result' && event.status === 'error' && event.output) {
+        if (!applyingPushedRef.current &&
+            event.type === 'verification_result' &&
+            event.status === 'error' &&
+            event.output) {
             pendingVerificationRef.current = {
                 output: event.output,
                 categories: event.categories ?? [],
@@ -1312,22 +1349,9 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         if (event.type === 'verification_result' && event.status === 'ok') {
             pendingVerificationRef.current = null;
         }
-        // Inline transcript CARD (model / mode / skills / custom notice). The server records it
-        // into the ONE message transcript and emits it here; this client's OWN stream appends
-        // the card-message via useChat (case 'card'). Here we ONLY handle a TEAMMATE's broadcast
-        // (applied through applyPushedStreamEvent → handleStreamEvent): append it to the local
-        // store so it shows live for the collaborator too (de-duped by id; never re-persisted —
-        // the originating server already persisted it, and on reload it loads with the messages).
-        if (event.type === 'card' && applyingPushedRef.current) {
-            appendCardMessageRef.current(event.id, event.timestamp, event.card);
-        }
-        // A teammate's broadcast complete message (e.g. a human-only team note) — append it
-        // to the local store so it shows live for the collaborator too (de-duped by id;
-        // never re-persisted — the originating server already persisted it). This client's
-        // OWN `message` stream events are appended internally by useChat.
-        if (event.type === 'message' && applyingPushedRef.current && event.message) {
-            appendCompleteMessageRef.current(event.message);
-        }
+        // NOTE: pushed `card` / `message` events are ingested into the message store by
+        // useChat.applyRemoteEvent (applyPushedStreamEvent calls it before this handler),
+        // through the same append helpers as an own stream — no panel-side append here.
         // Captured outbound side effect (email/sms/push/webhook/channel) — push an
         // inline activity card into the timeline. Non-text card, mirroring how
         // system cards are appended.
@@ -1335,9 +1359,11 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             addActivityCardRef.current(activityFromEvent(event.activity));
         }
         // Discovery finished and the server selected a starting point — boot the
-        // sandbox. The template choice is internal; this event carries no
-        // user-facing payload and is never rendered in the transcript.
-        if (event.type === 'ready_to_build') {
+        // sandbox. SENDER-ONLY: the sender's client drives the boot; a watching
+        // client's host follows the project's sandbox status instead of racing a
+        // second boot request. The template choice is internal; this event carries
+        // no user-facing payload and is never rendered in the transcript.
+        if (event.type === 'ready_to_build' && !applyingPushedRef.current) {
             onReadyToBuildRef.current?.();
         }
         // The agent asked the IDE to reload/navigate the preview, open a file, or drive the
@@ -1375,8 +1401,11 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         // still drives the phase STATE (useChat's setMode); it just no longer spawns a card.
         const cfg = soundsConfigRef.current;
         const eventType = event.type;
-        if (eventType in cfg && shouldPlaySound(cfg[eventType])) {
-            playTone();
+        // 'message' is the team-note ping: it fires only for a TEAMMATE's note
+        // (the pushed broadcast) — never for the sender's own SSE echo.
+        const isOwnTeamNote = event.type === 'message' && !applyingPushedRef.current;
+        if (!isOwnTeamNote && eventType in cfg && shouldPlaySound(cfg[eventType])) {
+            playTone(eventType === 'message' ? 'team' : 'default');
         }
     }, [t]);
     // Countdown timer effect — ticks down and auto-sends fix message
@@ -1462,10 +1491,13 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         }
         onFileChange?.(path, content);
     }, [onFileChange, onFileOpen, autoFixCountdown]);
-    const { messages, isLoading, isRemoteStreaming, noteRemoteStreamEvent, error, errorMeta, mode, fastMode, streamingStatus, setMode, setFastMode, sendMessage, abort, clearHistory, editQueuedMessage, deleteQueuedMessage, clearQueuedForFile, appendCardMessage, appendCompleteMessage, retryCountdown, cancelRetry, } = useChat({
+    const { messages, isLoading, isRemoteStreaming, noteRemoteStreamEvent, error, errorMeta, mode, fastMode, streamingStatus, setMode, setFastMode, sendMessage, abort, clearHistory, editQueuedMessage, deleteQueuedMessage, clearQueuedForFile, applyRemoteEvent, retryCountdown, cancelRetry, } = useChat({
         endpoint,
         projectId,
         agentName,
+        // A read-only viewer never issues chat POSTs (no resume/retry) — a live turn
+        // is watched via pushed frames + the reconcile poll instead.
+        readOnly: canEdit === false,
         // ALWAYS load history on mount. A persisted conversation MUST restore on refresh,
         // even when an initialMessage / initialInputValue is also present. The old condition
         // suppressed the load whenever a fresh message was about to be auto-sent — but on a
@@ -1483,13 +1515,23 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         onConversationId,
         onStreamEvent: handleStreamEvent,
     });
+    // The mode a model CHANGE should target when the user hasn't scoped one
+    // explicitly (no --plan/--execute flag, no picker-mode choice): the LIVE
+    // conversation mode. Discovery runs in plan mode (aiContext.mode is 'plan'
+    // throughout discovery), so it maps to 'plan' — changing the model while
+    // discovering/planning changes the plan model, while building the execute
+    // model. This replaces the old default of writing the legacy `chatModel`
+    // (which silently moved BOTH modes).
+    const liveModelMode = mode === 'plan' ? 'plan' : 'execute';
+    // Target for a settings PATCH that changes agent behavior (model / effort /
+    // max loops / region / auto-fix / auto-approve): name the OPEN conversation so
+    // the server's shared setting card lands in the transcript members are
+    // actually watching (a project can hold several conversations).
+    const settingsPatchUrl = useCallback(() => `/projects/${projectId}${conversationIdRef.current
+        ? `?conversationId=${encodeURIComponent(conversationIdRef.current)}`
+        : ''}`, [projectId]);
     // Keep sendMessageRef in sync so the countdown effect can call the latest sendMessage
     sendMessageRef.current = sendMessage;
-    // Keep the card-append ref current so handleStreamEvent (memoized) can append a teammate's
-    // broadcast `card` event to the message store.
-    appendCardMessageRef.current = appendCardMessage;
-    // Same for a teammate's broadcast complete `message` event (e.g. a team note).
-    appendCompleteMessageRef.current = appendCompleteMessage;
     // User Stop. A stop is a user decision the platform must not overrule — so
     // beyond killing the stream (useChat.abort also records the stop client-side
     // and, via chat-abort's userInitiated flag, server-side), drop every pending
@@ -1627,7 +1669,15 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
     useEffect(() => {
         if (typeof window !== 'undefined' && window.matchMedia?.('(pointer: coarse)').matches)
             return;
-        textareaRef.current?.focus();
+        const ta = textareaRef.current;
+        if (!ta)
+            return;
+        ta.focus();
+        // The textarea can mount with content already in it (defaultValue carries a
+        // persisted draft, and a viewer's box holds the '/teamsay ' prefill) — a
+        // fresh element's selection is (0,0), so without this the caret sits BEFORE
+        // the text and typing lands in front of '/teamsay'.
+        ta.setSelectionRange(ta.value.length, ta.value.length);
     }, []);
     /** Update the ref, the DOM element, and the hasInput flag without re-rendering the parent. */
     const setInputValue = useCallback((val) => {
@@ -1635,7 +1685,10 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         const ta = textareaRef.current;
         if (ta && ta.value !== val)
             ta.value = val;
-        setHasInput(Boolean(val.trim()));
+        // A viewer's composer is pre-filled with '/teamsay ' — the BARE prefix is
+        // not sendable content, so it must not light the Send button.
+        const bareSideChannel = canEdit === false && /^\/(?:teamsay|t)$/i.test(val.trim());
+        setHasInput(Boolean(val.trim()) && !bareSideChannel);
         autoResize();
         // Clear persisted draft when input is emptied (e.g. on submit)
         if (!val) {
@@ -1646,7 +1699,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 /* sessionStorage unavailable — safe to ignore, draft simply persists */
             }
         }
-    }, [draftKey, autoResize]);
+    }, [draftKey, autoResize, canEdit]);
     // Persist draft text to sessionStorage so it survives refresh (debounced)
     const draftTimerRef = useRef(null);
     const persistDraft = useCallback(() => {
@@ -2168,17 +2221,24 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         }
     }, []);
     // Apply a chat event broadcast by another project member (the chat push channel). The
-    // originating member's SERVER already persisted everything (the transcript card-messages and
-    // the activity cards); this viewer only renders the broadcast live and gets the durable copy
-    // on reload. A pushed `card` event appends an ephemeral card-message (never persisted by this
-    // viewer); a pushed `activity` is flagged `received` so it renders but is not re-PUT.
+    // originating member's SERVER already persisted everything; this client renders the
+    // broadcast live and gets the durable copy on reload. EVERY frame of a remote turn
+    // arrives here — text/thinking deltas, tool events, verification, cards, the user
+    // message, done — and is ingested into the message store through useChat's
+    // applyRemoteEvent (the same content applier as an own SSE stream), so watching a
+    // teammate's turn looks exactly like running one. handleStreamEvent then handles the
+    // panel-level concerns (context usage, sounds, activity cards) with the
+    // applyingPushed flag gating the sender-only side effects (auto-fix, ready_to_build).
     const applyPushedStreamEvent = useCallback((frameConversationId, event) => {
         // Only apply broadcasts for the conversation this panel has open.
         if (frameConversationId !== conversationIdRef.current)
             return;
-        // Flag the window so a pushed activity card is marked `received` (rendered, not re-PUT);
-        // a pushed card-message is appended ephemerally. handleStreamEvent is synchronous, so the
-        // flag is set for exactly this event's handling.
+        // Store ingestion first, so the transcript is current before any panel
+        // side effect reads it.
+        applyRemoteEvent(event);
+        // Flag the window so a pushed activity card is marked `received` (rendered, not
+        // re-PUT) and sender-only side effects are skipped. handleStreamEvent is
+        // synchronous, so the flag is set for exactly this event's handling.
         applyingPushedRef.current = true;
         try {
             handleStreamEvent(event);
@@ -2191,7 +2251,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         // continuation), tell useChat so it confirms against the server's streaming
         // flag and keeps the Stop button visible + functional for the remote turn.
         noteRemoteStreamEvent();
-    }, [handleStreamEvent, noteRemoteStreamEvent]);
+    }, [applyRemoteEvent, handleStreamEvent, noteRemoteStreamEvent]);
     // Register the pushed-event handler with the parent (Workspace) so it can deliver
     // broadcast chat events from other project members; deregister on unmount.
     useEffect(() => {
@@ -2289,10 +2349,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         return () => {
             cancelled = true;
         };
-    }, [conversationId, projectId, http]);
+    }, [conversationId, projectId, http, canEdit]);
     useEffect(() => {
         if (!conversationId || activityCardsLoadedConvRef.current !== conversationId)
             return;
+        if (canEdit === false)
+            return;
         void http
             .put(`/projects/${projectId}/conversations/${conversationId}/activity-cards`, {
             activityCards: activityCards.filter((c) => !c.received),
@@ -2301,7 +2363,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             // Best-effort save (bound as _error per Rule 14): the in-memory cards remain the
             // source of truth this session if the PUT fails.
         });
-    }, [activityCards, conversationId, projectId, http]);
+    }, [activityCards, conversationId, projectId, http, canEdit]);
     // ── Auto-tips (dismissable onboarding hints) ──────────────────────────────
     // Two surfaces (see chat-tips-utilities): an ENTRY_TIP shown once on a fresh
     // conversation so a brand-new user always sees how to drive the agent, plus an
@@ -2331,6 +2393,8 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             shownTipIdsRef.current = [];
             // Re-arm the entry tip so a freshly-started chat shows the onboarding hint.
             entryTipShownRef.current = false;
+            // Re-arm the viewer composer prefill ('/teamsay ') for the new conversation.
+            viewerPrefillDoneRef.current = false;
         }
     }, [conversationId]);
     // Entry tip: the onboarding moment. Show ONE high-value hint as soon as a fresh
@@ -2364,7 +2428,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             return;
         viewerTipShownRef.current = true;
         const text = t('ide.chat.tip.viewerTeamOnly', { agentName }, {
-            defaultValue: 'View-only access — read along and /teamsay the team. This gold icon marks team-only messages ({{agentName}} ignores them). Running the assistant and changing the model or settings need editor access.',
+            defaultValue: 'View-only access — read along and /teamsay (or just /t) the team. This gold icon marks team-only messages ({{agentName}} ignores them). Running the assistant and changing the model or settings need editor access.',
         });
         setTipCards((prev) => [
             ...prev,
@@ -2409,7 +2473,31 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
     }, [messages, discovery]);
     // ── Sounds picker (shown when /sounds is executed) ────────────────────────
     const [soundsPicker, setSoundsPicker] = useState(null);
-    const [soundsConfig, setSoundsConfig] = useState({ ...DEFAULT_SOUNDS_CONFIG });
+    // Notification sounds are a PER-DEVICE, per-user preference — localStorage,
+    // never project settings. They used to persist via PATCH /projects settings
+    // (shared with every member, and unreachable for read-only viewers, whose
+    // PATCH 403s); the old project-level value is still read once as a migration
+    // fallback when this device has no local preference yet.
+    const [soundsConfig, setSoundsConfig] = useState(() => {
+        try {
+            const raw = localStorage.getItem(SOUNDS_STORAGE_KEY);
+            if (raw)
+                return { ...DEFAULT_SOUNDS_CONFIG, ...JSON.parse(raw) };
+        }
+        catch (_error) {
+            // localStorage unavailable / bad JSON — fall through to the defaults.
+        }
+        return { ...DEFAULT_SOUNDS_CONFIG };
+    });
+    const soundsLocallySetRef = useRef(false);
+    useEffect(() => {
+        try {
+            soundsLocallySetRef.current = localStorage.getItem(SOUNDS_STORAGE_KEY) != null;
+        }
+        catch (_error) {
+            // localStorage unavailable — treat as unset; the project fallback may apply.
+        }
+    }, []);
     // ── Panel overlay (/skills, /scripts, /settings — closeable popups) ──────────
     // These three commands open a closeable overlay above the composer (mirrors how
     // /model and /sounds own this popup region) instead of dropping an inline card
@@ -2447,16 +2535,16 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             updated = { ...soundsConfig, [eventType]: next };
         }
         setSoundsConfig(updated);
+        // Per-device preference — localStorage, never a project PATCH (see the
+        // state's comment; this also makes /sounds fully usable for viewers).
         try {
-            await http.patch(`/projects/${projectId}`, { settings: { sounds: updated } });
+            localStorage.setItem(SOUNDS_STORAGE_KEY, JSON.stringify(updated));
+            soundsLocallySetRef.current = true;
         }
-        catch (error) {
-            logger.warn('Failed to persist sound settings to server', { error });
-            addSystemCard(t('ide.chat.soundsError', undefined, {
-                defaultValue: 'Failed to update sound settings.',
-            }));
+        catch (_error) {
+            // localStorage unavailable — the choice still applies for this session.
         }
-    }, [soundsConfig, http, projectId, addSystemCard]);
+    }, [soundsConfig]);
     // ── Current project settings (model + maxloops + sounds) ──────────────────
     // Project-scoped so any custom (bring-your-own AI) models the project has
     // configured are included alongside the platform catalog.
@@ -2572,7 +2660,9 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             if (typeof s?.autoApproveCommands === 'boolean') {
                 setAutoApproveCommandsEnabled(s.autoApproveCommands);
             }
-            if (s?.sounds && typeof s.sounds === 'object') {
+            // Legacy migration only: sounds are per-device (localStorage) now — apply
+            // the old project-level value only when this device has no local pref.
+            if (s?.sounds && typeof s.sounds === 'object' && !soundsLocallySetRef.current) {
                 setSoundsConfig((prev) => ({ ...prev, ...s.sounds }));
             }
             // Restore the persisted auto-commit cadence in the paused state (it
@@ -2684,9 +2774,14 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         if (fallback) {
             setCurrentModel(fallback);
             setSavedChatModel(fallback);
-            http.patch(`/projects/${projectId}`, { settings: { chatModel: fallback } }).catch(() => {
-                /* persistence is best-effort; the in-memory switch is what matters */
-            });
+            // Persisting the swap writes project settings — editor+ server-side, so a
+            // viewer's tab keeps the in-memory switch (all this session needs) and
+            // skips a PATCH that could only 403.
+            if (canEdit !== false) {
+                http.patch(settingsPatchUrl(), { settings: { chatModel: fallback } }).catch(() => {
+                    /* persistence is best-effort; the in-memory switch is what matters */
+                });
+            }
         }
     }, [
         modelsLoading,
@@ -2696,6 +2791,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         addSystemCard,
         http,
         projectId,
+        canEdit,
     ]);
     // ── Queued message editing ──────────────────────────────────────────────────
     const [editingQueuedId, setEditingQueuedId] = useState(null);
@@ -2879,6 +2975,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             pendingMessageKey !== undefined &&
             pendingMessageKey !== lastPendingKeyRef.current) {
             lastPendingKeyRef.current = pendingMessageKey;
+            // A read-only VIEWER never dispatches platform-composed sends (build
+            // kickoffs, auto-fixes, preview-failure reports): the server 403s them
+            // and the denial used to surface as a red error in the viewer's chat.
+            // Consume the key (above) so the same message isn't retried.
+            if (canEdit === false)
+                return;
             // A pending message is ALWAYS system-composed (an auto-fix prompt, a preview-failure
             // report, a "Fix with AI" request) — never text the user typed. So it must NEVER
             // render as a normal user bubble: either it's suppressed entirely (hidden build
@@ -2912,6 +3014,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         pendingMessageUserInitiated,
         sendMessage,
         isLoading,
+        canEdit,
     ]);
     // When streaming ends, send any deferred message. (A user Stop also ends
     // streaming, but handleAbort drops the deferred message first — and useChat's
@@ -2925,6 +3028,10 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             deferredPendingRef.current = null;
             deferredPendingSuppressRef.current = false;
             deferredPendingUserInitiatedRef.current = false;
+            // A viewer never dispatches platform-composed sends (same as the
+            // immediate path above) — the refs are already drained, so it just drops.
+            if (canEdit === false)
+                return;
             // Same rule as the immediate path: a deferred pending message is system-composed —
             // always `automatic` (suppressed or visible), never a plain user bubble.
             sendMessage(msg, undefined, {
@@ -2933,7 +3040,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 ...(userInitiated ? { userInitiated: true } : {}),
             });
         }
-    }, [isLoading, sendMessage]);
+    }, [isLoading, sendMessage, canEdit]);
     // ── Auto-delete queued autofix messages when user edits a relevant file ────
     const lastUserEditKeyRef = useRef(userEditedFileKey);
     useEffect(() => {
@@ -3428,11 +3535,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             return;
         }
         setFilePicker(null);
-        // Show model picker when typing "/model <filter>" — scoped to a mode when
-        // the input carries a --plan / --execute flag.
+        // Show model picker when typing "/model <filter>" — scoped to the mode a
+        // --plan / --execute flag names, else to the LIVE conversation mode
+        // (discovery = plan), so a plain pick changes the mode the user is in.
         const modelMatch = val.match(/^\/model\s+/i);
         if (modelMatch) {
-            setModelPicker({ selectedIdx: -1, mode: parseModelModeCommand(val)?.mode });
+            setModelPicker({ selectedIdx: -1, mode: parseModelModeCommand(val)?.mode ?? liveModelMode });
             setCommandMenu(null);
             return;
         }
@@ -3443,7 +3551,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         else {
             setCommandMenu(null);
         }
-    }, [openFilePicker, autoResize, persistDraft]);
+    }, [openFilePicker, autoResize, persistDraft, liveModelMode]);
     // ── Execute command ────────────────────────────────────────────────────────
     /** Sets textarea value and moves cursor to the end. */
     const setInputAndCursorEnd = useCallback((val) => {
@@ -3457,6 +3565,17 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             }
         }, 0);
     }, [setInputValue, autoResize]);
+    // Viewer composer prefill: the box IS the team-chat input, so it starts with
+    // "/teamsay " already typed (and handleSubmit re-fills it after each sent team
+    // message). Once per mount, and never over text the user already has.
+    const viewerPrefillDoneRef = useRef(false);
+    useEffect(() => {
+        if (canEdit !== false || viewerPrefillDoneRef.current)
+            return;
+        viewerPrefillDoneRef.current = true;
+        if (!inputRef.current.trim())
+            setInputAndCursorEnd('/teamsay ');
+    }, [canEdit, setInputAndCursorEnd, conversationId]);
     /**
      * Select and apply a model by ID. When `mode` is given the choice persists to
      * that mode's per-mode field (`planModel` / `executeModel` /
@@ -3469,7 +3588,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         const name = displayName ?? modelId;
         try {
             if (mode) {
-                await http.patch(`/projects/${projectId}`, {
+                await http.patch(settingsPatchUrl(), {
                     settings: { [modeSettingKey(mode)]: modelId },
                 });
                 if (mode === 'plan')
@@ -3489,7 +3608,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                             : t('ide.chat.compactModelSet', { name }, { defaultValue: 'Compaction model set to {{name}}' }));
             }
             else {
-                await http.patch(`/projects/${projectId}`, { settings: { chatModel: modelId } });
+                await http.patch(settingsPatchUrl(), { settings: { chatModel: modelId } });
                 setCurrentModel(modelId);
                 setSavedChatModel(modelId);
                 addSystemCard(t('ide.chat.modelSet', { name }, {
@@ -3513,7 +3632,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         const nextRegions = { ...modelRegions, [modelId]: region };
         setModelRegions(nextRegions);
         try {
-            await http.patch(`/projects/${projectId}`, {
+            await http.patch(settingsPatchUrl(), {
                 settings: { modelRegions: nextRegions },
             });
         }
@@ -3568,7 +3687,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         }
         else if (id === 'model') {
             setInputAndCursorEnd('/model ');
-            setModelPicker({ selectedIdx: -1 });
+            setModelPicker({ selectedIdx: -1, mode: liveModelMode });
         }
         else if (id === 'mic' || id === 'dictate') {
             setInputValue('');
@@ -3660,7 +3779,10 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                 defaultValue: "Today's AI allowance is used up — refreshes {{when}}.",
                             })
                             : t('ide.chat.usageAllowanceTodayLine', { percent: d.allowancePercent }, {
-                                defaultValue: "You've used ~{{percent}}% of today's AI allowance.",
+                                // Neutral phrasing on purpose: the allowance belongs to
+                                // the PROJECT (its owner's plan window) — "you've used"
+                                // misattributed it to whichever teammate ran /cost.
+                                defaultValue: "~{{percent}}% of today's AI allowance used.",
                             }))
                     : '';
                 // `inputTokens` counts only the UNCACHED prompt: every bond normalizes
@@ -3802,7 +3924,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             setInputValue('');
             const newValue = !autoFixEnabled;
             try {
-                await http.patch(`/projects/${projectId}`, { settings: { autoFix: newValue } });
+                await http.patch(settingsPatchUrl(), { settings: { autoFix: newValue } });
                 setAutoFixEnabled(newValue);
                 addSystemCard(newValue
                     ? t('ide.chat.autoFixEnabled', undefined, {
@@ -3823,7 +3945,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             setInputValue('');
             const newValue = !autoApproveCommandsEnabled;
             try {
-                await http.patch(`/projects/${projectId}`, {
+                await http.patch(settingsPatchUrl(), {
                     settings: { autoApproveCommands: newValue },
                 });
                 setAutoApproveCommandsEnabled(newValue);
@@ -3886,7 +4008,8 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         }
         else if (id === 'share') {
             setInputValue('');
-            setShareModal({ role: DEFAULT_SHARE_ROLE });
+            if (shareAllowed)
+                setShareModal({ role: DEFAULT_SHARE_ROLE });
         }
     }, [
         clearHistory,
@@ -3905,6 +4028,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         extraCommandIds,
         canEdit,
         allCommands,
+        liveModelMode,
         t,
     ]);
     // When the auto-commit countdown reaches zero, fire the existing /commit path
@@ -4023,10 +4147,18 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
             return;
         }
         // Handle /share [role] locally — opens the share-link modal at the requested
-        // role (default viewer). An unrecognized role shows usage instead.
+        // role (default viewer). An unrecognized role shows usage instead. Below the
+        // host's share capability (e.g. an editor where minting is admin+), say so
+        // plainly instead of opening a modal whose every request 403s.
         const shareMatch = parseShareCommand(trimmed);
         if (shareMatch) {
             setInputValue('');
+            if (!shareAllowed) {
+                addSystemCard(t('ide.chat.share.notAllowed', undefined, {
+                    defaultValue: 'Managing share links needs an admin role on this project.',
+                }));
+                return;
+            }
             if (shareMatch.kind === 'invalid') {
                 addSystemCard(t('ide.chat.share.usage', { roles: SHARE_ROLES.join(', ') }, {
                     defaultValue: 'Usage: /share [role] — create a public link. Roles: {{roles}} (default viewer).',
@@ -4108,20 +4240,9 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                     { action: buildUpgradeCta?.({}) ?? undefined });
                 }
                 else {
-                    try {
-                        await http.patch(`/projects/${projectId}`, { settings: { chatModel: name } });
-                        setCurrentModel(name);
-                        setSavedChatModel(name);
-                        addSystemCard(t('ide.chat.modelSet', { name: resolved?.label ?? name }, {
-                            defaultValue: `Chat model set to ${resolved?.label ?? name}`,
-                        }));
-                    }
-                    catch (error) {
-                        logger.warn('Failed to update chat model via /model command', { error });
-                        addSystemCard(t('ide.chat.modelError', undefined, {
-                            defaultValue: 'Failed to update chat model.',
-                        }));
-                    }
+                    // Unscoped /model targets the CURRENT conversation mode (discovery =
+                    // plan), same as /effort — never the legacy both-modes chatModel.
+                    await selectModel(name, resolved?.label ?? name, liveModelMode);
                 }
             }
             setInputValue('');
@@ -4196,7 +4317,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 }
                 try {
                     const nextByMode = { ...effortByMode, [targetMode]: level };
-                    await http.patch(`/projects/${projectId}`, { settings: { effortByMode: nextByMode } });
+                    await http.patch(settingsPatchUrl(), { settings: { effortByMode: nextByMode } });
                     setEffortByMode(nextByMode);
                     addSystemCard(t('ide.chat.effort.setMode', {
                         mode: targetMode,
@@ -4218,7 +4339,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         if (maxLoopsMatch) {
             const n = Math.max(1, Number(maxLoopsMatch[1]));
             try {
-                await http.patch(`/projects/${projectId}`, { settings: { maxToolLoops: n } });
+                await http.patch(settingsPatchUrl(), { settings: { maxToolLoops: n } });
                 setCurrentMaxLoops(n);
                 addSystemCard(t('ide.chat.maxLoopsSet', { n }, {
                     defaultValue: `Max tool iterations set to ${n}`,
@@ -4285,7 +4406,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         // event (persisted + broadcast to every member), which IS the visible message — so the
         // transcript never shows the literal "/command" text, and never shows it twice.
         if (matchesSideChannelCommand(allCommands, trimmed)) {
-            setInputValue('');
+            // A viewer's composer is the team-chat box — re-fill the /teamsay prefix
+            // after each sent team message so the next one is one keystroke away.
+            if (canEdit === false)
+                setInputAndCursorEnd('/teamsay ');
+            else
+                setInputValue('');
             sendMessage(trimmed, undefined, { suppressUserMessage: true });
             return;
         }
@@ -4335,7 +4461,17 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         setAttachedFiles([]);
         setAttachmentError(null);
         sendMessage(message, chatAttachments.length > 0 ? chatAttachments : undefined);
-    }, [attachedFiles, http, projectId, sendMessage, setInputValue, runSavedScript, allCommands]);
+    }, [
+        attachedFiles,
+        http,
+        projectId,
+        sendMessage,
+        setInputValue,
+        runSavedScript,
+        allCommands,
+        selectModel,
+        liveModelMode,
+    ]);
     // External auto-submit. When the signal changes, submit the current input —
     // used by the prompt → chat morph to send the prefilled prompt once the chat
     // has docked into place (handleSubmit clears the input as it sends).
@@ -4371,12 +4507,22 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
     useEffect(() => {
         if (openShareSignal !== undefined && openShareSignal !== lastOpenShareRef.current) {
             lastOpenShareRef.current = openShareSignal;
-            setShareModal({ role: DEFAULT_SHARE_ROLE });
+            if (shareAllowed)
+                setShareModal({ role: DEFAULT_SHARE_ROLE });
         }
-    }, [openShareSignal]);
+    }, [openShareSignal, shareAllowed]);
     // ── Keyboard ───────────────────────────────────────────────────────────────
     const filteredCmds = commandMenu
-        ? allCommands.filter((c) => c.label.startsWith(inputRef.current))
+        ? allCommands.filter((c) => 
+        // A showAll menu (slash-button toggle over existing text) lists every
+        // command; a typed menu filters by the composer's text.
+        (commandMenu.showAll === true || c.label.startsWith(inputRef.current)) &&
+            // Viewers see only commands they can actually run (viewer-safe reads +
+            // the /teamsay side channel) — no dead entries in the menu.
+            (canEdit !== false || c.viewerSafe === true || c.sideChannel === true) &&
+            // /share is gated separately: hosts commonly mint at admin+, so an
+            // editor without the capability gets no dead menu entry either.
+            (c.id !== 'share' || shareAllowed))
         : [];
     const filteredModels = useMemo(() => {
         if (!modelPicker)
@@ -4663,9 +4809,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 e.preventDefault();
                 const idx = modelPicker.selectedIdx >= 0 ? modelPicker.selectedIdx : 0;
                 if (onManageCustomModels && idx === visibleModels.length) {
+                    const manageMode = modelPicker.mode === 'plan' || modelPicker.mode === 'execute'
+                        ? modelPicker.mode
+                        : liveModelMode;
                     setModelPicker(null);
                     setInputValue('');
-                    onManageCustomModels();
+                    onManageCustomModels({ mode: manageMode });
                     return;
                 }
                 const model = visibleModels[idx];
@@ -4706,20 +4855,28 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
         if (commandMenu && filteredCmds.length > 0) {
             if (e.key === 'ArrowDown') {
                 e.preventDefault();
-                setCommandMenu((m) => m ? { selectedIdx: wrapIdx(m.selectedIdx, 1, filteredCmds.length) } : null);
+                setCommandMenu((m) => m ? { ...m, selectedIdx: wrapIdx(m.selectedIdx, 1, filteredCmds.length) } : null);
                 return;
             }
             if (e.key === 'ArrowUp') {
                 e.preventDefault();
-                setCommandMenu((m) => m ? { selectedIdx: wrapIdx(m.selectedIdx, -1, filteredCmds.length) } : null);
+                setCommandMenu((m) => m ? { ...m, selectedIdx: wrapIdx(m.selectedIdx, -1, filteredCmds.length) } : null);
                 return;
             }
             if (e.key === 'Enter' || e.key === 'Tab') {
-                e.preventDefault();
-                const cmd = filteredCmds[commandMenu.selectedIdx >= 0 ? commandMenu.selectedIdx : 0];
-                if (cmd)
-                    void executeCommand(cmd.id);
-                return;
+                // A showAll menu (opened by the slash BUTTON over existing text) only
+                // executes an explicitly highlighted command — a bare Enter closes it
+                // and falls through to submit the composer text as typed.
+                if (commandMenu.showAll && commandMenu.selectedIdx < 0 && e.key === 'Enter') {
+                    setCommandMenu(null);
+                }
+                else {
+                    e.preventDefault();
+                    const cmd = filteredCmds[commandMenu.selectedIdx >= 0 ? commandMenu.selectedIdx : 0];
+                    if (cmd)
+                        void executeCommand(cmd.id);
+                    return;
+                }
             }
         }
         if (e.key === 'Enter' && !e.shiftKey) {
@@ -4755,6 +4912,15 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
     // unrenderable card (a custom event with no registered factory, or a non-execute mode) so
     // the timeline simply omits it.
     const cardEventToSystemCard = useCallback((cardEvent, id, timestamp) => {
+        // Suffix a card's copy with the member who made the change, when the
+        // server attributed one — so a teammate watching knows WHO flipped the
+        // model/effort/mode, live and on reload.
+        const withBy = (text) => {
+            const by = cardEvent.by;
+            return by
+                ? t('ide.chat.cardBy', { text, name: by }, { defaultValue: '{{text}} — {{name}}' })
+                : text;
+        };
         switch (cardEvent.kind) {
             case 'model': {
                 const label = cardEvent.label || cardEvent.model;
@@ -4766,22 +4932,77 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                 const regionCode = def && def.provider !== 'custom' ? effectiveModelRegion(def).toUpperCase() : null;
                 return {
                     id,
-                    text: regionCode
+                    text: withBy(regionCode
                         ? t('ide.chat.modelInUseRegion', { model: label, region: regionCode }, { defaultValue: 'Now using {{model}} ({{region}})' })
-                        : t('ide.chat.modelInUse', { model: label }, { defaultValue: 'Now using {{model}}' }),
+                        : t('ide.chat.modelInUse', { model: label }, { defaultValue: 'Now using {{model}}' })),
                     timestamp,
                 };
             }
             case 'mode':
-                // Only the plan→build handoff renders a card; the server records a mode card solely
-                // for 'execute' ("🔨 Building your app"). Anything else renders nothing.
+                // The plan→build handoff ("🔨 Building your app") and the plan-mode
+                // announcement a new conversation is seeded with ("📝 Plan mode") —
+                // the server records mode cards only for those two.
+                if (cardEvent.mode === 'plan') {
+                    return {
+                        id,
+                        text: withBy(t('ide.chat.phasePlanning', undefined, { defaultValue: '📝 Plan mode' })),
+                        timestamp,
+                    };
+                }
                 if (cardEvent.mode !== 'execute')
                     return null;
                 return {
                     id,
-                    text: t('ide.chat.phaseBuilding', undefined, { defaultValue: '🔨 Building your app' }),
+                    text: withBy(t('ide.chat.phaseBuilding', undefined, { defaultValue: '🔨 Building your app' })),
                     timestamp,
                 };
+            case 'setting': {
+                // A Synthase-altering setting changed (effort / fast mode / max loops /
+                // region / auto-fix / auto-approve) — announced to every member, live
+                // and on reload. Copy reuses the same localized strings as the local
+                // confirmation cards, so the shared card reads identically.
+                let text = null;
+                if (cardEvent.setting === 'effort') {
+                    const level = String(cardEvent.value ?? 'default');
+                    const cardMode = cardEvent.mode ?? '';
+                    text = cardEvent.label
+                        ? t('ide.chat.effort.setMode', { mode: cardMode, level, model: cardEvent.label }, { defaultValue: 'Reasoning effort for {{mode}} set to {{level}} ({{model}}).' })
+                        : t('ide.chat.setting.effort', { mode: cardMode, level }, { defaultValue: 'Reasoning effort for {{mode}} set to {{level}}.' });
+                }
+                else if (cardEvent.setting === 'fastMode') {
+                    text = cardEvent.value
+                        ? t('ide.chat.fastModeOn', undefined, {
+                            defaultValue: 'Fast mode on — faster responses at a higher rate',
+                        })
+                        : t('ide.chat.fastModeOff', undefined, { defaultValue: 'Fast mode off' });
+                }
+                else if (cardEvent.setting === 'maxToolLoops') {
+                    text = t('ide.chat.maxLoopsSet', { n: Number(cardEvent.value ?? 0) }, { defaultValue: 'Max tool iterations set to {{n}}' });
+                }
+                else if (cardEvent.setting === 'region') {
+                    text = t('ide.chat.modelInUseRegion', {
+                        model: cardEvent.label ?? '',
+                        region: String(cardEvent.value ?? '').toUpperCase(),
+                    }, { defaultValue: 'Now using {{model}} ({{region}})' });
+                }
+                else if (cardEvent.setting === 'autoFix') {
+                    text = cardEvent.value
+                        ? t('ide.chat.autoFixEnabled', undefined, { defaultValue: 'Auto-fix enabled.' })
+                        : t('ide.chat.autoFixDisabled', undefined, { defaultValue: 'Auto-fix disabled.' });
+                }
+                else if (cardEvent.setting === 'autoApprove') {
+                    text = cardEvent.value
+                        ? t('ide.chat.autoApproveEnabled', undefined, {
+                            defaultValue: 'Auto-approve on — destructive commands run without asking. The exfiltration guard still asks. Turn off with /autoapprove.',
+                        })
+                        : t('ide.chat.autoApproveDisabled', undefined, {
+                            defaultValue: 'Auto-approve off — destructive commands ask before running.',
+                        });
+                }
+                if (!text)
+                    return null;
+                return { id, text: withBy(text), timestamp };
+            }
             case 'skills':
                 return {
                     id,
@@ -4836,6 +5057,20 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
     // reading the guest limit they just escaped. Same reasoning the host's
     // `upgrade_prompt` card factory already applies to the recorded guest card.
     const isStaleAnonymousLimit = errorMeta?.requiresSignup === true && isAnonymous === false;
+    // A read-only viewer's access-denied chat error must never sit as the
+    // persistent red banner — every legitimate viewer action is already gated
+    // client-side, so this only fires when something slipped through to the
+    // server (or an older tab raced a role change). Flash a calm, gold
+    // view-only notice for a few seconds instead, then clear.
+    const isViewerAccessDenied = canEdit === false && !!error && /access denied/i.test(error);
+    const [viewerDeniedFlash, setViewerDeniedFlash] = useState(false);
+    useEffect(() => {
+        if (!isViewerAccessDenied)
+            return;
+        setViewerDeniedFlash(true);
+        const timer = setTimeout(() => setViewerDeniedFlash(false), 6000);
+        return () => clearTimeout(timer);
+    }, [isViewerAccessDenied, error]);
     const timeline = useMemo(() => {
         const items = [];
         // A card-message (role:'system' carrying a cardEvent) renders as a SYSTEM CARD, not a chat
@@ -5003,7 +5238,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                 defaultValue: 'Show earlier messages',
                             }) }) })), (timeline.length > maxVisibleItems ? timeline.slice(-maxVisibleItems) : timeline).map((item) => (_jsx(ChatItemBoundary, { onError: onRenderError, render: () => {
                             if (item.kind === 'commit')
-                                return (_jsx(CommitCardItem, { card: item.card, onRevert: handleRevertCommit }, item.card.id));
+                                return (_jsx(CommitCardItem, { card: item.card, onRevert: canEdit === false ? undefined : handleRevertCommit }, item.card.id));
                             if (item.kind === 'activity')
                                 return (_jsx(ActivityCard, { activity: item.card.activity, onActivityClick: onActivityClick }, item.card.id));
                             if (item.kind === 'tip')
@@ -5108,9 +5343,9 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                         timestamp: msg.timestamp,
                                         status: 'done',
                                         hash,
-                                    }, onRevert: handleRevertCommit }, msg.id));
+                                    }, onRevert: canEdit === false ? undefined : handleRevertCommit }, msg.id));
                             }
-                            return (_jsx(MessageItem, { msg: msg, sendMessage: sendMessage, handleAskUserResponse: handleAskUserResponse, isLoading: isLoading, streamingStatus: streamingStatus, onNavigatePreview: onNavigatePreview, undoneTcIds: undoneTcIds, handleUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, handleFileRevert: handleFileRevert, setInputAndCursorEnd: setInputAndCursorEnd, setModelPicker: setModelPicker, userAvatar: userAvatar, 
+                            return (_jsx(MessageItem, { msg: msg, sendMessage: sendMessage, handleAskUserResponse: handleAskUserResponse, isLoading: isLoading, streamingStatus: streamingStatus, onNavigatePreview: onNavigatePreview, undoneTcIds: undoneTcIds, handleUndoToggle: handleUndoToggle, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, handleFileRevert: handleFileRevert, setInputAndCursorEnd: setInputAndCursorEnd, setModelPicker: setModelPicker, chatMode: liveModelMode, userAvatar: userAvatar, 
                                 // Avatar clicks open the signed-in user's OWN profile, so only
                                 // their own messages get the handler: author-less ones (the
                                 // local echo, legacy solo rows) or an author matching
@@ -5118,11 +5353,27 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                 // clicking Test's face must not open Luke's profile editor.
                                 onAvatarClick: !msg.author?.id || (currentUserId != null && msg.author.id === currentUserId)
                                     ? onUserAvatarClick
-                                    : undefined, discovery: discovery, buildUpgradeCta: buildUpgradeCta, agentName: agentName }, msg.id));
+                                    : undefined, discovery: discovery, buildUpgradeCta: buildUpgradeCta, agentName: agentName, canEdit: canEdit }, msg.id));
                         } }, item.kind === 'message' ? item.msg.id : item.card.id))), error &&
                         !isStaleAnonymousLimit &&
-                        (errorMeta?.limitType ? (_jsx(ResourceLimitBanner, { message: error, action: buildUpgradeCta?.({ requiresSignup: errorMeta.requiresSignup }) })) : (_jsx("div", { className: cm.cn(cm.textSize('sm'), cm.sp('p', 2), cm.sp('mb', 2), cm.bgErrorSubtle, cm.textError), style: { borderRadius: '6px' }, children: error }))), (() => {
-                        const showActivity = isLoading || awaitingSandboxBoot;
+                        (errorMeta?.limitType ? (_jsx(ResourceLimitBanner, { message: error, action: buildUpgradeCta?.({ requiresSignup: errorMeta.requiresSignup }) })) : isViewerAccessDenied ? (
+                        // A viewer's denial is expected state, not an alarm: a brief, calm,
+                        // gold view-only notice (matching the viewer tip / team-note
+                        // treatment) that clears itself — never the persistent red banner.
+                        viewerDeniedFlash ? (_jsxs("div", { "data-mol-id": "chat-viewer-denied-notice", className: cm.cn(cm.textSize('xs'), cm.textMuted), style: {
+                                display: 'flex',
+                                alignItems: 'flex-start',
+                                gap: 8,
+                                marginBottom: 8,
+                                ...chatCardStyle(NOTICE_TONE.gold.accent),
+                                lineHeight: 1.5,
+                            }, children: [_jsx(Icon, { name: "people", size: CHAT_CARD_ICON_SIZE, "aria-hidden": "true", style: { flexShrink: 0, marginTop: 1, color: NOTICE_TONE.gold.accent } }), _jsx("span", { style: { flex: 1 }, children: t('ide.chat.viewerReadOnly', undefined, {
+                                        defaultValue: "You have view-only access, so you can't run the assistant here. You can still read along and use /teamsay to message the team.",
+                                    }) })] })) : null) : (_jsx("div", { className: cm.cn(cm.textSize('sm'), cm.sp('p', 2), cm.sp('mb', 2), cm.bgErrorSubtle, cm.textError), style: { borderRadius: '6px' }, children: error }))), (() => {
+                        // A remote turn (a teammate's send, another tab, a server-side
+                        // continuation) shows the same live activity indicator as an own send —
+                        // watchers see Synthase working, not a frozen transcript.
+                        const showActivity = isLoading || awaitingSandboxBoot || isRemoteStreaming;
                         const streamingMsg = isLoading
                             ? [...visibleMessages].reverse().find((m) => m.isStreaming)
                             : undefined;
@@ -5920,9 +6171,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                             cursor: 'pointer',
                                             textAlign: 'left',
                                         }, children: t('ide.chat.olderModelsExpand', { count: deprecatedModels.length }, { defaultValue: 'Older models ⌄ ({{count}})' }) }))] })), onManageCustomModels && (_jsx("button", { type: "button", "data-mol-id": "chat-model-manage-custom", onClick: () => {
+                                    const manageMode = modelPicker.mode === 'plan' || modelPicker.mode === 'execute'
+                                        ? modelPicker.mode
+                                        : liveModelMode;
                                     setModelPicker(null);
                                     setInputValue('');
-                                    onManageCustomModels();
+                                    onManageCustomModels({ mode: manageMode });
                                 }, onMouseEnter: (e) => {
                                     ;
                                     e.currentTarget.style.background =
@@ -6318,7 +6572,8 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                             }, onMouseLeave: (e) => {
                                                 e.currentTarget.style.opacity = '0.7';
                                                 e.currentTarget.style.background = 'none';
-                                            }, children: _jsx("svg", { width: "13", height: "13", viewBox: "0 0 12 12", style: { display: 'block' }, children: _jsx("path", { d: "M 2.5,6.5 L 6,3 L 9.5,6.5 M 6,3.5 L 6,10", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round" }) }) }))] }, qm.id))) })] })), pendingFiles != null &&
+                                            }, children: _jsx("svg", { width: "13", height: "13", viewBox: "0 0 12 12", style: { display: 'block' }, children: _jsx("path", { d: "M 2.5,6.5 L 6,3 L 9.5,6.5 M 6,3.5 L 6,10", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round" }) }) }))] }, qm.id))) })] })), canEdit !== false &&
+                        pendingFiles != null &&
                         pendingFiles.length > 0 &&
                         !commandMenu &&
                         !modelPicker &&
@@ -6464,7 +6719,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                                 opacity: 0.5,
                                                 transition: 'opacity 100ms, background 100ms',
                                                 ...(!(f.additions || f.deletions) ? { marginLeft: 'auto' } : {}),
-                                            }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", width: "12", height: "12", fill: "currentColor", children: _jsx("path", { d: "M1.22 6.28a.749.749 0 0 1 0-1.06l3.5-3.5a.749.749 0 1 1 1.06 1.06L3.561 5h7.188l.001.007L10.749 5c.058 0 .116.007.171.019A4.501 4.501 0 0 1 10.5 14H8.796a.75.75 0 0 1 0-1.5H10.5a3 3 0 1 0 0-6H3.561L5.78 8.72a.749.749 0 1 1-1.06 1.06l-3.5-3.5Z" }) }) }))] }, f.path))) }))] })), _jsxs("div", { className: cm.surfaceSecondary, style: {
+                                            }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", width: "12", height: "12", fill: "currentColor", children: _jsx("path", { d: "M1.22 6.28a.749.749 0 0 1 0-1.06l3.5-3.5a.749.749 0 1 1 1.06 1.06L3.561 5h7.188l.001.007L10.749 5c.058 0 .116.007.171.019A4.501 4.501 0 0 1 10.5 14H8.796a.75.75 0 0 1 0-1.5H10.5a3 3 0 1 0 0-6H3.561L5.78 8.72a.749.749 0 1 1-1.06 1.06l-3.5-3.5Z" }) }) }))] }, f.path))) }))] })), _jsxs("div", { className: cm.surfaceSecondary, ...(canEdit === false ? { 'data-mol-viewer': '' } : {}), style: {
                             // Round the TOP corners only (8px) so the composer reads as a self-contained
                             // input with its own border on all sides, flush at the bottom-left/right with
                             // the panel's bottom edge. Discovery rounds ALL FOUR corners (the centered
@@ -6473,11 +6728,18 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                             borderRadius: discovery ? 8 : '8px 8px 0 0',
                             padding: '8px 10px',
                             cursor: 'text',
+                            // View-only mode: the composer IS the team-chat box, so it wears the
+                            // team-message gold border (and the box is pre-filled with /teamsay).
+                            ...(canEdit === false ? { border: `1px solid ${NOTICE_TONE.gold.accent}` } : {}),
                         }, onClick: (e) => {
                             if (!e.target.closest('button')) {
                                 textareaRef.current?.focus();
                             }
-                        }, children: [_jsx("textarea", { ref: textareaRef, "data-mol-chat-input": "", defaultValue: inputRef.current, autoComplete: "off", onChange: handleInputChange, onPaste: handlePaste, placeholder: t('ide.chat.placeholder'), rows: 1, className: cm.textSize('sm'), style: {
+                        }, children: [_jsx("textarea", { ref: textareaRef, "data-mol-chat-input": "", defaultValue: inputRef.current, autoComplete: "off", onChange: handleInputChange, onPaste: handlePaste, placeholder: canEdit === false
+                                    ? t('ide.chat.placeholderViewer', undefined, {
+                                        defaultValue: 'Message your team',
+                                    })
+                                    : t('ide.chat.placeholder'), rows: 1, className: cm.textSize('sm'), style: {
                                     width: '100%',
                                     display: 'block',
                                     padding: 0,
@@ -6503,7 +6765,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                     alignItems: 'center',
                                     marginTop: '6px',
                                     gap: '4px',
-                                }, children: [_jsx("button", { type: "button", disabled: !canEdit, onClick: () => {
+                                }, children: [canEdit !== false && (_jsx("button", { type: "button", onClick: () => {
                                             const newMode = mode === 'plan' ? 'execute' : 'plan';
                                             setMode(newMode);
                                             http
@@ -6548,7 +6810,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                         }, onMouseLeave: (e) => {
                                             if (mode !== 'plan')
                                                 e.currentTarget.style.opacity = '0.4';
-                                        }, children: _jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "currentColor", children: _jsx("path", { d: "M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z" }) }) }), fastModeAvailable && (_jsx("button", { type: "button", "data-mol-id": "chat-fast-mode-toggle", disabled: !canEdit, onClick: () => {
+                                        }, children: _jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "currentColor", children: _jsx("path", { d: "M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z" }) }) })), fastModeAvailable && canEdit !== false && (_jsx("button", { type: "button", "data-mol-id": "chat-fast-mode-toggle", disabled: !canEdit, onClick: () => {
                                             const next = !fastMode;
                                             setFastMode(next);
                                             http
@@ -6613,7 +6875,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                         }, onMouseLeave: (e) => {
                                             if (!isListening)
                                                 e.currentTarget.style.opacity = '0.4';
-                                        }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", width: "16", height: "16", style: { display: 'block' }, children: [_jsx("rect", { x: "6", y: "1", width: "4", height: "8", rx: "2", fill: isListening ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.25" }), _jsx("path", { d: "M4 7v1a4 4 0 008 0V7", fill: "none", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" }), _jsx("line", { x1: "8", y1: "12", x2: "8", y2: "15", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" }), _jsx("line", { x1: "6", y1: "15", x2: "10", y2: "15", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" })] }) }), _jsx("button", { type: "button", onClick: () => fileInputRef.current?.click(), title: t('ide.chat.attachFile', undefined, { defaultValue: 'Attach file' }), style: {
+                                        }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", width: "16", height: "16", style: { display: 'block' }, children: [_jsx("rect", { x: "6", y: "1", width: "4", height: "8", rx: "2", fill: isListening ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.25" }), _jsx("path", { d: "M4 7v1a4 4 0 008 0V7", fill: "none", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" }), _jsx("line", { x1: "8", y1: "12", x2: "8", y2: "15", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" }), _jsx("line", { x1: "6", y1: "15", x2: "10", y2: "15", stroke: "currentColor", strokeWidth: "1.25", strokeLinecap: "round" })] }) }), canEdit !== false && (_jsx("button", { type: "button", onClick: () => fileInputRef.current?.click(), title: t('ide.chat.attachFile', undefined, { defaultValue: 'Attach file' }), style: {
                                             display: 'inline-flex',
                                             alignItems: 'center',
                                             justifyContent: 'center',
@@ -6631,7 +6893,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                             e.currentTarget.style.opacity = '0.85';
                                         }, onMouseLeave: (e) => {
                                             e.currentTarget.style.opacity = '0.4';
-                                        }, children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 16 16", fill: "currentColor", style: { display: 'block' }, children: _jsx("path", { d: "M12.212 3.02a1.753 1.753 0 0 0-2.478.003l-5.83 5.83a3.007 3.007 0 0 0-.88 2.127c0 .795.315 1.551.88 2.116.567.567 1.333.89 2.126.89.79 0 1.548-.321 2.116-.89l5.48-5.48a.75.75 0 0 1 1.061 1.06l-5.48 5.48a4.492 4.492 0 0 1-3.177 1.33c-1.2 0-2.345-.487-3.187-1.33a4.483 4.483 0 0 1-1.32-3.177c0-1.195.475-2.341 1.32-3.186l5.83-5.83a3.25 3.25 0 0 1 5.553 2.297c0 .863-.343 1.691-.953 2.301L7.439 12.39c-.375.377-.884.59-1.416.593a1.998 1.998 0 0 1-1.412-.593 1.992 1.992 0 0 1 0-2.828l5.48-5.48a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-5.48 5.48a.492.492 0 0 0 0 .707.499.499 0 0 0 .352.154.51.51 0 0 0 .356-.154l5.833-5.827a1.755 1.755 0 0 0 0-2.481Z" }) }) }), [
+                                        }, children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 16 16", fill: "currentColor", style: { display: 'block' }, children: _jsx("path", { d: "M12.212 3.02a1.753 1.753 0 0 0-2.478.003l-5.83 5.83a3.007 3.007 0 0 0-.88 2.127c0 .795.315 1.551.88 2.116.567.567 1.333.89 2.126.89.79 0 1.548-.321 2.116-.89l5.48-5.48a.75.75 0 0 1 1.061 1.06l-5.48 5.48a4.492 4.492 0 0 1-3.177 1.33c-1.2 0-2.345-.487-3.187-1.33a4.483 4.483 0 0 1-1.32-3.177c0-1.195.475-2.341 1.32-3.186l5.83-5.83a3.25 3.25 0 0 1 5.553 2.297c0 .863-.343 1.691-.953 2.301L7.439 12.39c-.375.377-.884.59-1.416.593a1.998 1.998 0 0 1-1.412-.593 1.992 1.992 0 0 1 0-2.828l5.48-5.48a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-5.48 5.48a.492.492 0 0 0 0 .707.499.499 0 0 0 .352.154.51.51 0 0 0 .356-.154l5.833-5.827a1.755 1.755 0 0 0 0-2.481Z" }) }) })), [
                                         {
                                             sym: '@',
                                             nudgeY: 0,
@@ -6660,34 +6922,38 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                                 defaultValue: 'Slash commands',
                                             }),
                                             onClick: () => {
-                                                const cur = inputRef.current;
-                                                if (cur === '/') {
-                                                    // Toggle off — remove the slash this button added
-                                                    setInputValue('');
-                                                    autoResize();
+                                                // TOGGLE the menu regardless of the composer's current text —
+                                                // never clobbering it. With text present the menu opens in
+                                                // showAll mode (every command listed; picking one replaces the
+                                                // input via executeCommand's prefill). An empty box still gets
+                                                // the type-ahead '/' so filtering-by-typing works as before.
+                                                if (commandMenu) {
                                                     setCommandMenu(null);
+                                                    if (inputRef.current === '/') {
+                                                        // Remove the slash this button added on open.
+                                                        setInputValue('');
+                                                        autoResize();
+                                                    }
                                                     setTimeout(() => {
                                                         textareaRef.current?.focus();
                                                     }, 0);
+                                                    return;
                                                 }
-                                                else if (!cur) {
-                                                    // Cursor lands AFTER the slash so the user can type the
-                                                    // command immediately (or backspace to remove it).
-                                                    // Popups are one-at-a-time — close siblings first.
-                                                    setMicPicker(null);
-                                                    setModelPicker(null);
-                                                    setSoundsPicker(null);
+                                                // Popups are one-at-a-time — close siblings first.
+                                                setMicPicker(null);
+                                                setModelPicker(null);
+                                                setSoundsPicker(null);
+                                                const cur = inputRef.current;
+                                                if (!cur)
                                                     setInputAndCursorEnd('/');
-                                                    setCommandMenu({ selectedIdx: -1 });
-                                                }
-                                                else {
-                                                    setTimeout(() => {
-                                                        textareaRef.current?.focus();
-                                                    }, 0);
-                                                }
+                                                setCommandMenu({ selectedIdx: -1, showAll: cur !== '' && cur !== '/' });
                                             },
                                         },
-                                    ].map(({ sym, nudgeY, size: fontSize, title, onClick }) => (_jsx("button", { type: "button", onClick: onClick, title: title, style: {
+                                    ]
+                                        // Viewers keep the / shortcut (viewer-safe commands + /teamsay) but not @ —
+                                        // file mentions only feed Synthase turns.
+                                        .filter(({ sym }) => canEdit !== false || sym !== '@')
+                                        .map(({ sym, nudgeY, size: fontSize, title, onClick }) => (_jsx("button", { type: "button", onClick: onClick, title: title, style: {
                                             display: 'inline-flex',
                                             alignItems: 'center',
                                             justifyContent: 'center',
@@ -6708,7 +6974,8 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                             e.currentTarget.style.opacity = '0.85';
                                         }, onMouseLeave: (e) => {
                                             e.currentTarget.style.opacity = '0.4';
-                                        }, children: sym === 'slash' ? (_jsx("svg", { width: "9", height: "13", viewBox: "0 0 9 13", style: { display: 'block', position: 'relative', top: `${nudgeY}px` }, children: _jsx("line", { x1: "8", y1: "1", x2: "1", y2: "12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })) : (_jsx("span", { style: { position: 'relative', top: `${nudgeY}px` }, children: sym })) }, sym))), contextUsage &&
+                                        }, children: sym === 'slash' ? (_jsx("svg", { width: "9", height: "13", viewBox: "0 0 9 13", style: { display: 'block', position: 'relative', top: `${nudgeY}px` }, children: _jsx("line", { x1: "8", y1: "1", x2: "1", y2: "12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })) : (_jsx("span", { style: { position: 'relative', top: `${nudgeY}px` }, children: sym })) }, sym))), canEdit !== false &&
+                                        contextUsage &&
                                         (() => {
                                             // The ring represents usage toward the auto-compaction threshold,
                                             // not the raw context window. 100% = compaction will trigger.
@@ -6777,11 +7044,14 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                                                             transition: 'opacity 150ms',
                                                         }, children: [pct, "%"] }), _jsxs("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, style: { display: 'block', transform: 'rotate(-90deg)', flexShrink: 0 }, children: [_jsx("circle", { cx: size / 2, cy: size / 2, r: r, fill: "none", stroke: "currentColor", strokeWidth: stroke, opacity: 0.15 }), _jsx("circle", { cx: size / 2, cy: size / 2, r: r, fill: "none", stroke: color, strokeWidth: stroke, strokeDasharray: `${c}`, strokeDashoffset: `${dashOffset}`, strokeLinecap: "round" })] })] }));
                                         })(), _jsxs("div", { style: {
-                                            marginLeft: contextUsage ? '4px' : 'auto',
+                                            // 'auto' pins the stop/send cluster right; the context ring
+                                            // (hidden for viewers even when contextUsage exists) otherwise
+                                            // carries the auto margin and this becomes a 4px gap.
+                                            marginLeft: canEdit !== false && contextUsage ? '4px' : 'auto',
                                             display: 'flex',
                                             gap: '4px',
                                             alignItems: 'center',
-                                        }, children: [(isLoading || isRemoteStreaming) && (_jsx("button", { type: "button", onClick: handleAbort, title: t('ide.chat.stop', undefined, { defaultValue: 'Stop' }), onMouseEnter: (e) => {
+                                        }, children: [canEdit !== false && (isLoading || isRemoteStreaming) && (_jsx("button", { type: "button", onClick: handleAbort, title: t('ide.chat.stop', undefined, { defaultValue: 'Stop' }), onMouseEnter: (e) => {
                                                     e.currentTarget.style.background = 'rgba(248,81,73,0.3)';
                                                     e.currentTarget.style.borderColor = 'rgba(248,81,73,0.65)';
                                                 }, onMouseLeave: (e) => {
@@ -6835,7 +7105,7 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
                             }
                             : undefined,
                     });
-                } })), shareModal && (_jsx(ShareModal, { projectId: projectId, initialRole: shareModal.role, onClose: () => setShareModal(null), onCreated: (result) => {
+                } })), shareModal && (_jsx(ShareModal, { projectId: projectId, initialRole: shareModal.role, canManage: shareAllowed, onClose: () => setShareModal(null), onCreated: (result) => {
                     // Surface the created link in the timeline so it persists after the
                     // modal closes — the role label and the public URL are both shown.
                     addSystemCard(t('ide.chat.share.created', { role: result.role }, { defaultValue: 'Created a {{role}} share link.' }), {
@@ -6854,8 +7124,12 @@ function ChatInner({ projectId, endpoint, initialMessage, onInitialMessageSent,
  * @param props - Component props (see {@link MessageItemProps}).
  * @returns The rendered chat panel element.
  */
-export function ChatPanel({ projectId, endpoint, initialMessage, onInitialMessageSent, activeFile, openTabs, onFileOpen, onFileDoubleClick, onFileDiff, onFileRevert, onFileChange, onFileDeleted, onCommit, onActivityClick, onRenderError, onProfileClick, currentUserId, onReadyToBuild, awaitingSandboxBoot, onClientAction, onTurnComplete, onLoadingChange, onNavigatePreview, onRegisterPushHandler, autoSubmitSignal, initialInputValue, hideConversationMenu, renderConversationHeader = true, conversationId: controlledConversationId, chatKey: controlledChatKey, onConversationId: controlledOnConversationId, openShareSignal: controlledShareSignal, openReportSignal: controlledReportSignal, openSettingsSignal: controlledSettingsSignal, onManageCustomModels, gitStatusTick, pendingMessage, pendingMessageKey, pendingMessageSuppressUser, pendingMessageUserInitiated, userEditedFile, userEditedFileKey, isPro, isAnonymous, canEdit = true, buildUpgradeCta, buildHelpUpgradeSection, userAvatar, agentName, productName, version, extraCommands, feedbackUrl, className, }) {
+export function ChatPanel({ projectId, endpoint, initialMessage, onInitialMessageSent, activeFile, openTabs, onFileOpen, onFileDoubleClick, onFileDiff, onFileRevert, onFileChange, onFileDeleted, onCommit, onActivityClick, onRenderError, onProfileClick, currentUserId, onReadyToBuild, awaitingSandboxBoot, onClientAction, onTurnComplete, onLoadingChange, onNavigatePreview, onRegisterPushHandler, autoSubmitSignal, initialInputValue, hideConversationMenu, renderConversationHeader = true, conversationId: controlledConversationId, chatKey: controlledChatKey, onConversationId: controlledOnConversationId, openShareSignal: controlledShareSignal, openReportSignal: controlledReportSignal, openSettingsSignal: controlledSettingsSignal, onManageCustomModels, gitStatusTick, pendingMessage, pendingMessageKey, pendingMessageSuppressUser, pendingMessageUserInitiated, userEditedFile, userEditedFileKey, isPro, isAnonymous, canEdit = true, canShare, buildUpgradeCta, buildHelpUpgradeSection, userAvatar, agentName, productName, version, extraCommands, feedbackUrl, className, }) {
     const cm = getClassMap();
+    // Share management may be gated ABOVE canEdit by the host (see
+    // ChatPanelProps.canShare) — gates the built-in header share button here and
+    // is threaded into ChatInner for the /share command + modal.
+    const shareAllowed = canShare ?? canEdit !== false;
     const isNarrow = useNarrowViewport();
     const isCoarse = useCoarsePointer();
     const http = useHttpClient();
@@ -7008,11 +7282,11 @@ export function ChatPanel({ projectId, endpoint, initialMessage, onInitialMessag
                                     textOverflow: 'ellipsis',
                                     whiteSpace: 'nowrap',
                                     opacity: 0.7,
-                                }, children: activeConv?.preview ?? 'Chat history' })] }), _jsx("button", { type: "button", "data-mol-id": "chat-share-button", onClick: () => setOpenShareSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.share.openShare', undefined, { defaultValue: 'Share project' }), "aria-label": t('ide.chat.share.openShare', undefined, {
+                                }, children: activeConv?.preview ?? 'Chat history' })] }), shareAllowed && (_jsx("button", { type: "button", "data-mol-id": "chat-share-button", onClick: () => setOpenShareSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.share.openShare', undefined, { defaultValue: 'Share project' }), "aria-label": t('ide.chat.share.openShare', undefined, {
                             defaultValue: 'Share project',
-                        }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "share", size: 14, "aria-hidden": "true" }) }), _jsx("button", { type: "button", "data-mol-id": "chat-report-button", onClick: () => setOpenReportSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.report.openReport', undefined, { defaultValue: 'Report a bug' }), "aria-label": t('ide.chat.report.openReport', undefined, {
+                        }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "share", size: 14, "aria-hidden": "true" }) })), _jsx("button", { type: "button", "data-mol-id": "chat-report-button", onClick: () => setOpenReportSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.report.openReport', undefined, { defaultValue: 'Report a bug' }), "aria-label": t('ide.chat.report.openReport', undefined, {
                             defaultValue: 'Report a bug',
-                        }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "bug", size: 14, "aria-hidden": "true" }) }), _jsx("button", { type: "button", "data-mol-id": "chat-settings-button", onClick: () => setOpenSettingsSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.openSettings', undefined, { defaultValue: 'Settings' }), "aria-label": t('ide.chat.openSettings', undefined, { defaultValue: 'Settings' }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "gear", size: 14, "aria-hidden": "true" }) }), _jsx("button", { type: "button", onClick: handleNewChat, className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.newChat', undefined, { defaultValue: 'New chat' }), style: { flexShrink: 0 }, children: "+" }), showDropdown && (_jsxs("div", { className: cm.cn(cm.surface, cm.borderAll), style: {
+                        }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "bug", size: 14, "aria-hidden": "true" }) }), _jsx("button", { type: "button", "data-mol-id": "chat-settings-button", onClick: () => setOpenSettingsSignal((n) => n + 1), className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.openSettings', undefined, { defaultValue: 'Settings' }), "aria-label": t('ide.chat.openSettings', undefined, { defaultValue: 'Settings' }), style: { flexShrink: 0, display: 'inline-flex', alignItems: 'center' }, children: _jsx(Icon, { name: "gear", size: 14, "aria-hidden": "true" }) }), canEdit !== false && (_jsx("button", { type: "button", onClick: handleNewChat, className: cm.cn(cm.button({ variant: 'ghost', size: 'xs' }), cm.touchTarget), title: t('ide.chat.newChat', undefined, { defaultValue: 'New chat' }), style: { flexShrink: 0 }, children: "+" })), showDropdown && (_jsxs("div", { className: cm.cn(cm.surface, cm.borderAll), style: {
                             position: 'absolute',
                             top: '100%',
                             left: 0,
@@ -7063,7 +7337,7 @@ export function ChatPanel({ projectId, endpoint, initialMessage, onInitialMessag
                                             textOverflow: 'ellipsis',
                                             whiteSpace: 'nowrap',
                                             width: '100%',
-                                        }, children: conv.preview ?? 'New conversation' }), _jsx("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { opacity: 0.55 }, children: relativeTime(conv.updatedAt) })] }, conv.id)))] }))] })), _jsx(ChatInner, { projectId: projectId, endpoint: chatEndpoint, initialMessage: initialMessage, onInitialMessageSent: onInitialMessageSent, isPro: isPro, isAnonymous: isAnonymous, canEdit: canEdit, buildUpgradeCta: buildUpgradeCta, buildHelpUpgradeSection: buildHelpUpgradeSection, activeFile: activeFile, openTabs: openTabs, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: onFileRevert, onFileChange: onFileChange, onFileDeleted: onFileDeleted, onCommit: onCommit, onConversationId: reportConversationId, onActivityClick: onActivityClick, onRenderError: onRenderError, onProfileClick: onProfileClick, currentUserId: currentUserId, onReadyToBuild: onReadyToBuild, awaitingSandboxBoot: awaitingSandboxBoot, onClientAction: onClientAction, onTurnComplete: onTurnComplete, onLoadingChange: onLoadingChange, onNavigatePreview: onNavigatePreview, onRegisterPushHandler: onRegisterPushHandler, autoSubmitSignal: autoSubmitSignal, openSettingsSignal: effectiveSettingsSignal, onManageCustomModels: onManageCustomModels, openReportSignal: effectiveReportSignal, openShareSignal: effectiveShareSignal, initialInputValue: initialInputValue, pendingMessage: pendingMessage, pendingMessageKey: pendingMessageKey, pendingMessageSuppressUser: pendingMessageSuppressUser, pendingMessageUserInitiated: pendingMessageUserInitiated, userEditedFile: userEditedFile, userEditedFileKey: userEditedFileKey, gitStatusTick: gitStatusTick, discovery: hideConversationMenu, userAvatar: userAvatar, agentName: agentName, productName: productName, version: version, extraCommands: extraCommands, feedbackUrl: feedbackUrl }, chatKey)] }));
+                                        }, children: conv.preview ?? 'New conversation' }), _jsx("span", { className: cm.cn(cm.textMuted, cm.textSize('xs')), style: { opacity: 0.55 }, children: relativeTime(conv.updatedAt) })] }, conv.id)))] }))] })), _jsx(ChatInner, { projectId: projectId, endpoint: chatEndpoint, initialMessage: initialMessage, onInitialMessageSent: onInitialMessageSent, isPro: isPro, isAnonymous: isAnonymous, canEdit: canEdit, canShare: shareAllowed, buildUpgradeCta: buildUpgradeCta, buildHelpUpgradeSection: buildHelpUpgradeSection, activeFile: activeFile, openTabs: openTabs, onFileOpen: onFileOpen, onFileDoubleClick: onFileDoubleClick, onFileDiff: onFileDiff, onFileRevert: onFileRevert, onFileChange: onFileChange, onFileDeleted: onFileDeleted, onCommit: onCommit, onConversationId: reportConversationId, onActivityClick: onActivityClick, onRenderError: onRenderError, onProfileClick: onProfileClick, currentUserId: currentUserId, onReadyToBuild: onReadyToBuild, awaitingSandboxBoot: awaitingSandboxBoot, onClientAction: onClientAction, onTurnComplete: onTurnComplete, onLoadingChange: onLoadingChange, onNavigatePreview: onNavigatePreview, onRegisterPushHandler: onRegisterPushHandler, autoSubmitSignal: autoSubmitSignal, openSettingsSignal: effectiveSettingsSignal, onManageCustomModels: onManageCustomModels, openReportSignal: effectiveReportSignal, openShareSignal: effectiveShareSignal, initialInputValue: initialInputValue, pendingMessage: pendingMessage, pendingMessageKey: pendingMessageKey, pendingMessageSuppressUser: pendingMessageSuppressUser, pendingMessageUserInitiated: pendingMessageUserInitiated, userEditedFile: userEditedFile, userEditedFileKey: userEditedFileKey, gitStatusTick: gitStatusTick, discovery: hideConversationMenu, userAvatar: userAvatar, agentName: agentName, productName: productName, version: version, extraCommands: extraCommands, feedbackUrl: feedbackUrl }, chatKey)] }));
 }
 ChatPanel.displayName = 'ChatPanel';
 //# sourceMappingURL=ChatPanel.js.map