plugin improvement – WordPress Gutenberg InnerBlocks renderAppender not displaying with template

I’m growing a small plugin that incorporates two blocks: one grid/container, that renders its contents in 3 equal width columns, and a grid/merchandise, that’s the little one of the grid. However the grid is meant to additionally enable core/picture blocks.

To indicate what I intention for I made a bit of sketch:

As a default format, when the grid is inserted first, I need 6 grid/merchandises to be displayed. By way of deleting gadgets and including and shifting pictures, admins ought to be capable to regulate the format to their liking.

However the issue I’m going through proper now, is that no button so as to add extra youngsters is displayed after I move a template to the InnerBlocks of the edit of the container. Even when I manually move a renderAppender prop. However within the official documentation each props are used within the instance part about renderAppender, so this could work collectively, proper?

That is my code:

edit.js

import { __ } from "@wordpress/i18n";
import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";

import "./gridEdit.scss";

export default operate Edit() {
    const ALLOWED_BLOCKS = ["grid/item, core/image"];
    const MY_TEMPLATE = [
        ["grid/item"],
        ["grid/item"],
        ["grid/item"],
        ["grid/item"],
        ["grid/item"],
        ["grid/item"],
    ];

    return (
        <div {...useBlockProps()}>
            <InnerBlocks
                allowedBlocks={ALLOWED_BLOCKS}
                template={MY_TEMPLATE}
                renderAppender={() => <InnerBlocks.DefaultBlockAppender />} //makes no distinction
            />
        </div>
    );
}

What am I lacking?

Let me know, if you happen to want extra code snippets.
Thanks upfront 🙂