fix: use private helcimApiToken for all server-side Helcim API calls

app/components/SeriesPassPurchase.vue

@@ -21,12 +21,22 @@
 
     <!-- Content -->
     <div v-else-if="passInfo">
-      <!-- Series Pass Card -->
+      <!-- Already Registered State -->
+      <div v-if="passInfo.alreadyRegistered" class="dashed-box p-6">
+        <div class="section-label mb-2">Series Pass</div>
+        <p class="text-[--text]">You're registered for this series.</p>
+        <p v-if="passInfo.registration?.eventsIncluded !== undefined" class="text-[--text-dim] text-sm mt-1">
+          Registered for {{ passInfo.registration.eventsIncluded }} event{{ passInfo.registration.eventsIncluded !== 1 ? 's' : '' }} in this series.
+        </p>
+      </div>
+
+      <!-- Series Pass Card (only when ticket data is available) -->
       <EventSeriesTicketCard
+        v-else-if="passInfo.ticket"
         :ticket="passInfo.ticket"
         :availability="passInfo.availability"
         :available="passInfo.available"
-        :already-registered="passInfo.alreadyRegistered"
+        :already-registered="false"
         :is-member="passInfo.memberInfo?.isMember"
         :total-events="seriesInfo.totalEvents"
         :events="seriesEvents"
@@ -172,7 +182,7 @@ const props = defineProps({
 const emit = defineEmits(["purchase-success", "purchase-error"]);
 
 const toast = useToast();
-const { initializePayment, verifyPayment } = useHelcimPay();
+const { initializeTicketPayment, verifyPayment } = useHelcimPay();
 
 // State
 const loading = ref(true);
@@ -188,19 +198,29 @@ const form = ref({
 
 const isLoggedIn = computed(() => !!props.userEmail);
 
-// Fetch series pass info on mount
+// Fetch series pass info on mount, then re-fetch if userEmail becomes available (auth loads after mount)
 onMounted(async () => {
   await fetchPassInfo();
 });
 
+watch(() => props.userEmail, async (newEmail, oldEmail) => {
+  if (newEmail && !oldEmail) {
+    form.value.email = newEmail;
+    form.value.name = props.userName || form.value.name;
+    await fetchPassInfo();
+  }
+});
+
 const fetchPassInfo = async () => {
   loading.value = true;
   error.value = null;
 
   try {
-    const response = await $fetch(
-      `/api/series/${props.seriesId}/tickets/available`
-    );
+    const email = form.value.email || props.userEmail;
+    const url = email
+      ? `/api/series/${props.seriesId}/tickets/available?email=${encodeURIComponent(email)}`
+      : `/api/series/${props.seriesId}/tickets/available`;
+    const response = await $fetch(url);
 
     passInfo.value = response;
 
@@ -244,15 +264,11 @@ const handleSubmit = async () => {
       paymentProcessing.value = true;
 
       // Initialize Helcim payment for series pass
-      await initializePayment(
+      await initializeTicketPayment(
+        props.seriesId,
         form.value.email,
         passInfo.value.ticket.price,
-        passInfo.value.ticket.currency || "CAD",
-        {
-          type: "series_pass",
-          seriesId: props.seriesId,
-          seriesTitle: props.seriesInfo.title,
-        }
+        props.seriesInfo.title,
       );
 
       // Show Helcim modal and complete payment
@@ -267,15 +283,17 @@ const handleSubmit = async () => {
     }
 
     // Complete series pass purchase
+    const purchaseBody = {
+      name: form.value.name,
+      email: form.value.email,
+    };
+    if (transactionId) purchaseBody.paymentId = transactionId;
+
     const purchaseResponse = await $fetch(
       `/api/series/${props.seriesId}/tickets/purchase`,
       {
         method: "POST",
-        body: {
-          name: form.value.name,
-          email: form.value.email,
-          paymentId: transactionId,
-        },
+        body: purchaseBody,
       }
     );