Migrate to twenty-ui - navigation/link (#7837)

This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7535](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7535).

 --- 

### Description.  

Migrate link components to `twenty-ui` \
\
Fixes #7535

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>

packages/twenty-ui/src/navigation/link/components/SocialLink.tsx

@@ -0,0 +1,24 @@
+import * as React from 'react';
+
+import { getDisplayValueByUrlType } from '@ui/utilities';
+import { RoundedLink } from './RoundedLink';
+
+export enum LinkType {
+  Url = 'url',
+  LinkedIn = 'linkedin',
+  Twitter = 'twitter',
+}
+
+type SocialLinkProps = {
+  label: string;
+  href: string;
+  type: LinkType;
+  onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+};
+
+export const SocialLink = ({ label, href, onClick, type }: SocialLinkProps) => {
+  const displayValue =
+    getDisplayValueByUrlType({ type: type, href: href }) ?? label;
+
+  return <RoundedLink href={href} onClick={onClick} label={displayValue} />;
+};