import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { LockIcon, ThunderboltIcon, Panel, Space, Button } from '@cube-dev/ui-kit';
import { CubeProvider } from '@cubejs-client/react';
import { Card } from 'antd';
import { useLayoutEffect } from 'react';
import { useHistory } from 'react-router-dom';
import styled from 'styled-components';
import { CubeLoader } from '../../atoms';
import { useCloud } from '../../cloud';
import { useAppContext, useCubejsApi, useSecurityContext } from '../../hooks';
import { RollupDesignerContext, useRollupDesignerContext, } from '../../rollup-designer';
import { ChartRendererStateProvider } from '../QueryTabs/ChartRendererStateProvider';
import { QueryTabs } from '../QueryTabs/QueryTabs';
import { QueryBuilder, } from '../../QueryBuilderV2/index';
import Vizard from '../Vizard/Vizard';
import { PreAggregationStatus } from './components/index';
const StyledCard = styled(Card) `
  border-radius: 0;
  border-bottom: 1px;
  min-height: 100%;
  background: var(--layout-body-background);

  & .ant-card-body {
    padding: 0;
  }
`;
function RequestStatusComponent({ isAggregated, external, extDbType, preAggregationType, }) {
    return (_jsx(Space, { direction: "vertical", gap: "0", placeItems: "end", margin: "-1x 0", children: _jsx(PreAggregationStatus, { preAggregationType: preAggregationType, isAggregated: isAggregated, external: external, extDbType: extDbType }) }));
}
export function QueryBuilderContainer(props) {
    const { apiUrl } = useAppContext();
    const { currentToken, token: securityContextToken, setIsModalOpen, } = useSecurityContext();
    useLayoutEffect(() => {
        if (apiUrl && currentToken) {
            window['__cubejsPlayground'] = {
                ...window['__cubejsPlayground'],
                apiUrl,
                token: currentToken,
            };
        }
    }, [apiUrl, currentToken]);
    const cubejsApi = useCubejsApi(apiUrl, currentToken);
    if (!cubejsApi) {
        return _jsx(CubeLoader, {});
    }
    return (_jsx(CubeProvider, { cubeApi: cubejsApi, children: _jsx(RollupDesignerContext, { apiUrl: apiUrl, children: _jsx(ChartRendererStateProvider, { children: _jsx(StyledCard, { bordered: false, children: _jsx(QueryTabsRenderer, { apiUrl: apiUrl, token: currentToken, securityContextToken: securityContextToken, extra: props.extra, schemaVersion: props.schemaVersion, onSchemaChange: props.onSchemaChange, onQueryChange: props.onQueryChange, onTabChange: props.onTabChange, onSecurityContextModalOpen: () => setIsModalOpen(true) }) }) }) }) }));
}
function QueryTabsRenderer({ apiUrl, token, onQueryChange, securityContextToken, onSecurityContextModalOpen, ...props }) {
    const { location } = useHistory();
    const { setQuery, toggleModal, isLoading } = useRollupDesignerContext();
    const { isAddRollupButtonVisible } = useCloud();
    const params = new URLSearchParams(location.search);
    const query = JSON.parse(params.get('query') || 'null');
    return (_jsx(QueryTabs, { query: query, sidebar: _jsxs(Space, { direction: "horizontal", children: [_jsxs(Button, { "data-testid": "security-context-btn", isLoading: isLoading, icon: _jsx(LockIcon, {}), size: "small", type: securityContextToken ? 'primary' : 'secondary', onPress: onSecurityContextModalOpen, children: [securityContextToken ? 'Edit' : 'Add', " Security Context"] }), isAddRollupButtonVisible == null || isAddRollupButtonVisible ? (_jsx(Button, { "data-testid": "rd-btn", isLoading: isLoading, icon: _jsx(ThunderboltIcon, {}), size: "small", onPress: () => toggleModal(), children: "Add Rollup to Data Model" })) : null] }), onTabChange: (tab) => {
            props.onTabChange?.(tab);
            setQuery(tab.query);
        }, children: ({ id, query, chartType }, saveTab) => (_jsx(Panel, { height: "(100vh - 12.5x) (100vh - 12.5x)", fill: "#white", children: _jsx(QueryBuilder, { apiUrl: apiUrl, apiToken: token, defaultQuery: query, defaultChartType: chartType, schemaVersion: props.schemaVersion, extra: props.extra ?? null, RequestStatusComponent: RequestStatusComponent, VizardComponent: Vizard, onSchemaChange: props.onSchemaChange, onQueryChange: (data) => {
                    saveTab(data);
                    onQueryChange?.(data);
                } }) }, id)) }));
}
//# sourceMappingURL=QueryBuilderContainer.js.map