Component Integration

[thanasis457]

Description

Providers have access to components such as Galleries, Directories, Text, etc that they can choose to add in their page.

The components are initialized in the admin page during the "Content" step of the Provider creation and are displayed on the Map after a user clicks on a Provider.

1. Right now, in the admin page, the components are initialized locally and their "state" is saved on a useState variable that is inside the component. Lift this state up so that the admin page can read it and upload it to Firebase along with the rest of the Provider's information (such as tags, hours, etc). In short, push to Firebase the component information of the "Content" step in the Provider creation flow.

2. On the map, any components shown have dummy data. After you complete the first part of the ticket, make the provider page on the Map show only the components that the provider has initialized and pass the actual Firebase data (not some dummy data).

As it had been mentioned at #294, the schema of the object you save on a provider's entry in Firebase should look like this:

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

I leave it up to you how you want each a component's schema to look like but it could be something like this:

{
    "type": "/* component type eg. progress bar, text, directory etc */",
    "data": "/* Data for the component */"
}

Should you make any changes to the schema, make sure to document them in your PR.