Only offer reply and reactions on bot messages

The user's own messages no longer get the reply and react row. A bot's
reaction to one still shows, read-only, and react-message refuses a
reaction on the user's own message.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/pages/admin/bots/[bot_id]/(partials)/message-reaction-chip.tsx

@@ -3,14 +3,34 @@ import Span from "@moduletrace/twui/layout/Span";
 import type { BotMessageReaction } from "@/src/types";
 
 type Props = BotMessageReaction & {
-    onToggle: () => void;
+    /**
+     * Left out on the user's own messages: the bot's reactions there only
+     * show.
+     */
+    onToggle?: () => void;
 };
 
 /**
  * One emoji reaction under a message: its count, highlighted when the
  * user gave it. Clicking takes it back or adds it.
  */
-export default function MessageReactionChip({ emoji, count, mine, onToggle }: Props) {
+export default function MessageReactionChip({
+    emoji,
+    count,
+    mine,
+    onToggle,
+}: Props) {
+    if (!onToggle) {
+        return (
+            <Span className="inline-flex shrink-0 items-center gap-1 px-2 py-0.5 rounded-default-lg border border-solid border-hairline bg-surface text-xs leading-4 text-ink-secondary">
+                <Span className="text-sm leading-4">{emoji}</Span>
+                {count > 1 ? (
+                    <Span className="tabular-nums">{count}</Span>
+                ) : null}
+            </Span>
+        );
+    }
+
     return (
         <Button
             title={mine ? "Remove your reaction" : "Add this reaction"}
@@ -20,7 +40,7 @@ export default function MessageReactionChip({ emoji, count, mine, onToggle }: Pr
             variant="ghost"
             color="text"
             onClick={onToggle}
-            className={`shrink-0 gap-1! px-2! py-0.5! rounded-default-lg border border-solid text-xs leading-4 ${
+            className={`shrink-0 gap-1! p-0! rounded-default-lg text-xs leading-4 ${
                 mine
                     ? "border-hairline-strong bg-sunken text-ink"
                     : "border-hairline bg-surface text-ink-secondary hover:text-ink"

src/pages/admin/bots/[bot_id]/(partials)/message-reactions.tsx

@@ -6,11 +6,15 @@ import MessageReactionChip from "./message-reaction-chip";
 type Props = {
     message_id: number;
     reactions?: BotMessageReaction[];
-    onReact: (params: { message_id: number; emoji: BotMessageReactionEmoji }) => void;
+    /**
+     * Left out where the reactions only show (the user's own messages).
+     */
+    onReact?: (params: { message_id: number; emoji: BotMessageReactionEmoji }) => void;
 };
 
 /**
- * The reactions a message has, one chip per emoji, each toggleable.
+ * The reactions a message has, one chip per emoji, each toggleable when
+ * `onReact` is given.
  */
 export default function MessageReactions({ message_id, reactions, onReact }: Props) {
     if (!reactions?.length) return null;
@@ -23,7 +27,7 @@ export default function MessageReactions({ message_id, reactions, onReact }: Pro
                     emoji={reaction.emoji}
                     count={reaction.count}
                     mine={reaction.mine}
-                    onToggle={() => onReact({ message_id, emoji: reaction.emoji })}
+                    onToggle={onReact ? () => onReact({ message_id, emoji: reaction.emoji }) : undefined}
                 />
             ))}
         </Row>

src/pages/admin/bots/[bot_id]/(partials)/user-message.tsx

@@ -1,8 +1,5 @@
-import { useContext } from "react";
 import Stack from "@moduletrace/twui/layout/Stack";
 import type { BotMessageWithAttachments } from "@/src/types";
-import { BotMessageActionsContext } from "../(data)/message-actions-context";
-import MessageActions from "./message-actions";
 import MessageAttachments from "./message-attachments";
 import MessageReactions from "./message-reactions";
 import MessageReplyQuote from "./message-reply-quote";
@@ -15,11 +12,10 @@ type Props = {
 
 /**
  * One user message: the quoted message it answers, its files, then its
- * text (a file-only message has no bubble), its reactions and actions.
+ * text (a file-only message has no bubble) and the bot's reactions to it.
+ * The user doesn't reply to or react to their own messages.
  */
 export default function UserMessage({ message, bot_name }: Props) {
-    const { onReact } = useContext(BotMessageActionsContext);
-
     return (
         <Stack className="w-full min-w-0 max-w-full items-end gap-1.5!">
             {message.reply_to ? (
@@ -35,10 +31,8 @@ export default function UserMessage({ message, bot_name }: Props) {
                 <MessageReactions
                     message_id={message.id}
                     reactions={message.reactions}
-                    onReact={onReact}
                 />
             ) : null}
-            <MessageActions message={message} />
         </Stack>
     );
 }