import { Button } from '@wix/design-system';
import React, { useEffect } from 'react';
import { withoutDefaults } from '@wix/bex-core';
import { observer } from 'mobx-react-lite';
import { AdjustSmall, TableChartSmall } from '@wix/wix-ui-icons-common';
import { CustomColumnsPanelEntry } from './CustomColumnsPanelEntry';
import { cairoFiltersPanelUsed } from '@wix/bex-core/bi';
import { ResponsiveButton } from '../ResponsiveButton/ResponsiveButton';
import { useSchemaContext } from '../../providers/SchemaContext';
export function _CustomColumnsCTAButton({ state, onColumnClick, dragAndDrop, }) {
    const { container: { translate: t, experiments }, toolbar: { responsive }, } = state;
    const analyticsButtonDiscoverability = experiments?.get('specs.analytics.CustomColumnsWithLabelAndNewIcon');
    useEffect(() => {
        CustomColumnsPanelEntry.CustomColumnsDragAndDrop = dragAndDrop;
        state.panels.registerSidePanel('customColumns', CustomColumnsPanelEntry);
    }, []);
    useEffect(() => {
        if (state.customColumnsState) {
            state.customColumnsState.onColumnClick = onColumnClick;
        }
    }, [onColumnClick, state.customColumnsStateInitialized]);
    const schemaCtx = useSchemaContext();
    const isSchema = !!schemaCtx?.schema;
    const isEditable = !!state.collectionDataExtension || isSchema;
    const text = t(isEditable
        ? 'cairo.table.manage-fields.button.cta'
        : 'cairo.table.custom-columns.button.cta');
    const props = {
        size: 'small',
        priority: 'secondary',
        dataHook: 'custom-columns-button',
        onClick: () => {
            const isOpened = state.panels.toggleSidePanel('customColumns');
            state.reportBi(withoutDefaults(cairoFiltersPanelUsed)({
                isOpened,
                feature: 'Custom Columns',
                origin: 'Custom Columns CTA',
            }));
        },
    };
    const getButton = () => {
        if (analyticsButtonDiscoverability === 'b' ||
            analyticsButtonDiscoverability === 'c') {
            return (React.createElement(Button, { ...props, prefixIcon: analyticsButtonDiscoverability === 'b' ? (React.createElement(AdjustSmall, null)) : (React.createElement(TableChartSmall, null)) }, text));
        }
        return (React.createElement(ResponsiveButton, { state: responsive.actions, icon: React.createElement(AdjustSmall, null), ...props }, text));
    };
    return getButton();
}
export const CustomColumnsCTAButton = observer(_CustomColumnsCTAButton);
//# sourceMappingURL=CustomColumnsCTAButton.js.map