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, FolderAddOutlined, } from '@ant-design/icons';
import { ActionBarStyled, ButtonCSS, AdditionalSectionStyled } from '../../explorer.style';
import { useCommander } from '../../../../hooks';
import { addActor, addScene } from '../../../../commands/scenes';
import { InspectedEntityContext } from '../../../../providers';
import { HotkeysBar } from '../../../../components';
import { FocusActionButton } from './components';
export const ActionBar = () => {
    const { t } = useTranslation();
    const { dispatch } = useCommander();
    const { path: inspectedEntityPath, type } = useContext(InspectedEntityContext);
    const handleAddActor = useCallback(() => {
        if (!inspectedEntityPath) {
            return;
        }
        const pathToAdd = inspectedEntityPath.concat(type === 'scene' ? 'actors' : 'children');
        dispatch(addActor(pathToAdd));
    }, [dispatch, inspectedEntityPath, type]);
    const handleAddScene = useCallback(() => {
        dispatch(addScene());
    }, [dispatch]);
    return (_jsxs(ActionBarStyled, { children: [_jsx(Button, { css: ButtonCSS, icon: _jsx(FileAddOutlined, {}), size: "small", onClick: handleAddActor, title: t('explorer.scenes.actionBar.addActor.button.title'), disabled: type !== 'actor' && type !== 'scene' }), _jsx(Button, { css: ButtonCSS, icon: _jsx(FolderAddOutlined, {}), size: "small", onClick: handleAddScene, title: t('explorer.scenes.actionBar.addScene.button.title') }), _jsx(AdditionalSectionStyled, { children: _jsx(HotkeysBar, {}) }), _jsx(AdditionalSectionStyled, { children: _jsx(FocusActionButton, { path: type === 'actor' ? inspectedEntityPath : undefined }) })] }));
};
