import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { memo, useMemo } from 'react';
import { useLocation } from 'react-router-dom';
import { useAtomValue } from 'jotai';
import { Tabs, useTabsState } from '../Tabs/index.js';
import { ResponseDetails } from './ResponseDetails.js';
import { makeDeepLink } from '../../services/index.js';
import { Row, StyledTitle } from './styled.js';
import { LinkToField } from '../common/LinkToField.js';
import { pathIncludesLink } from '../../utils/index.js';
import { ExpandAllButton } from '../ExpandAllButton/index.js';
import { useTranslate } from '../../hooks/index.js';
import { getActiveMediaType } from '../../models/index.js';
import { activeMimeNameAtom } from '../../jotai/app.js';
import { styled } from '../../styled-components.js';
export const OperationResponseList = memo(({ responses, renderTitle, operationId, operationPointer, activeResponseTab, onTabChange, callbackId, onPanelToggle, }) => {
    const location = useLocation();
    const translate = useTranslate();
    const activeMimeName = useAtomValue(activeMimeNameAtom);
    const tabs = responses.map(({ code }) => ({ key: code, title: code }));
    const defaultTab = tabs.find(({ key }) => key === activeResponseTab ||
        (pathIncludesLink(location, operationId) && pathIncludesLink(location, `c=${key}`)));
    const { activeTab, handleTabChange } = useTabsState({
        tabs,
        defaultTab: defaultTab?.key,
        onChange: onTabChange,
    });
    const tab = tabs.find((t) => t.key === (activeResponseTab || activeTab));
    const response = responses.find((r) => r.code === tab?.key);
    const showExpandAllButton = useMemo(() => {
        if (!response?.content)
            return false;
        const { schema } = getActiveMediaType(response?.content, activeMimeName) || {};
        return schema?.fields?.some(({ schema: fieldSchema }) => !fieldSchema.isPrimitive && !fieldSchema.isCircular);
    }, [activeMimeName, response?.content]);
    if (!tab)
        return null;
    return (_jsxs(_Fragment, { children: [_jsxs(TitleWrap, { children: [renderTitle?.(tab) || (_jsxs(StyledTitle, { children: [_jsx(LinkToField, { to: makeDeepLink(operationId, `response&c=${tab.key}`) }), translate('openapi.responses', 'Responses')] })), _jsx(Tabs, { tabs: tabs, activeTab: tab, onChange: handleTabChange }), showExpandAllButton && (_jsx(ExpandAllButton, { type: "response", operationPointer: operationPointer, onPanelToggle: onPanelToggle }))] }), response ? (_jsx("div", { children: _jsx(ResponseDetails, { response: response, operationId: operationId, callbackId: callbackId }) }, response.code)) : null] }));
});
const TitleWrap = styled(Row) `
  flex-wrap: wrap;
  gap: var(--spacing-unit);
`;
//# sourceMappingURL=OperationResponseList.js.map