useInteractionHistory

Signature

function useInteractionHistory(options?: {
  limit?: number;   // Max items to return (default: 50, configured on InteractionProvider)
  types?: string[]; // Filter by interaction type
}): {
  history: CompletedInteraction[];
  clear: () => void;
}

interface CompletedInteraction {
  request: InteractionRequest;
  response: InteractionResponse | null; // null if timed out
  completedAt: string;                  // ISO 8601
  status: 'responded' | 'timed_out' | 'dismissed';
}

Building a History Panel

import { useInteractionHistory } from 'edge-interact-react';

function InteractionHistoryPanel() {
  const { history } = useInteractionHistory({ limit: 20 });

  if (history.length === 0) {
    return <p>No completed interactions yet.</p>;
  }

  return (
    <div className="history-panel">
      <h3>Recent Interactions</h3>
      {history.map(item => (
        <div key={item.request.interactionId} className="history-item">
          <span className="type">{item.request.type}</span>
          <span className="title">{item.request.title}</span>
          {item.status === 'responded' && (
            <span className={`outcome outcome-${item.response!.outcome}`}>
              {item.response!.outcome}
            </span>
          )}
          {item.status === 'timed_out' && (
            <span className="outcome outcome-timeout">Expired</span>
          )}
          <span className="time">{formatRelativeTime(item.completedAt)}</span>
        </div>
      ))}
    </div>
  );
}

History Scope

The history store is in-memory and scoped to the current browser session. It is populated as interactions are completed during the session. It does not persist across page reloads — for persistent audit data, use the server-side audit log (IInteractionAuditStore) exposed via an API.

Clearing History

const { history, clear } = useInteractionHistory();

// Clear the in-memory history (e.g., on logout)
function handleLogout() {
  clear();
  auth.logout();
}