<!-- source-hash: 97d757bd7f6ce826c293b7cabfdf5f49 -->
Storybook stories for the **client-facing (Fae end-user)** variant of `ApprovalBatchMessage`, demonstrating all approval states a client can encounter.

## Key Components

| Export | Description |
|---|---|
| `Pending` | Title + Approve/Reject buttons; no command details exposed |
| `Approved` | Full-text green status pill with resolver name |
| `Rejected` | Full-text red status pill with resolver name |
| `Cancelled` | Full-text grey status pill with resolver name |
| `AllStates` | Composite story rendering all four states stacked vertically |

## Usage Example

```typescript
import { ApprovalBatchMessage } from "../components/chat/approval-batch-message";

// Pending state — client sees only the BE-generated title + action buttons
<ApprovalBatchMessage
  variant="client"
  data={{
    approvalRequestId: "batch-1",
    approvalType: "CLIENT",
    toolCalls: [{
      toolExecutionRequestId: "req-1",
      toolName: "run_script",
      toolTitle: "Run Script",
      toolExplanation: "Exports today's event logs to CSV.",
      toolType: "OPENFRAME_RMM",
      requiresApproval: true,
      approvalType: "CLIENT",
      toolCallArguments: { command: "...", timeoutSeconds: 60 },
    }],
  }}
  status="pending"
  onApprove={() => {}}
  onReject={() => {}}
/>

// Resolved state — client sees a status pill only
<ApprovalBatchMessage
  variant="client"
  data={data}
  status="approved"
  resolvedByName="Michael Johnson"
/>
```

## Notes

- Gated by `variant="client"` — commands, scripts, expandable args/results, and execution icons are **never rendered** in this variant.
- The client sees only the BE-generated `toolExplanation` field as the card title.
- Mirrors Figma node `203-11947` ("fae-approval-block") and frames `1-6575`, `1-6621`, `1-6637`, `1-6653`.
- Source: [`ApprovalBatchMessageClient.stories.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/ApprovalBatchMessageClient.stories.tsx)