@promptbook/cli 0.114.0-5 → 0.114.0-50

package/apps/agents-server/src/app/admin/messages/MessageParticipants.tsx

@@ -0,0 +1,84 @@
+import type { Json } from '../../../database/schema';
+import { normalizeMessageContacts, type MessageContact } from './messageAdminPresentation';
+
+/**
+ * Props for one sender/recipients table cell.
+ */
+type MessageParticipantsProps = {
+    readonly channel: string;
+    readonly sender: Json;
+    readonly recipients: Json;
+};
+
+/**
+ * Renders sender and recipient values as named contacts instead of raw JSON.
+ */
+export function MessageParticipants({ channel, sender, recipients }: MessageParticipantsProps) {
+    const senderContacts = normalizeMessageContacts(sender);
+    const recipientContacts = normalizeMessageContacts(recipients);
+    const isEmail = channel === 'EMAIL';
+
+    return (
+        <dl className="min-w-56 space-y-2 text-xs">
+            <MessageContactList label={isEmail ? 'From' : 'Sender'} contacts={senderContacts} />
+            <MessageContactList label={isEmail ? 'To' : 'Recipients'} contacts={recipientContacts} />
+        </dl>
+    );
+}
+
+/**
+ * Props for one labelled group of message contacts.
+ */
+type MessageContactListProps = {
+    readonly label: string;
+    readonly contacts: ReadonlyArray<MessageContact>;
+};
+
+/**
+ * Renders a compact label next to one or more message contacts.
+ */
+function MessageContactList({ label, contacts }: MessageContactListProps) {
+    return (
+        <div className="grid grid-cols-[2.5rem_minmax(0,1fr)] items-start gap-2">
+            <dt className="pt-0.5 font-semibold uppercase tracking-wide text-gray-400">{label}</dt>
+            <dd className="min-w-0 space-y-1">
+                {contacts.length > 0
+                    ? contacts.map((contact, index) => (
+                          <MessageContactValue key={`${contact.address}:${index}`} contact={contact} />
+                      ))
+                    : '-'}
+            </dd>
+        </div>
+    );
+}
+
+/**
+ * Props for one normalized message contact.
+ */
+type MessageContactValueProps = {
+    readonly contact: MessageContact;
+};
+
+/**
+ * Renders an optional display name and a wrapping address or generic identifier.
+ */
+function MessageContactValue({ contact }: MessageContactValueProps) {
+    return (
+        <div className="min-w-0 rounded-md border border-gray-200 bg-gray-50 px-2 py-1.5">
+            {contact.fullName ? <div className="truncate font-medium text-gray-800">{contact.fullName}</div> : null}
+            {contact.isEmail ? (
+                <a
+                    href={`mailto:${contact.address}`}
+                    className="break-all text-blue-700 hover:text-blue-900 hover:underline"
+                    title={contact.address}
+                >
+                    {contact.address}
+                </a>
+            ) : (
+                <div className="break-all text-gray-700" title={contact.address}>
+                    {contact.address || '-'}
+                </div>
+            )}
+        </div>
+    );
+}

package/apps/agents-server/src/app/admin/messages/MessageStatus.tsx

