Vue3: migrating from vuex to Pinia (#249)

* Vue3: migrating from vuex to Pinia

* toggle input fixes

* update configureCompat

---------

Co-authored-by: Forms Dev <chirag+new@notionforms.io>

resources/js/components/pages/welcome/AiFeature.vue

@@ -87,16 +87,19 @@
 </template>
 
 <script>
-import {mapGetters} from 'vuex'
+import { computed } from 'vue'
+import { useAuthStore } from '../../../stores/auth'
 
 export default {
-    props: {},
-    data: () => ({}),
-    computed: {
-      ...mapGetters({
-        authenticated: 'auth/check'
-      }),
-    },
-    methods: {}
+  setup () {
+    const authStore = useAuthStore()
+    return {
+      authenticated : computed(() => authStore.check)
+    }
+  },
+  props: {},
+  data: () => ({}),
+  computed: {},
+  methods: {}
 }
 </script>

resources/js/components/pages/welcome/TemplatesSlider.vue

@@ -36,19 +36,23 @@
 </template>
 
 <script>
-import store from '~/store'
-import { mapGetters, mapState } from 'vuex'
+import { computed } from 'vue'
+import { useTemplatesStore } from '../../../stores/templates'
 import SingleTemplate from '../templates/SingleTemplate.vue'
 
 export default {
   components: { SingleTemplate },
   props: { },
+  setup () {
+    const templatesStore = useTemplatesStore()
+    return {
+      templatesStore,
+      templates : computed(() => templatesStore.content)
+    }
+  },
   data: () => ({}),
 
   computed: {
-    ...mapState({
-      templates: state => state['open/templates'].content
-    }),
     sliderTemplates () {
       return this.templates.slice(0, 20)
     }
@@ -66,7 +70,7 @@ export default {
   },
 
   mounted() {
-    store.dispatch('open/templates/loadAll', { limit: 20 })
+    this.templatesStore.loadAll({ limit: 20 })
   },
 
   methods: {