🔥 Docs GraphQL Tabs – Remove spacing workaround

[isaaclombardssw]

Due to a Tina limitation, rich text fields can't be nested (meaning that re-usable templates don't have all the functionality of usual markdown).

This has impacted the implementation of a GraphQL Tab template, which can't natively have spaces at the beginning of a new line. This has been worked around to appear as if it can via Tina UI format and parse hooks, and a replacement in the component.

Once Tina allows nested rich text (currently under development) please make the following changes to remove the tech debt of the workaround.

• [ ] In the template 'GraphQLCodeBlock' in schema.tsx, remove the ui {...} object content on both fields and change the type to rich text.
• [ ] Limit the rich-text UI to text only via toolbar override.
• [ ] In components/ui remove the string replacement being used to set the <Prism> element value fields.

[neehhaa06]

Hello!! @isaaclombardssw :)

To remove the spacing workaround in the GraphQL Tabs implementation:

    Update schema.tsx:

        Change fields from 'string' to 'richText'.
        Remove any 'ui' object configurations.

       Configure Rich Text Editor:
        Set the editor to allow only text formatting.

    Refactor Components:
        Remove any string replacement code used to handle spacing or formatting.

[isaaclombardssw]

Hi @neehhaa06 – appreciate the help :)

Unfortunately it doesn't look like I can have a 'richText' type embed within the body which is also type 'richText'.

Looks like the TinaCMS project has something about this in the pipeline though https://github.com/tinacms/tinacms/issues/4571.