feat(journal): add ErrorPopup to display full error messages

Introduces an ErrorPopup component that allows users to view the
complete error message by clicking on the truncated error text in
the JournalInput.

src/components/journal/JournalInput.tsx

@@ -26,6 +26,7 @@ import { parseInput } from "./command-parser";
 import type { CompletionItem } from "./command-parser";
 import { buildCompletions } from "./command-completions";
 import { CompletionsDropdown } from "./CompletionsDropdown";
+import { ErrorPopup } from "./ErrorPopup";
 
 // ---- Component ----
 
@@ -39,6 +40,7 @@ export const JournalInput: Component = () => {
 
   const [text, setText] = createSignal("");
   const [error, setError] = createSignal<string | null>(null);
+  const [showErrorPopup, setShowErrorPopup] = createSignal(false);
   const [sending, setSending] = createSignal(false);
   const [showCompletions, setShowCompletions] = createSignal(false);
   const [selectedIdx, setSelectedIdx] = createSignal(0);
@@ -406,7 +408,13 @@ export const JournalInput: Component = () => {
 
           <div class="flex items-center justify-between px-2 pb-2">
             <Show when={error()}>
-              <p class="text-red-500 text-xs truncate max-w-[60%]">{error()}</p>
+              <button
+                onClick={() => setShowErrorPopup((v) => !v)}
+                class="text-red-500 text-xs truncate max-w-[60%] text-left hover:underline"
+                title={error() ?? undefined}
+              >
+                {error()}
+              </button>
             </Show>
             <div class="flex items-center gap-1 ml-auto">
               <button
@@ -422,6 +430,13 @@ export const JournalInput: Component = () => {
           </div>
         </Show>
       </div>
+
+      {/* Error popup */}
+      <ErrorPopup
+        message={error()}
+        show={showErrorPopup()}
+        onClose={() => setShowErrorPopup(false)}
+      />
     </div>
   );
 };