feat(SW-245): Delete credit card

components/Profile/CreditCardList/CreditCardList.module.css

@@ -0,0 +1,4 @@
+.cardContainer {
+  display: grid;
+  gap: var(--Spacing-x1);
+}

components/Profile/CreditCardList/index.tsx

@@ -0,0 +1,31 @@
+"use client"
+
+import React from "react"
+
+import { trpc } from "@/lib/trpc/client"
+
+import CreditCardRow from "../CreditCardRow"
+
+import styles from "./CreditCardList.module.css"
+
+import type { CreditCard } from "@/types/user"
+
+export default function CreditCardList({
+  initialData,
+}: {
+  initialData?: CreditCard[] | null
+}) {
+  const creditCards = trpc.user.creditCards.useQuery(undefined, { initialData })
+
+  if (!creditCards.data || !creditCards.data.length) {
+    return null
+  }
+
+  return (
+    <div className={styles.cardContainer}>
+      {creditCards.data.map((card) => (
+        <CreditCardRow key={card.id} card={card} />
+      ))}
+    </div>
+  )
+}