From 33a14333aae163ca81b2adf18c3392e1fd7466e8 Mon Sep 17 00:00:00 2001
From: Nathan Kluth <nlkluth@gmail.com>
Date: Tue, 7 Nov 2023 13:02:35 -0700
Subject: [PATCH] card

---
 packages/nextjs/components/Card.tsx | 41 +++++++++++++++++++++++++++++
 packages/shared-ui/index.ts         |  1 +
 2 files changed, 42 insertions(+)
 create mode 100644 packages/nextjs/components/Card.tsx

diff --git a/packages/nextjs/components/Card.tsx b/packages/nextjs/components/Card.tsx
new file mode 100644
index 0000000..241dac1
--- /dev/null
+++ b/packages/nextjs/components/Card.tsx
@@ -0,0 +1,41 @@
+import * as React from "react";
+import { SanityImageSource } from "@sanity/image-url/lib/types/types";
+import Link, { LinkProps } from "next/link";
+import { Image } from "./Image";
+import { Card as BaseCard } from "shared-ui";
+
+export interface CardProps {
+  title: string;
+  price?: number;
+  subTitle?: string;
+  to: LinkProps["href"];
+  className?: string;
+  imageProps: {
+    src: SanityImageSource;
+    alt: string;
+    containerClassName?: string;
+  };
+}
+
+export const Card = ({
+  to,
+  subTitle,
+  title,
+  price,
+  imageProps: { containerClassName, ...imageProps },
+  className = "",
+}: CardProps) => {
+  return (
+    <BaseCard
+      title={title}
+      subTitle={subTitle}
+      to={to.toString()}
+      price={price}
+      className={className}
+      imageContainerClass={containerClassName}
+      Link={Link}
+    >
+      <Image layout="fill" src={imageProps.src} alt={imageProps.alt} objectFit="cover" objectPosition="center" />
+    </BaseCard>
+  );
+};
diff --git a/packages/shared-ui/index.ts b/packages/shared-ui/index.ts
index 9df6467..0a964d7 100644
--- a/packages/shared-ui/index.ts
+++ b/packages/shared-ui/index.ts
@@ -14,6 +14,7 @@ export * from "./components/Price";
 export * from "./components/QuantityInput";
 export * from './components/ProductSort';
 export * from './components/Pagination';
+export * from './components/Card';
 
 export * from "./components/sanity";
 export * from "./components/cart";