import { readStep } from '@data-wrangling-components/core';
import { useThematic } from '@thematic/react';
import merge from 'lodash-es/merge.js';
import { useCallback, useEffect, useMemo, useState } from 'react';
import { useCreateTableName, useFormattedColumnArg } from '../hooks/index.js';
export function useHandleSaveClick(step, output, onTransformRequested) {
    return useCallback(()=>{
        if (step) {
            onTransformRequested?.(step, output);
        }
    }, [
        onTransformRequested,
        step,
        output
    ]);
}
export function useInternalTableStep(step, _lastOutput, graph) {
    const [internal, setInternal] = useState();
    const formattedColumnArg = useFormattedColumnArg();
    useEffect(()=>{
        if (step) {
            setInternal(step);
        }
    }, [
        step,
        setInternal
    ]);
    const createNewTableName = useCreateTableName(graph);
    const handleVerbChange = useCallback((verb)=>{
        const id = createNewTableName(verb);
        const _step = readStep({
            verb,
            id
        });
        _step.args = formattedColumnArg(_step.args);
        setInternal(_step);
    }, [
        setInternal,
        formattedColumnArg,
        createNewTableName
    ]);
    return {
        internal,
        handleVerbChange,
        setInternal
    };
}
/**
 * Defaults modal to have a slight border that is adapted for theme
 * @param styles
 * @returns
 */ export function useModalStyles(styles, includeGuidance = false) {
    const theme = useThematic();
    return useMemo(()=>{
        return merge({
            root: {
                border: `1px solid ${theme.application().faint().hex()}`,
                width: includeGuidance ? 900 : 520,
                maxHeight: 580
            }
        }, styles);
    }, [
        theme,
        styles,
        includeGuidance
    ]);
}
export function useStepOutputHandling(graph, step) {
    const [output, setOutput] = useState();
    const stepOutput = graph.outputDefinitions.find((t)=>t.node === step?.id);
    useEffect(function useExistingOutputName() {
        if (stepOutput?.name) {
            setOutput(stepOutput.name);
        }
    }, [
        stepOutput
    ]);
    return useMemo(()=>({
            output,
            onOutputChanged: setOutput
        }), [
        output,
        setOutput
    ]);
}
