Billing flow redirect (#713)

* Billing flow redirect

* fix checkout url

* Refactor checkout and subscription flow

- Improve checkout URL generation with ref unwrapping
- Enhance user data handling in subscription modal
- Remove deprecated CheckoutDetailsModal component
- Update form field and register form styling
- Add more robust user data update mechanism

* Refactor checkout and subscription flow

- Improve checkout URL generation with ref unwrapping
- Enhance user data handling in subscription modal
- Remove deprecated CheckoutDetailsModal component
- Update form field and register form styling
- Add more robust user data update mechanism

* Fix accessibility and checkout URL generation

- Add proper label for terms and conditions checkbox in RegisterForm
- Refactor checkout URL generation in SubscriptionModal using computed refs
- Improve form input handling and reactivity

---------

Co-authored-by: Julien Nahum <julien@nahum.net>

client/composables/useCheckoutUrl.js

@@ -0,0 +1,42 @@
+import { computed, unref } from 'vue'
+
+export const useCheckoutUrl = (name, email, plan, yearly, currency) => {
+  return computed(() => {
+    // Unwrap refs if they are passed
+    const nameValue = unref(name)
+    const emailValue = unref(email)
+    const planValue = unref(plan)
+    const yearlyValue = unref(yearly)
+    const currencyValue = unref(currency)
+
+    const params = {
+      plan: planValue,
+      yearly: yearlyValue.toString(),
+      currency: currencyValue,
+      name: nameValue,
+      email: emailValue
+    }
+
+    // Get trial duration if exists - only in client side
+    if (import.meta.client) {
+      const urlParams = new URLSearchParams(window.location.search)
+      const trialDuration = urlParams.get('trial_duration')
+      if (trialDuration) {
+        params.trial_duration = trialDuration
+        // Keep the amplitude event
+        useAmplitude().logEvent('extended_trial_used', { duration: trialDuration })
+      }
+    }
+
+    // Filter out empty params
+    const filteredParams = Object.fromEntries(
+      // eslint-disable-next-line no-unused-vars
+      Object.entries(params).filter(([_, value]) => value !== null && value !== undefined && value !== '')
+    )
+
+    return {
+      name: 'redirect-checkout',
+      query: filteredParams
+    }
+  })
+}