feat: recreate no link component

inertia/mantine/components/dashboard/link/no_link.module.css

@@ -0,0 +1,27 @@
+.noCollection {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  animation: fadeIn 0.3s both;
+}
+
+.text {
+  min-width: 0;
+  width: 100%;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+@keyframes fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}

inertia/mantine/components/dashboard/link/no_link.tsx

@@ -0,0 +1,37 @@
+import { Link } from '@inertiajs/react';
+import { route } from '@izzyjs/route/client';
+import { Anchor, Box, Text } from '@mantine/core';
+import { useTranslation } from 'react-i18next';
+import useActiveCollection from '~/hooks/use_active_collection';
+import { appendCollectionId } from '~/lib/navigation';
+import styles from './no_link.module.css';
+
+export function NoLink() {
+	const { t } = useTranslation('common');
+	const { activeCollection } = useActiveCollection();
+	return (
+		<Box className={styles.noCollection} p="xl">
+			<Text
+				className={styles.text}
+				dangerouslySetInnerHTML={{
+					__html: t(
+						'home:no-link',
+						{ name: activeCollection?.name ?? '' } as any,
+						{
+							interpolation: { escapeValue: false },
+						}
+					),
+				}}
+			/>
+			<Anchor
+				component={Link}
+				href={appendCollectionId(
+					route('link.create-form').path,
+					activeCollection?.id
+				)}
+			>
+				{t('link.create')}
+			</Anchor>
+		</Box>
+	);
+}