Feature flags (#543)

* Re-organize a bit controllers

* Added the featureflagcontroller

* Implement feature flags in the front-end

* Clean env files

* Clean console.log messages

* Fix feature flag test

client/components/open/forms/components/FormEditorErrorHandler.vue

@@ -1,27 +1,37 @@
 <template>
-    <ErrorBoundary @on-error="onFormEditorError">
-  
-      <template #error="{ error, clearError }">
-        <div class="flex-grow w-full flex items-center justify-center flex-col gap-4">
-          <h1 class="text-blue-800 text-2xl font-medium">Oops! Something went wrong.</h1>
-          <p class="text-gray-500 max-w-lg text-center">It looks like your last action caused an issue on our side. We
-            apologize for
-            the
-            inconvenience.</p>
-          <div class="flex gap-2 mt-4">
-            <UButton icon="i-material-symbols-undo" @click="clearEditorError(error, clearError)">Go back one step
-            </UButton>
-            <UButton variant="outline" icon="i-heroicons-chat-bubble-left-right-16-solid"
-                     @click="onErrorContact(error)">
-              Report this error
-            </UButton>
-          </div>
+  <ErrorBoundary @on-error="onFormEditorError">
+    <template #error="{ error, clearError }">
+      <div class="flex-grow w-full flex items-center justify-center flex-col gap-4">
+        <h1 class="text-blue-800 text-2xl font-medium">
+          Oops! Something went wrong.
+        </h1>
+        <p class="text-gray-500 max-w-lg text-center">
+          It looks like your last action caused an issue on our side. We
+          apologize for
+          the
+          inconvenience.
+        </p>
+        <div class="flex gap-2 mt-4">
+          <UButton
+            icon="i-material-symbols-undo"
+            @click="clearEditorError(error, clearError)"
+          >
+            Go back one step
+          </UButton>
+          <UButton
+            variant="outline"
+            icon="i-heroicons-chat-bubble-left-right-16-solid"
+            @click="onErrorContact(error)"
+          >
+            Report this error
+          </UButton>
         </div>
-      </template>
+      </div>
+    </template>
   
-      <slot />
-    </ErrorBoundary>
-  </template>
+    <slot />
+  </ErrorBoundary>
+</template>
   
   <script setup>
   import { computed } from 'vue'
@@ -51,7 +61,6 @@
     }
   }
   const onErrorContact = (error) => {
-    console.log('Contacting via crisp for an error', error)
     crisp.pauseChatBot()
     let errorReport = 'Hi there, I have a technical issue with the form editor.'
     if (form.value.slug) {

client/components/open/forms/components/form-components/FormCustomSeo.vue

@@ -25,7 +25,7 @@
       on other sites (Open Graph).
     </p>
     <select-input
-      v-if="customDomainAllowed"
+      v-if="useFeatureFlag('custom_domains')"
       v-model="form.custom_domain"
       :clearable="true"
       :disabled="customDomainOptions.length <= 0"
@@ -98,9 +98,6 @@ export default {
           })
         : []
     },
-    customDomainAllowed() {
-      return useRuntimeConfig().public.customDomainsEnabled
-    },
   },
   watch: {},
   mounted() {

client/components/open/forms/components/form-components/FormCustomization.vue

@@ -53,23 +53,25 @@
       label="Form Theme"
     />
 
-    <label class="text-gray-700 font-medium text-sm">Font Style</label>
-    <v-button
-      color="white"
-      class="w-full mb-4"
-      size="small"
-      @click="showGoogleFontPicker = true"
-    >
-      <span :style="{ 'font-family': (form.font_family?form.font_family+' !important':null) }">
-        {{ form.font_family || 'Default' }}
-      </span>
-    </v-button>
-    <GoogleFontPicker
-      :show="showGoogleFontPicker"
-      :font="form.font_family || null"
-      @close="showGoogleFontPicker=false"
-      @apply="onApplyFont"
-    />
+    <template v-if="useFeatureFlag('services.google.fonts')">
+      <label class="text-gray-700 font-medium text-sm">Font Style</label>
+      <v-button
+        color="white"
+        class="w-full mb-4"
+        size="small"
+        @click="showGoogleFontPicker = true"
+      >
+        <span :style="{ 'font-family': (form.font_family?form.font_family+' !important':null) }">
+          {{ form.font_family || 'Default' }}
+        </span>
+      </v-button>
+      <GoogleFontPicker
+        :show="showGoogleFontPicker"
+        :font="form.font_family || null"
+        @close="showGoogleFontPicker=false"
+        @apply="onApplyFont"
+      />
+    </template>
 
     <div class="flex space-x-4 justify-stretch">
       <select-input
@@ -216,7 +218,7 @@ const user = computed(() => authStore.user)
 const workspace = computed(() => workspacesStore.getCurrent)
 
 const isPro = computed(() => {
-  if (!useRuntimeConfig().public.paidPlansEnabled) return true
+  if (!useFeatureFlag('billing.enabled')) return true
   if (!user.value || !workspace.value) return false
   return workspace.value.is_pro
 })
@@ -237,7 +239,6 @@ const onChangeNoBranding = (val) => {
     subscriptionModalStore.openModal()
     setTimeout(() => {
       form.value.no_branding = false
-      console.log("form.value.no_branding", form.value.no_branding)
     }, 300)
   } 
 }