Description

The setting to add/update a map pin (at /settings/map) does it's thing but more context could be given to the user so they understand how their info will be displayed on the map.

Design requirements and description by @dalibormrska

The design proposal for now is this. First of all, the user would have the style of the pin based on the type of profile they have.

The preview of the card would be done just as it would be on the real map. The pin would be always in the open state and draggable. On click we would want to move the pin to the bottom of the map container so that both the pin and the card would be visible. I thought this would save space, layout decisions and introducing another element into the pool. In this way we would just utilise the existing elements.

Make sure that the height of the map is enough for the card of a space profile to show.

Build suggestion

While the necessary user data will need to be passed through to MapWithPin on SettingsPageMapPin, hopefully MapPin (packages/components/src/MapWithPin/MapPin.tsx) is the only component that needs much work. And what needs implementing is probably very close to what's used on Clusters (src/pages/Maps/Content/MapView/Cluster.tsx) with the Popup component.

As MapPin is in the component library already (which is what we want), moving Popup (src/pages/Maps/Content/MapView/Popup.tsx) to the component library too would be the best path forward.