blocks-react-renderer icon indicating copy to clipboard operation
blocks-react-renderer copied to clipboard

[bug]: The code function isn't called.

Open monolithed opened this issue 1 year ago • 1 comments

What version of @strapi/blocks-react-renderer are you using?

npm, node, react, strapi-* - the latest versions

What's Wrong?

The code below is likely working, but Strapi returns the data in a different format. The API returns the Code block inside a Paragraph, and the function code is never called.

https://github.com/strapi/blocks-react-renderer/blob/032e256085e0e243f7935b90de23ba4c9aaa20d7/tests/BlocksRenderer.test.tsx#L417

 <BlocksRenderer
          content={[
            {
              type: 'code',
              children: [
                {
                  type: 'text',
                  text: 'const a = 1;',
                },
                {
                  type: 'link',
                  url: 'https://test.com',
                  children: [{ type: 'text', text: 'const b = 2;', bold: true }],
                },
              ],
            },
          ]}
</>

Below, I have attached a screenshot of the server's response:

Screenshot 2024-11-20 at 13 33 05

Here is my workaround:

            <BlocksRenderer content={children}
                            blocks={{
                                paragraph: ({children}) => {
                                    return (
                                        <p>
                                            {
                                                React.Children.map(children, (item) => {
                                                    const {props: {code, text}} = item;

                                                    if (code) {
                                                        return <span className={styles.highlight}>{text}</span>;
                                                    }
                                                    return item;
                                                })
                                            }
                                        </p>
                                    )
                                },

To Reproduce

Open DevTools...

Expected Behaviour

The code function should be called.

monolithed avatar Nov 20 '24 06:11 monolithed

Also, I'd like to point out that in the current implementation, ther're no types for the children property.

Screenshot 2024-11-20 at 19 20 10

monolithed avatar Nov 20 '24 12:11 monolithed