# GenieChatMessage

Renders a single Genie message bubble with optional expandable SQL query attachments.

## GenieChatMessage[​](#geniechatmessage-1 "Direct link to GenieChatMessage")

Renders a single Genie message bubble with optional expandable SQL query attachments.

**Source:** [`packages/appkit-ui/src/react/genie/genie-chat-message.tsx`](https://github.com/databricks/appkit/blob/main/packages/appkit-ui/src/react/genie/genie-chat-message.tsx)

### Props[​](#props "Direct link to Props")

| Prop        | Type               | Required | Default | Description                  |
| ----------- | ------------------ | -------- | ------- | ---------------------------- |
| `message`   | `GenieMessageItem` | ✓        | -       | The message object to render |
| `className` | `string`           |          | -       | Additional CSS class         |

### Usage[​](#usage "Direct link to Usage")

```tsx
import { GenieChatMessage } from '@databricks/appkit-ui';

<GenieChatMessage /* props */ />

```