feat: add Block Editor integration

[neatbyte-vnobis]

Changes

Add Block Editor page integration

How Has This Been Tested?

Manual

Documentation

None

[Pavel910]

Add a message saying that there are no block categories, and a link to "Create a new category", like we have on the Pages view:

Add some padding to create block dialog, same as in the pages view. Feel free to use identical styles that are present in the Pages view, and render category title and a slug underneath:

Change the blockCategory property to category, the block prefix is redundant:

In Page Builder blocks list, it would be nice if categories could have icons and descriptions. For that we need to expand the Block Categories module to have an icon and a description. There already is an Icon Picker component, see here: packages/app-headless-cms/src/admin/views/contentModelGroups/IconPicker.tsx. You can just C/P the component, and we'll worry about reusability later. For a visual example, see http://localhost:3001/cms/content-model-groups?new=true

For blockCategories, which you load and generate plugins in the Editor.tsx, you really don't need to complicate things with those plugins; you can simply have a Recoil Atom for that. It will be a lot easier to use that data anywhere you need, especially if you create a useBlockCategories hook.

Regarding the dotted element outline on the block preview img, don't worry about that for now. It's not related to element highlight, that's just how we styled elements in the editor. it's not vital at this point so don't bother with that.

[neatbyte-vnobis]

@SvenAlHamad Please confirm part about "categories could have icons and descriptions" it requires API changes (2 new fields), so we need to extend scope for these changes. (or we can create an "improvement" task about it)

[SvenAlHamad]

Hey @neatbyte-vnobis happy for your to invest the extra time to add the two fields. Please just confirm the estimate for this so I can update the milestone on upwork.