Form editor v2 (#579)

* Form editor v2

* fix template test

* setFormDefaults when save

* fix form cleaning dark mode

* improvements on open sidebar

* UI polish

* Fix change type button

---------

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

client/components/global/Settings/SettingsSection.vue

@@ -0,0 +1,40 @@
+<template>
+  <div
+    v-show="isActive"
+    class="settings-section"
+  >
+    <h3 class="text-xl font-medium mb-1">
+      {{ name }}
+    </h3>
+    <slot />
+  </div>
+</template>
+  
+<script setup>
+import { inject, computed, onMounted, onBeforeUnmount } from 'vue'
+
+const props = defineProps({
+  name: {
+    type: String,
+    required: true
+  },
+  icon: {
+    type: String,
+    required: true
+  }
+})
+
+const activeSection = inject('activeSection', ref(''))
+const registerSection = inject('registerSection', () => {})
+const unregisterSection = inject('unregisterSection', () => {})
+
+const isActive = computed(() => activeSection.value === props.name)
+
+onMounted(() => {
+  registerSection(props.name, props.icon)
+})
+
+onBeforeUnmount(() => {
+  unregisterSection(props.name)
+})
+</script>