0351d front end linting (#377)

* feat: disable custom script for  trial users

* after lint fix

* frontend linting

---------

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

client/pages/forms/[slug]/show/index.vue

@@ -1,7 +1,7 @@
 <script setup>
 definePageMeta({
-  redirect: to => {
-    return { name: 'forms-slug-show-submissions'}
-  }
+  redirect: () => {
+    return { name: "forms-slug-show-submissions" }
+  },
 })
 </script>

client/pages/forms/[slug]/show/integrations/index.vue

@@ -9,76 +9,110 @@
         Read, update and create data with dozens of 3rd-party integrations
       </div>
 
-      <div v-if="integrationsLoading" class="my-6">
-        <Loader class="h-6 w-6 mx-auto"/>
+      <div
+        v-if="integrationsLoading"
+        class="my-6"
+      >
+        <Loader class="h-6 w-6 mx-auto" />
       </div>
-      <div v-else-if="formIntegrationsList.length" class="my-6">
-          <IntegrationCard v-for="(row) in formIntegrationsList" :key="row.id" :integration="row" :form="form"/>
+      <div
+        v-else-if="formIntegrationsList.length"
+        class="my-6"
+      >
+        <IntegrationCard
+          v-for="row in formIntegrationsList"
+          :key="row.id"
+          :integration="row"
+          :form="form"
+        />
       </div>
-      <div class="text-gray-500 border shadow rounded-md p-5 mt-4" v-else>
+      <div
+        v-else
+        class="text-gray-500 border shadow rounded-md p-5 mt-4"
+      >
         No integration yet form this form.
       </div>
 
-
       <h1 class="font-semibold mt-8 text-xl">
         Add a new integration
       </h1>
-      <div v-for="(section, sectionName) in sectionsList" :key="sectionName" class="mb-8">
+      <div
+        v-for="(section, sectionName) in sectionsList"
+        :key="sectionName"
+        class="mb-8"
+      >
         <h3 class="text-gray-500">
           {{ sectionName }}
         </h3>
         <div class="flex flex-wrap mt-2 gap-4">
-          <IntegrationListOption v-for="(sectionItem, sectionItemKey) in section"
-                                 @select="openIntegrationModal"
-                                 :key="sectionItemKey" :integration="sectionItem"/>
+          <IntegrationListOption
+            v-for="(sectionItem, sectionItemKey) in section"
+            :key="sectionItemKey"
+            :integration="sectionItem"
+            @select="openIntegrationModal"
+          />
         </div>
       </div>
-      <IntegrationModal v-if="form && selectedIntegrationKey && selectedIntegration" :form="form"
-                        :integration="selectedIntegration" :integrationKey="selectedIntegrationKey"
-                        :show="showIntegrationModal"
-                        @close="closeIntegrationModal"/>
+      <IntegrationModal
+        v-if="form && selectedIntegrationKey && selectedIntegration"
+        :form="form"
+        :integration="selectedIntegration"
+        :integration-key="selectedIntegrationKey"
+        :show="showIntegrationModal"
+        @close="closeIntegrationModal"
+      />
     </div>
   </div>
 </template>
 
 <script setup>
-import {computed} from 'vue'
-import IntegrationModal from '~/components/open/integrations/components/IntegrationModal.vue'
+import { computed } from "vue"
+import IntegrationModal from "~/components/open/integrations/components/IntegrationModal.vue"
 
 const props = defineProps({
-  form: {type: Object, required: true}
+  form: { type: Object, required: true },
 })
 
 definePageMeta({
-  middleware: "auth"
+  middleware: "auth",
 })
 useOpnSeoMeta({
-  title: (props.form) ? 'Form Integrations - ' + props.form.title : 'Form Integrations'
+  title: props.form
+    ? "Form Integrations - " + props.form.title
+    : "Form Integrations",
 })
 
 const alert = useAlert()
-const crisp = useCrisp()
-const route = useRoute()
 
 const formIntegrationsStore = useFormIntegrationsStore()
 const integrationsLoading = computed(() => formIntegrationsStore.loading)
-const integrations = computed(() => formIntegrationsStore.availableIntegrations)
-const sectionsList = computed(() => formIntegrationsStore.integrationsBySection)
-const formIntegrationsList = computed(() => formIntegrationsStore.getAllByFormId(props.form.id))
+const integrations = computed(
+  () => formIntegrationsStore.availableIntegrations,
+)
+const sectionsList = computed(
+  () => formIntegrationsStore.integrationsBySection,
+)
+const formIntegrationsList = computed(() =>
+  formIntegrationsStore.getAllByFormId(props.form.id),
+)
 
-let showIntegrationModal = ref(false)
-let selectedIntegrationKey = ref(null)
-let selectedIntegration = ref(null)
+const showIntegrationModal = ref(false)
+const selectedIntegrationKey = ref(null)
+const selectedIntegration = ref(null)
 
 onMounted(() => {
   formIntegrationsStore.fetchFormIntegrations(props.form.id)
 })
 
 const openIntegrationModal = (itemKey) => {
-  if (!itemKey || !integrations.value.has(itemKey)) return alert.error('Integration not found')
-  if (integrations.value.get(itemKey).coming_soon) return alert.warning('This integration is not available yet')
+  if (!itemKey || !integrations.value.has(itemKey))
+    return alert.error("Integration not found")
+  if (integrations.value.get(itemKey).coming_soon)
+    return alert.warning("This integration is not available yet")
   selectedIntegrationKey.value = itemKey
-  selectedIntegration.value = integrations.value.get(selectedIntegrationKey.value)
+  selectedIntegration.value = integrations.value.get(
+    selectedIntegrationKey.value,
+  )
   showIntegrationModal.value = true
 }
 const closeIntegrationModal = () => {

client/pages/forms/[slug]/show/share.vue

@@ -1,57 +1,81 @@
 <template>
   <div class="w-full md:w-4/5 lg:w-3/5 md:mx-auto md:max-w-4xl p-4">
     <div class="mb-20">
-
       <div class="mb-6 pb-6 border-b w-full flex flex-col sm:flex-row gap-2">
-        <regenerate-form-link class="sm:w-1/2 flex" :form="props.form"/>
+        <regenerate-form-link
+          class="sm:w-1/2 flex"
+          :form="props.form"
+        />
 
-        <url-form-prefill class="sm:w-1/2" :form="props.form" :extra-query-param="shareUrlForQueryParams"/>
+        <url-form-prefill
+          class="sm:w-1/2"
+          :form="props.form"
+          :extra-query-param="shareUrlForQueryParams"
+        />
 
-        <embed-form-as-popup-modal class="sm:w-1/2 flex" :form="props.form"/>
+        <embed-form-as-popup-modal
+          class="sm:w-1/2 flex"
+          :form="props.form"
+        />
       </div>
 
-      <share-link class="mt-4" :form="props.form" :extra-query-param="shareUrlForQueryParams"/>
+      <share-link
+        class="mt-4"
+        :form="props.form"
+        :extra-query-param="shareUrlForQueryParams"
+      />
 
-      <embed-code class="mt-6" :form="props.form" :extra-query-param="shareUrlForQueryParams"/>
+      <embed-code
+        class="mt-6"
+        :form="props.form"
+        :extra-query-param="shareUrlForQueryParams"
+      />
 
-      <form-qr-code class="mt-6" :form="props.form" :extra-query-param="shareUrlForQueryParams"/>
-
-      <advanced-form-url-settings :form="props.form" v-model="shareFormConfig"/>
+      <form-qr-code
+        class="mt-6"
+        :form="props.form"
+        :extra-query-param="shareUrlForQueryParams"
+      />
 
+      <advanced-form-url-settings
+        v-model="shareFormConfig"
+        :form="props.form"
+      />
     </div>
   </div>
 </template>
 
 <script setup>
-import ShareLink from '~/components/pages/forms/show/ShareLink.vue'
-import EmbedCode from '~/components/pages/forms/show/EmbedCode.vue'
-import FormQrCode from '~/components/pages/forms/show/FormQrCode.vue'
-import UrlFormPrefill from '~/components/pages/forms/show/UrlFormPrefill.vue'
-import RegenerateFormLink from '~/components/pages/forms/show/RegenerateFormLink.vue'
-import AdvancedFormUrlSettings from '~/components/open/forms/components/AdvancedFormUrlSettings.vue'
-import EmbedFormAsPopupModal from '~/components/pages/forms/show/EmbedFormAsPopupModal.vue'
+import ShareLink from "~/components/pages/forms/show/ShareLink.vue"
+import EmbedCode from "~/components/pages/forms/show/EmbedCode.vue"
+import FormQrCode from "~/components/pages/forms/show/FormQrCode.vue"
+import UrlFormPrefill from "~/components/pages/forms/show/UrlFormPrefill.vue"
+import RegenerateFormLink from "~/components/pages/forms/show/RegenerateFormLink.vue"
+import AdvancedFormUrlSettings from "~/components/open/forms/components/AdvancedFormUrlSettings.vue"
+import EmbedFormAsPopupModal from "~/components/pages/forms/show/EmbedFormAsPopupModal.vue"
 
 const props = defineProps({
-  form: {type: Object, required: true}
+  form: { type: Object, required: true },
 })
 
 definePageMeta({
-  middleware: "auth"
+  middleware: "auth",
 })
 useOpnSeoMeta({
-  title: (props.form) ? 'Share Form - ' + props.form.title : 'Share Form'
+  title: props.form ? "Share Form - " + props.form.title : "Share Form",
 })
 
 const shareFormConfig = ref({
   hide_title: false,
-  auto_submit: false
+  auto_submit: false,
 })
 
 const shareUrlForQueryParams = computed(() => {
-  let queryStr = ''
+  let queryStr = ""
   for (const [key, value] of Object.entries(shareFormConfig.value)) {
-    if (value && value !== 'false' && value !== false) {
-      queryStr += '&' + encodeURIComponent(key) + "=" + encodeURIComponent(value)
+    if (value && value !== "false" && value !== false) {
+      queryStr +=
+        "&" + encodeURIComponent(key) + "=" + encodeURIComponent(value)
     }
   }
   return queryStr.slice(1)

client/pages/forms/[slug]/show/stats.vue

@@ -3,21 +3,21 @@
     <h3 class="font-semibold mt-4 text-xl">
       Form Analytics (last 30 days)
     </h3>
-    <form-stats :form="form"/>
+    <form-stats :form="form" />
   </div>
 </template>
 
 <script setup>
-import FormStats from '~/components/open/forms/components/FormStats.vue'
+import FormStats from "~/components/open/forms/components/FormStats.vue"
 
 const props = defineProps({
-  form: {type: Object, required: true}
+  form: { type: Object, required: true },
 })
 
 definePageMeta({
-  middleware: "auth"
+  middleware: "auth",
 })
 useOpnSeoMeta({
-  title: (props.form) ? 'Form Analytics - ' + props.form.title : 'Form Analytics'
+  title: props.form ? "Form Analytics - " + props.form.title : "Form Analytics",
 })
 </script>

client/pages/forms/[slug]/show/submissions.vue

@@ -1,23 +1,24 @@
 <template>
-  <form-submissions/>
+  <form-submissions />
 </template>
 
 <script setup>
-import FormSubmissions from '~/components/open/forms/components/FormSubmissions.vue'
+import FormSubmissions from "~/components/open/forms/components/FormSubmissions.vue"
 
 const props = defineProps({
-  form: {type: Object, required: true}
+  form: { type: Object, required: true },
 })
 
 definePageMeta({
-  middleware: "auth"
+  middleware: "auth",
 })
 useOpnSeoMeta({
-  title: (props.form) ? 'Form Submissions - ' + props.form.title : 'Form Submissions'
+  title: props.form
+    ? "Form Submissions - " + props.form.title
+    : "Form Submissions",
 })
 
 onBeforeRouteLeave(() => {
   useRecordsStore().resetState()
 })
-
 </script>