added analytics for nav and individual steps in hub managed form

Author: tobihagemann

layouts/hub-managed/single.html

@@ -18,7 +18,7 @@ <h1 class="font-h1 mb-8">{{ .Title }}</h1>
                   <li>
                     <!-- Complete Step -->
                     <template x-if="index < feedbackData.currentStep">
-                      <a href="#" class="group" @click.prevent="feedbackData.currentStep = index">
+                      <a href="#" class="group" :class="`plausible-event-name=hub-managed-nav-step-${index + 1}`" @click.prevent="feedbackData.currentStep = index" :data-umami-event="`hub-managed-nav-step-${index + 1}`">
                         <span class="flex items-center gap-3">
                           <div class="relative flex w-5 h-5 shrink-0 items-center justify-center">
                             <svg class="w-full h-full text-primary group-hover:text-secondary" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
@@ -69,7 +69,7 @@ <h2 class="font-h2 mb-6">
                 <input type="email" id="email" class="block input-box w-full mb-8" placeholder="{{ i18n "hub_managed_step_1_email_placeholder" }}" x-init="$el.focus()" x-model="submitData.email" @blur="$el.classList.add('show-invalid')" required>
                 <div class="mt-auto">
                   <p :class="{'hidden': !feedbackData.errorMessage}" class="text-sm text-red-600 mb-2" x-text="feedbackData.errorMessage"></p>
-                  <button :disabled="feedbackData.inProgress" @click.prevent="hubManaged.validateEmail()" class="btn btn-primary w-full md:w-64">
+                  <button :disabled="feedbackData.inProgress" @click.prevent="hubManaged.validateEmail()" class="btn btn-primary w-full md:w-64 plausible-event-name=hub-managed-step-1" data-umami-event="hub-managed-step-1">
                     <i :class="{'fa-chevron-right': !feedbackData.inProgress, 'fa-spinner fa-spin': feedbackData.inProgress}" class="fas fa-fw" aria-hidden="true"></i>
                     {{ i18n "hub_managed_steps_next" }}
                   </button>
@@ -101,7 +101,7 @@ <h2 class="font-h2 mb-6">
                 </div>
                 <div class="mt-auto">
                   <p :class="{'hidden': !feedbackData.errorMessage}" class="text-sm text-red-600 mb-2" x-text="feedbackData.errorMessage"></p>
-                  <button :disabled="feedbackData.inProgress" @click.prevent="hubManaged.validateSubdomainAndTeam()" class="btn btn-primary w-full md:w-64">
+                  <button :disabled="feedbackData.inProgress" @click.prevent="hubManaged.validateSubdomainAndTeam()" class="btn btn-primary w-full md:w-64 plausible-event-name=hub-managed-step-2" data-umami-event="hub-managed-step-2">
                     <i :class="{'fa-chevron-right': !feedbackData.inProgress, 'fa-spinner fa-spin': feedbackData.inProgress}" class="fas fa-fw" aria-hidden="true"></i>
                     {{ i18n "hub_managed_steps_next" }}
                   </button>
@@ -126,7 +126,7 @@ <h2 class="font-h2 mb-6">
                 <input type="number" id="quantity" min="1" max="10000" step="1" class="block input-box w-full mb-8" placeholder="{{ i18n "hub_managed_step_3_quantity_placeholder" }}" x-init="$el.focus()" x-model="submitData.quantity" @blur="$el.classList.add('show-invalid')" required>
                 <div class="mt-auto">
                   <p :class="{'hidden': !feedbackData.errorMessage}" class="text-sm text-red-600 mb-2" x-text="feedbackData.errorMessage"></p>
-                  <button :disabled="feedbackData.inProgress" @click.prevent="submitData.quantity > 0 && submitData.quantity < 3 ? lowQuantityModalIsOpen = true : hubManaged.validateQuantity()" class="btn btn-primary w-full md:w-64">
+                  <button :disabled="feedbackData.inProgress" @click.prevent="submitData.quantity > 0 && submitData.quantity < 3 ? lowQuantityModalIsOpen = true : hubManaged.validateQuantity()" class="btn btn-primary w-full md:w-64 plausible-event-name=hub-managed-step-3" data-umami-event="hub-managed-step-3">
                     <i :class="{'fa-chevron-right': !feedbackData.inProgress, 'fa-spinner fa-spin': feedbackData.inProgress}" class="fas fa-fw" aria-hidden="true"></i>
                     {{ i18n "hub_managed_steps_next" }}
                   </button>