AI Chat Session List

List view for browsing AI chat sessions

SaaSAI Chat

Overview

AiChatSessionList displays a scrollable list of AI chat sessions grouped by status. Each item shows the session title, agent name, message count, and relative timestamp. Supports active session highlighting, empty state, and an optional "New Session" button.

Usage

import { AiChatSessionList } from "@leanicon/web-builder-library/saas";

<AiChatSessionList
  sessions={[
    {
      id: "session-1",
      title: "Help with onboarding",
      agentId: "agent-1",
      agentName: "Support Assistant",
      status: "active",
      messageCount: 8,
      lastMessageAt: new Date().toISOString(),
      createdAt: new Date().toISOString(),
    },
  ]}
  onSessionClick={(session) => console.log("Clicked:", session.id)}
  onNewSession={() => console.log("New session")}
/>;

Variants

Default

AI Sessions

Default (Dark)

AI Sessions

With Active Session

AI Sessions

With Active Session (Dark)

AI Sessions

Empty

AI Sessions

No sessions yet

Empty (Dark)

AI Sessions

No sessions yet

Without New Button

AI Sessions

Props

Name	Type	Default	Required	Description
`sessions`	`AiChatSession[]`	—	Yes	List of AI chat sessions
`activeSessionId`	`string`	—	No	Currently active session ID
`onSessionClick`	`(session: AiChatSession) => void`	—	Yes	Callback when session is clicked
`onNewSession`	`(() => void)`	—	No	Callback when new session is requested
`className`	`string`	—	No	Additional CSS class names