import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from "react";
import { SimpleTabs } from "../ui/SimpleTabs";
import { LatestFeedback } from "./LatestFeedback";
import { Comments } from "./Comments";
export function getFeedbackPanels(isMobile) {
    return isMobile
        ? [
            {
                name: "comments",
                title: "Comments & Suggestions",
                content: _jsx(CommentsAndFeedback, {}),
                initialSize: 100,
            },
        ]
        : [
            {
                name: "comments",
                title: "Comments & Suggestions",
                content: _jsx(Comments, {}),
                initialSize: 65,
                noOverflow: true,
            },
            {
                name: "latest-feedback",
                title: "Latest Feedback",
                content: _jsx(LatestFeedback, {}),
                initialSize: 35,
            },
        ];
}
export function CommentsAndFeedback() {
    const [activeTab, setActiveTab] = useState(0);
    const tabs = [
        {
            id: "comments",
            label: "Comments",
            content: (_jsx("div", { className: "h-full overflow-y-auto", children: _jsx(Comments, {}) })),
            testId: "comments-tab",
        },
        {
            id: "latest-feedback",
            label: "Latest Feedback",
            content: (_jsx("div", { className: "h-full overflow-y-auto", children: _jsx(LatestFeedback, {}) })),
            testId: "latest-feedback-tab",
        },
    ];
    return (_jsx("div", { className: "flex h-full flex-col", children: _jsx(SimpleTabs, { tabs: tabs, activeTab: activeTab, setActiveTab: setActiveTab, className: "border-b border-gray-200 px-2" }) }));
}
//# sourceMappingURL=CommentsAndFeedback.js.map