feat: recreate shared page

+ improve security by not exposing author's email

inertia/components/dashboard/link/item/link_item.tsx

@@ -0,0 +1,70 @@
+import { Card, Group, Text } from '@mantine/core';
+import { AiFillStar } from 'react-icons/ai';
+import { ExternalLinkStyled } from '~/components/common/external_link_styled';
+import LinkFavicon from '~/components/dashboard/link/item/favicon/link_favicon';
+import LinkControls from '~/components/dashboard/link/item/link_controls';
+import type { LinkListProps } from '~/components/dashboard/link/list/link_list';
+import { Link, PublicLink } from '~/types/app';
+import styles from './link.module.css';
+
+interface LinkItemProps extends LinkListProps {
+	link: Link | PublicLink;
+}
+
+export function LinkItem({ link, hideMenu: hideMenu = false }: LinkItemProps) {
+	const { name, url, description } = link;
+	const showFavoriteIcon = !hideMenu && 'favorite' in link && link.favorite;
+	return (
+		<Card className={styles.linkWrapper} padding="sm" radius="sm" withBorder>
+			<Group className={styles.linkHeader} justify="center">
+				<LinkFavicon url={url} />
+				<ExternalLinkStyled href={url} style={{ flex: 1 }}>
+					<div className={styles.linkName}>
+						<Text lineClamp={1}>
+							{name} {showFavoriteIcon && <AiFillStar color="gold" />}
+						</Text>
+					</div>
+					<LinkItemURL url={url} />
+				</ExternalLinkStyled>
+				{!hideMenu && <LinkControls link={link} />}
+			</Group>
+			{description && (
+				<Text className={styles.linkDescription} c="dimmed" size="sm">
+					{description}
+				</Text>
+			)}
+		</Card>
+	);
+}
+
+function LinkItemURL({ url }: { url: Link['url'] }) {
+	try {
+		const { origin, pathname, search } = new URL(url);
+		let text = '';
+
+		if (pathname !== '/') {
+			text += pathname;
+		}
+
+		if (search !== '') {
+			if (text === '') {
+				text += '/';
+			}
+			text += search;
+		}
+
+		return (
+			<Text className={styles.linkUrl} c="gray" size="xs" lineClamp={1}>
+				{origin}
+				<span className={styles.linkUrlPathname}>{text}</span>
+			</Text>
+		);
+	} catch (error) {
+		console.error('error', error);
+		return (
+			<Text className={styles.linkUrl} c="gray" size="xs" lineClamp={1}>
+				{url}
+			</Text>
+		);
+	}
+}