<template>
  <div class="grid min-h-screen place-items-center">
    <CardView
      v-for="(card, index) in cardStore.cards"
      :key="card.id"
      :card="card"
      :is-front="index === 0"
      :z="index"
    />
  </div>
</template>

<script setup lang="ts">
import CardView from "~/components/CardView.vue";
import { useCardStore } from "~/store/Card";

const route = useRoute();
const collection: string = route.query.collection as string;
const cardStore = useCardStore();

cardStore.fetchCardsByCollection(collection);
</script>