@@ -0,0 +1,96 @@
+import type { MessageSendAttemptRow } from '../../../utils/messagesAdmin';
+import {
+    formatMessageSendAttemptLog,
+    getFailedMessageSendAttempts,
+    resolveLatestMessageSendAttemptErrorMessage,
+    resolveMessageStatusPresentation,
+    type MessageStatusPresentation,
+} from './messageAdminPresentation';
+
+/**
+ * Props for the direction-aware message status cell.
+ */
+type MessageStatusProps = {
+    readonly direction: string;
+    readonly attempts: ReadonlyArray<MessageSendAttemptRow> | undefined;
+};
+
+/**
+ * Renders delivery status, a compact failure reason, and the complete persisted provider log.
+ */
+export function MessageStatus({ direction, attempts }: MessageStatusProps) {
+    const status = resolveMessageStatusPresentation(direction, attempts);
+    const failedAttempts = getFailedMessageSendAttempts(attempts);
+    const latestErrorMessage = resolveLatestMessageSendAttemptErrorMessage(attempts);
+
+    return (
+        <div className="min-w-64 space-y-2">
+            <MessageStatusBadge status={status} />
+            {latestErrorMessage ? (
+                <p className="max-w-sm whitespace-normal break-words text-xs leading-relaxed text-red-700">
+                    {latestErrorMessage}
+                </p>
+            ) : null}
+            {failedAttempts.length > 0 ? (
+                <details className="max-w-xl whitespace-normal rounded-md border border-red-200 bg-red-50 p-2 text-xs">
+                    <summary className="cursor-pointer font-medium text-red-800">
+                        <span>Complete log</span> ({failedAttempts.length})
+                    </summary>
+                    <div className="mt-2 space-y-3">
+                        {failedAttempts.map((attempt) => (
+                            <pre
+                                key={attempt.id}
+                                className="max-h-80 overflow-auto whitespace-pre-wrap break-words rounded bg-gray-950 p-3 text-[10px] leading-relaxed text-gray-100"
+                            >
+                                {formatMessageSendAttemptLog(attempt)}
+                            </pre>
+                        ))}
+                    </div>
+                </details>
+            ) : null}
+        </div>
+    );
+}
+
+/**
+ * Props for the compact message status badge.
+ */
+type MessageStatusBadgeProps = {
+    readonly status: MessageStatusPresentation;
+};
+
+/**
+ * Renders the visual badge for one resolved message status.
+ */
+function MessageStatusBadge({ status }: MessageStatusBadgeProps) {
+    if (status.kind === 'received') {
+        return (
+            <span className="inline-flex items-center rounded bg-emerald-100 px-2 py-0.5 text-xs font-medium text-emerald-800">
+                Received
+            </span>
+        );
+    }
+
+    if (status.kind === 'sent') {
+        return (
+            <span className="inline-flex items-center rounded bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800">
+                <span>Sent</span>
+                {status.providerName ? ` (${status.providerName})` : ''}
+            </span>
+        );
+    }
+
+    if (status.kind === 'failed') {
+        return (
+            <span className="inline-flex items-center rounded bg-red-100 px-2 py-0.5 text-xs font-medium text-red-800">
+                <span>Failed</span> ({status.attemptCount})
+            </span>
+        );
+    }
+
+    return (
+        <span className="inline-flex items-center rounded bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-800">
+            Pending
+        </span>
+    );
+}

package/apps/agents-server/src/app/admin/messages/MessagesClient.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import Link from 'next/link';
 import { useEffect, useMemo, useState } from 'react';
 import { useServerLanguage } from '../../../components/ServerLanguage/ServerLanguageProvider';
 import { Card } from '../../../components/Homepage/Card';
@@ -7,13 +8,14 @@ import type { ServerLanguageCode } from '../../../languages/ServerLanguageRegist
 import {
     $fetchMessages,
     type MessageRow,
-    type MessageSendAttemptRow,
     type MessageSortField,
     type MessageSortOrder,
 } from '../../../utils/messagesAdmin';
 import { formatServerLanguageHumanReadableDate } from '../../../utils/localization/formatServerLanguageHumanReadableDate';
 import { AdminSortableTableHeaderCell } from '../_components/AdminSortableTableHeaderCell';
 import { resolveNextAdminTableSortState } from '../_components/adminTableSorting';
+import { MessageParticipants } from './MessageParticipants';
+import { MessageStatus } from './MessageStatus';
 
 /**
  * Formats date.
@@ -30,20 +32,6 @@ function getMessagePreview(content: string, maxLength = 120): string {
     return content.length > maxLength ? `${content.slice(0, maxLength)}…` : content;
 }
 
-/**
- * Gets status badge.
- */
-function getStatusBadge(attempts: MessageSendAttemptRow[] | undefined) {
-    if (!attempts || attempts.length === 0) {
-        return <span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-800">Pending</span>;
-    }
-    const success = attempts.find(a => a.isSuccessful);
-    if (success) {
-        return <span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800">Sent ({success.providerName})</span>;
-    }
-    return <span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-red-100 text-red-800">Failed ({attempts.length})</span>;
-}
-
 /**
  * Resolves the initial direction used when switching message sort fields.
  */
