"use client";
import { jsxs, jsx } from 'react/jsx-runtime';
import { useState, useCallback } from 'react';
import { Button } from '../../../../../../ui/src/components/button.mjs';
import { Badge } from '../../../../../../ui/src/components/badge.mjs';
import { Sheet, SheetTrigger, SheetContent } from '../../../../../../ui/src/components/sheet.mjs';
import { Sparkles, Trash2, X, Menu, PanelLeftClose, PanelLeft } from 'lucide-react';
import { cn } from '../../../../../../ui/src/lib/utils.mjs';
import { ChatSidebar } from './chat-sidebar.mjs';
import { ChatInterface } from './chat-interface.mjs';
import { usePageAIContext } from '../../../../../../../plugins/ai-chat/client/context/page-ai-context.mjs';

function ChatLayout(props) {
  const {
    apiBaseURL,
    apiBasePath,
    conversationId,
    layout = "full",
    className,
    showSidebar = true,
    initialMessages,
    onMessagesChange,
    onClear
  } = props;
  const widgetHeight = props.layout === "widget" ? props.widgetHeight ?? "600px" : "600px";
  const widgetWidth = props.layout === "widget" ? props.widgetWidth ?? "380px" : "380px";
  const defaultOpen = props.layout === "widget" ? props.defaultOpen ?? false : false;
  const showTrigger = props.layout === "widget" ? props.showTrigger ?? true : true;
  const [sidebarOpen, setSidebarOpen] = useState(true);
  const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);
  const [chatResetKey, setChatResetKey] = useState(0);
  const [widgetOpen, setWidgetOpen] = useState(defaultOpen);
  const [widgetResetKey, setWidgetResetKey] = useState(0);
  const [widgetEverOpened, setWidgetEverOpened] = useState(defaultOpen);
  const pageAIContext = usePageAIContext();
  const apiPath = `${apiBaseURL}${apiBasePath}/chat`;
  const handleNewChat = useCallback(() => {
    if (!conversationId) {
      setChatResetKey((prev) => prev + 1);
    }
  }, [conversationId]);
  if (layout === "widget") {
    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col items-end gap-3", className), children: [
      /* @__PURE__ */ jsxs(
        "div",
        {
          className: cn(
            "flex flex-col border rounded-xl overflow-hidden bg-background shadow-xl",
            widgetOpen ? "flex" : "hidden"
          ),
          style: { height: widgetHeight, width: widgetWidth },
          children: [
            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 px-3 py-1.5 border-b bg-muted/40", children: [
              /* @__PURE__ */ jsx(Sparkles, { className: "h-3 w-3 text-muted-foreground" }),
              pageAIContext ? /* @__PURE__ */ jsx(
                Badge,
                {
                  variant: "secondary",
                  className: "text-xs",
                  "data-testid": "page-context-badge",
                  children: pageAIContext.routeName
                }
              ) : /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-medium", children: "AI Chat" }),
              /* @__PURE__ */ jsx("div", { className: "flex-1" }),
              /* @__PURE__ */ jsx(
                Button,
                {
                  variant: "ghost",
                  size: "icon",
                  className: "h-5 w-5",
                  onClick: () => {
                    onClear?.();
                    setWidgetResetKey((prev) => prev + 1);
                  },
                  "aria-label": "Clear chat",
                  title: "Clear chat",
                  children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5" })
                }
              ),
              /* @__PURE__ */ jsx(
                Button,
                {
                  variant: "ghost",
                  size: "icon",
                  className: "h-5 w-5",
                  onClick: () => setWidgetOpen(false),
                  "aria-label": "Close chat",
                  children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
                }
              )
            ] }),
            widgetEverOpened && /* @__PURE__ */ jsx(
              ChatInterface,
              {
                apiPath,
                id: conversationId,
                variant: "widget",
                initialMessages,
                onMessagesChange
              },
              `widget-${conversationId ?? "new"}-${widgetResetKey}`
            )
          ]
        }
      ),
      showTrigger && /* @__PURE__ */ jsx(
        Button,
        {
          size: "icon",
          className: "h-12 w-12 rounded-full shadow-lg",
          onClick: () => {
            setWidgetOpen((prev) => !prev);
            setWidgetEverOpened(true);
          },
          "aria-label": widgetOpen ? "Close chat" : "Open chat",
          "data-testid": "widget-trigger",
          children: widgetOpen ? /* @__PURE__ */ jsx(X, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(Sparkles, { className: "h-5 w-5" })
        }
      )
    ] });
  }
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: cn(
        "flex h-[calc(100vh-4rem)] w-full overflow-hidden",
        className
      ),
      "data-testid": "chat-layout",
      children: [
        showSidebar && /* @__PURE__ */ jsx(
          "div",
          {
            className: cn(
              "hidden md:flex transition-all duration-300 ease-in-out",
              sidebarOpen ? "w-72" : "w-0"
            ),
            children: sidebarOpen && /* @__PURE__ */ jsx(
              ChatSidebar,
              {
                currentConversationId: conversationId,
                onNewChat: handleNewChat,
                className: "w-72"
              }
            )
          }
        ),
        /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col min-w-0", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-2 border-b bg-background/95 backdrop-blur supports-backdrop-filter:bg-background/60", children: [
            showSidebar && /* @__PURE__ */ jsxs(Sheet, { open: mobileSidebarOpen, onOpenChange: setMobileSidebarOpen, children: [
              /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
                Button,
                {
                  variant: "ghost",
                  size: "icon",
                  className: "md:hidden",
                  "aria-label": "Open menu",
                  children: /* @__PURE__ */ jsx(Menu, { className: "h-5 w-5" })
                }
              ) }),
              /* @__PURE__ */ jsx(SheetContent, { side: "left", className: "p-0 w-72", children: /* @__PURE__ */ jsx(
                ChatSidebar,
                {
                  currentConversationId: conversationId,
                  onNewChat: () => {
                    handleNewChat();
                    setMobileSidebarOpen(false);
                  }
                }
              ) })
            ] }),
            showSidebar && /* @__PURE__ */ jsx(
              Button,
              {
                variant: "ghost",
                size: "icon",
                className: "hidden md:flex",
                onClick: () => setSidebarOpen(!sidebarOpen),
                "aria-label": sidebarOpen ? "Close sidebar" : "Open sidebar",
                children: sidebarOpen ? /* @__PURE__ */ jsx(PanelLeftClose, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(PanelLeft, { className: "h-5 w-5" })
              }
            ),
            /* @__PURE__ */ jsx("div", { className: "flex-1" }),
            pageAIContext && /* @__PURE__ */ jsxs(
              Badge,
              {
                variant: "secondary",
                className: "text-xs gap-1 mr-2",
                "data-testid": "page-context-badge",
                children: [
                  /* @__PURE__ */ jsx(Sparkles, { className: "h-3 w-3" }),
                  pageAIContext.routeName
                ]
              }
            ),
            onClear && /* @__PURE__ */ jsx(
              Button,
              {
                variant: "ghost",
                size: "icon",
                onClick: () => {
                  onClear();
                  setChatResetKey((prev) => prev + 1);
                },
                "aria-label": "Clear chat",
                title: "Clear chat",
                children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
              }
            )
          ] }),
          /* @__PURE__ */ jsx(
            ChatInterface,
            {
              apiPath,
              id: conversationId,
              variant: "full",
              initialMessages,
              onMessagesChange
            },
            `chat-${conversationId ?? "new"}-${chatResetKey}`
          )
        ] })
      ]
    }
  );
}

export { ChatLayout };
