Initial frontend draft

frontend/app/Components/Libraries/LibraryCard.tsx

@@ -0,0 +1,28 @@
+import { Card } from "react-bootstrap";
+import { useNavigate } from "react-router";
+import type Library from "~/Models/Library";
+
+interface Props {
+  library: Library;
+}
+
+const LibraryCard = ({ library }: Props) => {
+  const navigate = useNavigate();
+
+  function handleClick() {
+    navigate(`/Library/${library.id}`);
+  }
+
+  return (
+    <Card onClick={handleClick}>
+      <Card.Header>
+        <Card.Img />
+      </Card.Header>
+      <Card.Body>
+        <Card.Title>{library.name}</Card.Title>
+      </Card.Body>
+    </Card>
+  );
+}
+
+export default LibraryCard;