init

src/components/list-link.tsx

@@ -0,0 +1,27 @@
+import { NavLink, Text } from "@mantine/core";
+import { CaretRightIcon, Icon } from "@phosphor-icons/react";
+import { Link, useNavigate } from "@tanstack/react-router";
+
+interface ListLinkProps {
+  label: string;
+  to: string;
+  Icon: Icon;
+}
+
+const ListLink = ({ label, to, Icon }: ListLinkProps) => {
+  const navigate = useNavigate();
+
+  return (
+    <NavLink
+      w='100%'
+      p='md'
+      component={'button'}
+      onClick={() => navigate({ to })}
+      label={<Text fw={500} size='md'>{label}</Text>}
+      leftSection={<Icon weight='bold' size={20} />}
+      rightSection={<CaretRightIcon size={20} />}
+    />
+  )
+}
+
+export default ListLink;