Fix up the social media panel on profiles

[jmgasper]

Updated design:

Here are the updated designs for Default and Edit view:

https://www.figma.com/file/tuRk5OMWMtQr8T1LGsuugt/Profiles-2023-Rethink?type=design&node-id=1401%3A9310&mode=design&t=NnlgrhSzz3EZcm0f-1Connect your Figma account

Screenshot

Additional icons

Here are the icons for the 3 default social media links:

• 
• 
• 

[suppermancool]

@jmgasper I can not access figma link. Can you help to add dat.nguyen.supper@gmail.com ? thanks

[suppermancool]

@jmgasper I still can not access the Figma link. I finished this based on the provided screenshot

done in #924

[jmgasper]

@suppermancool - Some feedback here:

1.‘Please enter a URL’ error is immediately displayed on selecting the social site.

2. Can we remove the LinkedIn , Git and Instagram from the Type dropdown? as it is already displayed above.

3. The items from dropdown are getting added, only if the Additional link button is clicked, otherwise it is not getting saved. Can we change the name of the button to ‘Add link’ ? since it will be clear that user should click the button to get the item saved.
   At present, the ‘save’ button is not enabled if we just select a social site and add URL but if we also make some changes in already added entries, ‘Save’ button is getting enabled.

bandicam.2023-10-12.12-18-43-960.mp4

[suppermancool]

@jmgasper done in #925

[jmgasper]

@suppermancool - One more request from QA:

The below issues are resolved now but the first added entry is not moving to the bottom.

Design

Implementation