@@ -188,7 +176,13 @@ export function MessagesClient() {
                         Inspect all inbound and outbound messages and their statuses.
                     </p>
                 </div>
-                <div className="flex items-end gap-4 text-sm text-gray-500 md:text-right">
+                <div className="flex flex-wrap items-end gap-4 text-sm text-gray-500 md:text-right">
+                    <Link
+                        href="/admin/messages/send-email"
+                        className="rounded-md border border-blue-600 px-3 py-2 text-sm font-medium text-blue-700 hover:bg-blue-50"
+                    >
+                        Send test email
+                    </Link>
                     <div>
                         <div className="text-xl font-semibold text-gray-900">{total.toLocaleString()}</div>
                         <div className="text-xs uppercase tracking-wide text-gray-400">Total messages</div>
@@ -227,7 +221,10 @@ export function MessagesClient() {
                             <select
                                 id="channelFilter"
                                 value={channel}
-                                onChange={(e) => { setChannel(e.target.value); setPage(1); }}
+                                onChange={(e) => {
+                                    setChannel(e.target.value);
+                                    setPage(1);
+                                }}
                                 className="w-full md:w-40 px-3 py-2 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
                             >
                                 <option value="">All</option>
@@ -243,7 +240,10 @@ export function MessagesClient() {
                             <select
                                 id="directionFilter"
                                 value={direction}
-                                onChange={(e) => { setDirection(e.target.value); setPage(1); }}
+                                onChange={(e) => {
+                                    setDirection(e.target.value);
+                                    setPage(1);
+                                }}
                                 className="w-full md:w-40 px-3 py-2 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
                             >
                                 <option value="">All</option>
@@ -337,26 +337,22 @@ export function MessagesClient() {
                                         <td className="whitespace-nowrap px-4 py-3 text-gray-700">
                                             {formatDate(row.createdAt, language)}
                                         </td>
-                                        <td className="whitespace-nowrap px-4 py-3 text-gray-700">
-                                            {row.channel}
-                                        </td>
-                                        <td className="whitespace-nowrap px-4 py-3 text-gray-700">
-                                            {row.direction}
+                                        <td className="whitespace-nowrap px-4 py-3 text-gray-700">{row.channel}</td>
+                                        <td className="whitespace-nowrap px-4 py-3 text-gray-700">{row.direction}</td>
+                                        <td className="max-w-sm px-4 py-3 align-top text-gray-700">
+                                            <MessageParticipants
+                                                channel={row.channel}
+                                                sender={row.sender}
+                                                recipients={row.recipients}
+                                            />
                                         </td>
-                                        <td className="max-w-xs px-4 py-3 text-gray-700">
-                                            <div className="truncate" title={JSON.stringify({ sender: row.sender, recipients: row.recipients }, null, 2)}>
-                                                {/* Simple preview of sender/recipients */}
-                                                S: {JSON.stringify(row.sender)}<br/>
-                                                R: {JSON.stringify(row.recipients)}
-                                            </div>
-                                        </td>
-                                        <td className="max-w-md px-4 py-3 text-gray-700">
+                                        <td className="max-w-md px-4 py-3 align-top text-gray-700">
                                             <div className="max-h-24 overflow-hidden overflow-ellipsis text-xs leading-snug">
                                                 {getMessagePreview(row.content)}
                                             </div>
                                         </td>
-                                        <td className="whitespace-nowrap px-4 py-3 text-gray-700">
-                                            {getStatusBadge(row.sendAttempts)}
+                                        <td className="px-4 py-3 align-top text-gray-700">
+                                            <MessageStatus direction={row.direction} attempts={row.sendAttempts} />
                                         </td>
                                     </tr>
                                 ))}

package/apps/agents-server/src/app/admin/messages/messageAdminPresentation.ts

@@ -0,0 +1,289 @@
+import type { string_email } from '@promptbook-local/types';
+import type { Json } from '../../../database/schema';
+import { parseEmailAddress } from '../../../message-providers/email/_common/utils/parseEmailAddress';
+import type { MessageSendAttemptRow } from '../../../utils/messagesAdmin';
+
+/**
+ * Contact normalized for display in the messages administration table.
+ */
+export type MessageContact = {
+    readonly fullName: string | null;
+    readonly address: string;
+    readonly isEmail: boolean;
+};
+
+/**
+ * Status variants rendered by the messages administration table.
+ */
+export type MessageStatusKind = 'received' | 'pending' | 'sent' | 'failed';
+
+/**
+ * Direction-aware message status prepared for rendering.
+ */
+export type MessageStatusPresentation = {
+    readonly kind: MessageStatusKind;
+    readonly attemptCount: number;
+    readonly providerName: string | null;
+};
+
+/**
+ * Error fields extracted from a persisted provider response.
+ */
+type MessageSendAttemptError = {
+    readonly name: string | null;
+    readonly message: string;
+    readonly stack: string | null;
+};
+
+/**
+ * Converts arbitrary sender or recipient JSON into consistently renderable contacts.
+ */
+export function normalizeMessageContacts(value: Json): MessageContact[] {
+    if (value === null || value === undefined) {
+        return [];
+    }
+
+    if (Array.isArray(value)) {
+        return value.flatMap(normalizeMessageContacts);
+    }
+
+    if (typeof value === 'string') {
+        return [createMessageContact(value)];
+    }
+
+    if (typeof value === 'object') {
+        const address = readFirstStringProperty(value, ['fullEmail', 'email', 'address']);
+        const fullName = readFirstStringProperty(value, ['fullName', 'name']);
+
+        if (address) {
+            return [createMessageContact(address, fullName)];
+        }
+
+        return [createMessageContact(JSON.stringify(value) || String(value))];
+    }
+
+    return [createMessageContact(String(value))];
+}
+
+/**
+ * Resolves message status without treating received inbound messages as unsent outbound messages.
+ */
+export function resolveMessageStatusPresentation(
+    direction: string,
+    attempts: ReadonlyArray<MessageSendAttemptRow> | undefined,
+): MessageStatusPresentation {
+    const normalizedAttempts = attempts || [];
+
+    if (direction === 'INBOUND') {
+        return {
+            kind: 'received',
+            attemptCount: normalizedAttempts.length,
+            providerName: null,
+        };
+    }
+
+    const successfulAttempt = normalizedAttempts.find((attempt) => attempt.isSuccessful);
+    if (successfulAttempt) {
+        return {
+            kind: 'sent',
+            attemptCount: normalizedAttempts.length,
+            providerName: successfulAttempt.providerName,
+        };
+    }
+
+    if (normalizedAttempts.length > 0) {
+        return {
+            kind: 'failed',
+            attemptCount: normalizedAttempts.length,
+            providerName: null,
+        };
+    }
+
+    return {
+        kind: 'pending',
+        attemptCount: 0,
+        providerName: null,
+    };
+}
+
+/**
+ * Returns failed send attempts in chronological order for stable diagnostic output.
+ */
+export function getFailedMessageSendAttempts(
+    attempts: ReadonlyArray<MessageSendAttemptRow> | undefined,
+): MessageSendAttemptRow[] {
+    return [...(attempts || [])]
+        .filter((attempt) => !attempt.isSuccessful)
+        .sort(compareMessageSendAttemptsChronologically);
+}
+
+/**
+ * Extracts the most recent useful provider error message for the compact table view.
+ */
+export function resolveLatestMessageSendAttemptErrorMessage(
+    attempts: ReadonlyArray<MessageSendAttemptRow> | undefined,
+): string | null {
+    const failedAttempts = getFailedMessageSendAttempts(attempts);
+
+    for (let index = failedAttempts.length - 1; index >= 0; index -= 1) {
+        const error = resolveMessageSendAttemptError(failedAttempts[index]!.raw);
+        if (error) {
+            return error.message;
+        }
+    }
+
+    return null;
+}
+
+/**
+ * Formats one complete persisted delivery attempt, including the readable stack and untouched raw response.
+ */
+export function formatMessageSendAttemptLog(attempt: MessageSendAttemptRow): string {
+    const normalizedRaw = parseStoredJsonValue(attempt.raw);
+    const error = resolveMessageSendAttemptError(normalizedRaw);
+    const errorLines = error
+        ? [
+              '',
+              'Error:',
+              ...(error.name ? [`Name: ${error.name}`] : []),
+              `Message: ${error.message}`,
+              ...(error.stack ? ['Stack:', error.stack] : []),
+          ]
+        : [];
+
+    return [
+        `Attempt ID: ${attempt.id}`,
+        `Time: ${attempt.createdAt || '-'}`,
+        `Provider: ${attempt.providerName || '-'}`,
+        `Successful: ${attempt.isSuccessful ? 'yes' : 'no'}`,
+        ...errorLines,
+        '',
+        'Raw provider response:',
+        formatJsonForLog(normalizedRaw),
+    ].join('\n');
+}
+
+/**
+ * Parses one contact string with the shared email parser and retains non-email identifiers verbatim.
+ */
+function createMessageContact(value: string, preferredFullName: string | null = null): MessageContact {
+    const normalizedValue = value.trim();
+
+    try {
+        const parsedAddress = parseEmailAddress(normalizedValue as string_email);
+        return {
+            fullName: preferredFullName || parsedAddress.fullName,
+            address: parsedAddress.fullEmail,
+            isEmail: true,
+        };
+    } catch {
+        return {
+            fullName: preferredFullName,
+            address: normalizedValue,
+            isEmail: false,
+        };
+    }
+}
+
+/**
+ * Reads the first non-empty string property from one JSON object.
+ */
+function readFirstStringProperty(
+    value: Record<string, Json | undefined>,
+    propertyNames: ReadonlyArray<string>,
+): string | null {
+    for (const propertyName of propertyNames) {
+        const propertyValue = value[propertyName];
+        if (typeof propertyValue === 'string' && propertyValue.trim()) {
+            return propertyValue.trim();
+        }
+    }
+
+    return null;
+}
+
+/**
+ * Orders send attempts by their persisted timestamp and then by id.
+ */
+function compareMessageSendAttemptsChronologically(
+    firstAttempt: MessageSendAttemptRow,
+    secondAttempt: MessageSendAttemptRow,
+): number {
+    const timestampComparison = (firstAttempt.createdAt || '').localeCompare(secondAttempt.createdAt || '');
+    return timestampComparison || firstAttempt.id - secondAttempt.id;
+}
+
+/**
+ * Extracts standard serialized-error fields from legacy and current attempt payloads.
+ */
+function resolveMessageSendAttemptError(raw: unknown): MessageSendAttemptError | null {
+    const normalizedRaw = parseStoredJsonValue(raw);
+    if (typeof normalizedRaw === 'string') {
+        return normalizedRaw.trim()
+            ? {
+                  name: null,
+                  message: normalizedRaw,
+                  stack: null,
+              }
+            : null;
+    }
+
+    if (!isJsonObject(normalizedRaw)) {
+        return null;
+    }
+
+    const errorValue = parseStoredJsonValue(normalizedRaw.error ?? normalizedRaw);
+    if (typeof errorValue === 'string') {
+        return errorValue.trim()
+            ? {
+                  name: null,
+                  message: errorValue,
+                  stack: null,
+              }
+            : null;
+    }
+
+    if (!isJsonObject(errorValue) || typeof errorValue.message !== 'string' || !errorValue.message.trim()) {
+        return null;
+    }
+
+    return {
+        name: typeof errorValue.name === 'string' && errorValue.name.trim() ? errorValue.name.trim() : null,
+        message: errorValue.message.trim(),
+        stack: typeof errorValue.stack === 'string' && errorValue.stack.trim() ? errorValue.stack.trim() : null,
+    };
+}
+
+/**
+ * Parses JSON text emitted by legacy database adapters while leaving ordinary strings untouched.
+ */
+function parseStoredJsonValue(value: unknown): unknown {
+    if (typeof value !== 'string') {
+        return value;
+    }
+
+    try {
+        return JSON.parse(value) as unknown;
+    } catch {
+        return value;
+    }
+}
+
+/**
+ * Formats a persisted JSON value for a preformatted diagnostic block.
+ */
+function formatJsonForLog(value: unknown): string {
+    if (typeof value === 'string') {
+        return value;
+    }
+
+    const formattedValue = JSON.stringify(value, null, 2);
+    return formattedValue === undefined ? String(value) : formattedValue;
+}
+
+/**
+ * Checks whether an unknown value is a non-array object with string keys.
+ */
+function isJsonObject(value: unknown): value is Record<string, unknown> {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+}