import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
import { useCallback, useContext, } from 'react';
import { useTranslation } from 'react-i18next';
import { Button } from 'antd';
import { FileAddOutlined, } from '@ant-design/icons';
import { ActionBarStyled, ButtonCSS, AdditionalSectionStyled } from '../../explorer.style';
import { useCommander } from '../../../../hooks';
import { addTemplate } from '../../../../commands/templates';
import { InspectedEntityContext } from '../../../../providers';
import { HotkeysBar } from '../../../../components';
export const ActionBar = () => {
    const { t } = useTranslation();
    const { dispatch } = useCommander();
    const { path: inspectedEntityPath, type } = useContext(InspectedEntityContext);
    const handleAdd = useCallback(() => {
        const pathToAdd = !inspectedEntityPath || type !== 'template'
            ? ['templates']
            : inspectedEntityPath.concat('children');
        dispatch(addTemplate(pathToAdd));
    }, [dispatch, inspectedEntityPath, type]);
    return (_jsxs(ActionBarStyled, { children: [_jsx(Button, { css: ButtonCSS, icon: _jsx(FileAddOutlined, {}), size: "small", onClick: handleAdd, title: t('explorer.templates.actionBar.addTemplate.button.title') }), _jsx(AdditionalSectionStyled, { children: _jsx(HotkeysBar, {}) })] }));
};
