Provider Custom Content

[thanasis457]

Description

Currently, the registering page for a new provider has the following sections:

We want to add a new section named "Content". This will be a section where the Provider can add custom content like charts, galleries of photos, calendars, etc.

It should look something like this:

("Information" should actually be "Content". Look at Figma for more details)

The "Content" section has sub-sections of each own. The user can add as many sub-sections as needed. Each subsection is essentially a collapsible component on a provider's page. Within each sub-section (eg. sub-section "Demo" from the screenshot above) can have many components but they will all be part of the same collapsible component.

Your task is to add the new "Content" section, make the sub-sections UI and necessary backend changes to support this, and make everything look and function like in the Figma.
For the backend, make the necessary changes so that this new information (section names, and orders, components etc) are stored along with the rest of the information for a provider.

When pushing the information for a provider to Firestore the you should include a new field names "Content" with the following schema:

{
    "Content": {
        "sections": [
            {
                "name": "Section 1",
                "components": [ /* Empty array which will later contain component descriptions */]
            },
            {
                "name": "Section 2",
                "components": []
            }
        ]
    }
}

You should not focus on what the content inside sections should be. These are components for later sprint. Ie. The things in the red box will be made later:

Do create some sample empty collapsible components but do not populate them with anything pie charts or text boxes like in the example.

The Figma has some inconsistencies so feel free to slack me (@thanasis457) if anything does not make sense.