import type { Meta, StoryObj } from "@storybook/nextjs-vite";
import type React from "react";

import { ContextCompactionDisplay } from "../components/chat/context-compaction-display";

/**
 * Inline status pill for `context_compaction` message segments — shown when
 * the conversation hits the context limit and earlier messages get
 * summarized. `started` shows a dots loader, `completed` a green check.
 */

const plainDecorator = (Story: React.ComponentType) => (
	<div style={{ maxWidth: 640, background: "var(--color-bg)" }} className="p-4">
		<Story />
	</div>
);

const meta = {
	title: "Chat/ContextCompactionDisplay",
	component: ContextCompactionDisplay,
	tags: ["autodocs"],
	parameters: {
		docs: {
			description: {
				component:
					"Renders a `context_compaction` message segment — 'Context limit reached…' with a dots loader while running, 'Earlier context summarized.' with a check once done.",
			},
		},
	},
	decorators: [plainDecorator],
} satisfies Meta<typeof ContextCompactionDisplay>;

export default meta;
type Story = StoryObj<typeof meta>;

/** In progress — summarizing earlier messages. */
export const Started: Story = {
	args: { status: "started" },
};

/** Finished — earlier context summarized. */
export const Completed: Story = {
	args: { status: "completed" },
};