feat(MED-100): update cart checkout flow and views

app/home/(user)/_components/cart/cart-items.tsx

@@ -0,0 +1,54 @@
+import { StoreCart, StoreCartLineItem } from "@medusajs/types"
+import { Trans } from '@kit/ui/trans';
+import CartItem from "./cart-item";
+import {
+  Table,
+  TableBody,
+  TableHead,
+  TableRow,
+  TableHeader,
+} from '@kit/ui/table';
+
+export default function CartItems({ cart, items, productColumnLabelKey }: {
+  cart: StoreCart;
+  items: StoreCartLineItem[];
+  productColumnLabelKey: string;
+}) {
+  if (!items || items.length === 0) {
+    return null;
+  }
+
+  return (
+    <Table className="rounded-lg border border-separate">
+      <TableHeader className="text-ui-fg-subtle txt-medium-plus">
+        <TableRow className="">
+          <TableHead className="px-6">
+            <Trans i18nKey={productColumnLabelKey} />
+          </TableHead>
+          <TableHead className="px-6">
+            <Trans i18nKey="cart:table.quantity" />
+          </TableHead>
+          <TableHead className="px-6 min-w-[100px]">
+            <Trans i18nKey="cart:table.price" />
+          </TableHead>
+          <TableHead className="px-6 min-w-[100px]">
+            <Trans i18nKey="cart:table.total" />
+          </TableHead>
+          <TableHead className="px-6">
+          </TableHead>
+        </TableRow>
+      </TableHeader>
+      <TableBody>
+        {items
+          .sort((a, b) => (a.created_at ?? "") > (b.created_at ?? "") ? -1 : 1)
+          .map((item) => (
+            <CartItem
+              key={item.id}
+              item={item}
+              currencyCode={cart.currency_code}
+            />
+          ))}
+      </TableBody>
+    </Table>
+  )
+}