{extends file="admin-layout.tpl"}

{block name="no-return-functions"}
    {$admin_current_location = 'TheliaBlocks'}
{/block}

{block name="page-title"}{intl l='Thelia blocks'}{/block}

{block name="check-resource"}admin.content{/block}
{block name="check-access"}view{/block}

{block name="main-content"}
    <div id="thelia-blocks-root-edit" class="thelia-blocks-ui"></div>
{/block}


{block name="javascript-last-call"}

        {hook name="thelia.blocks.plugins"}

        <script type="module">

            let groupId = "{$groupId|default:null}";
            let itemId = "{$itemId|default:null}";
            let itemType = "{$itemType|default:null}";
            let CONTAINER_ID = "thelia-blocks-root-edit";
            let CONTAINER = document.getElementById(CONTAINER_ID);

            {literal}
                ReactDOM.render(React.createElement(TheliaBlocks.BlocksEditor, {
                    apiUrl: window.THELIA_BLOCKS_API_ROOT,
                    containerId: CONTAINER_ID,
                    groupId,
                    itemId,
                    itemType,
                    isEditing: true,
                    locales: window.THELIA_BLOCKS_LOCALES,
                    urlPrefix: window.THELIA_BLOCKS_URL_PREFIX,
                }, null), CONTAINER)
            {/literal}
        </script>
{/block}

