reverted back from vue typescript to javascript to fix bad performance...

resources/js/Layouts/BELayout.vue

@@ -1,15 +1,12 @@
 <template>
-    <n-config-provider preflight-style-disabled>
-        <LoginLayout class="w-3/5">
-            <MainNav />
-            <slot></slot>
+    <LoginLayout class="w-3/5">
+        <MainNav />
+        <slot></slot>
 
-        </LoginLayout>
-    </n-config-provider>
+    </LoginLayout>
 </template>
 
-<script lang="ts" setup>
-    import { NConfigProvider } from 'naive-ui'
+<script setup>
     import LoginLayout from '@/layouts/LoginLayout.vue'
     import MainNav from '@/components/MainNav.vue'
 

resources/js/Layouts/LoginLayout.vue

@@ -6,7 +6,7 @@
     </main>
 </template>
 
-<script setup lang="ts">
+<script setup>
 
 defineProps(['class'])
 

resources/js/components/FlashMessages.vue

@@ -1,6 +1,6 @@
 <template>
 </template>
-<script setup lang="ts">
+<script setup>
     import { useMessage } from 'naive-ui'
     import { onUpdated, onMounted } from 'vue'
 
@@ -15,13 +15,13 @@
         displayNewMessages(props.messages)
     })
 
-    function displayNewMessages(messages: any) {
+    function displayNewMessages(messages) {
 
-        let output: Array<Object> = []
+        let output = []
 
         output = flattenObject(removeValidationErrors(messages))
 
-        output?.forEach((item: any) => {
+        output?.forEach((item) => {
             for (let key in item) {
                 switch (key){
                     case 'error':
@@ -52,24 +52,24 @@
         })
     }   
 
-    function removeValidationErrors(input: any) {
+    function removeValidationErrors(input) {
 
         if(input === null || !input.hasOwnProperty("errors")) return input
     
-        const { errors: _, ...output } = (input as any)
+        const { errors: _, ...output } = (input)
         return output
     }
 
-    function flattenObject(input: Object) {
+    function flattenObject(input) {
         if (input === null) return input
 
-        return Object.values(input).map((value: any) => Object.entries(value)).flat().reduce((acc: Array<Object>, [key, value]) => {
+        return Object.values(input).map((value) => Object.entries(value)).flat().reduce((acc, [key, value]) => {
             acc.push({[key]: value});
             return acc;
         }, []);
     }
 
-    function translateError(errorMsg: string) {
+    function translateError(errorMsg) {
         switch(errorMsg.split(":")[0]) {
             case 'E_INVALID_AUTH_PASSWORD':
                 return "Falsches Passwort eingegeben."

resources/js/components/MainNav.vue

@@ -9,14 +9,10 @@
     </div>
 </template>
 
-<script lang="ts" setup>
-    import type { Ref, Component } from 'vue'
-    import type { MenuOption } from 'naive-ui'
-    import type { User } from '../types/User'
-
+<script setup>
+    import { NIcon } from 'naive-ui'
     import { Link, usePage } from '@inertiajs/vue3'
     import { h, ref } from 'vue';
-    import { NIcon, NMenu } from 'naive-ui'
     import {
         GroupsFilled as Users,
         EventNoteFilled as Events,
@@ -25,10 +21,10 @@
         PersonRound as Profile,
     } from '@vicons/material'
 
-    const activeKey: Ref<string> = ref((usePage().props.request as any)?.url)
-    const user: User = usePage().props.user as User
+    const activeKey= ref(usePage().props.request?.url)
+    const user = usePage().props.user
     
-    const menuOptions: MenuOption[] = []
+    const menuOptions = []
 
     menuOptions.push({
         label: () =>
@@ -89,7 +85,7 @@
 
     
 
-    function renderIcon(icon: Component) {
+    function renderIcon(icon) {
         return () => h(NIcon, null, { default: () => h(icon) })
 
     }

resources/js/pages/Events/Index.vue

@@ -9,18 +9,15 @@
     </div>
 </template>
 
-<script setup lang="ts">
+<script setup>
 import BELayout from '@/layouts/BELayout.vue'
 import FlashMessages from '@/components/FlashMessages.vue'
-import { NMessageProvider } from 'naive-ui'
 
 defineOptions({
     layout: BELayout
 })
 
-const props = defineProps({
-    flashMessages: Object
-})
+const props = defineProps(['flashMessages'])
 
 </script>
 

resources/js/pages/Home.vue

@@ -12,16 +12,12 @@
     </div>
 </template>
 
-<script setup lang="ts">
+<script setup>
 import { ref } from 'vue'
 import FlashMessages from '@/components/FlashMessages.vue'
-import { NMessageProvider } from 'naive-ui'
 
-const props = defineProps({
-    test: String,
-    flashMessages: Object
-})
+const props = defineProps(['test', 'flashMessages'])
 
-const helloWorld = ref<String>("helloWorld")
+const helloWorld = ref("helloWorld")
 
 </script>

resources/js/pages/Login.vue

@@ -45,10 +45,8 @@
     </n-form>
 </template>
 
-<script setup lang="ts">
-    import type { FormInst } from 'naive-ui'
+<script setup>
     import { ref } from 'vue'
-    import { NMessageProvider, NInput, NForm, NFormItem } from 'naive-ui'
     import { router } from '@inertiajs/vue3'
     import LoginLayout from '@/layouts/LoginLayout.vue'
     import FlashMessages from '@/components/FlashMessages.vue'
@@ -61,7 +59,7 @@
         password: '',
     })
 
-    const formRef = ref<FormInst | null>(null)
+    const formRef = ref(null)
 
     const rules = ref({
         username: {
@@ -77,7 +75,7 @@
     })
 
     function onClickLogin(){
-        formRef.value?.validate((errors: any) => {
+        formRef.value?.validate((errors) => {
             if(!errors) router.post('login', form.value)
         })
     }

resources/js/pages/Users/Edit.vue

@@ -2,5 +2,5 @@
 
 </template>
 
-<script setup lang="ts">
+<script setup>
 </script>

resources/js/pages/Users/Index.vue

@@ -11,16 +11,12 @@
    />
 </template>
 
-<script setup lang="ts">
-
-import type { User } from '../../types/User'
-import type { DataTableColumns } from 'naive-ui'
-import type { VNode } from 'vue'
+<script setup>
 
 import { h } from 'vue'
 import BELayout from '@/layouts/BELayout.vue'
 import FlashMessages from '@/components/FlashMessages.vue'
-import { NIcon, NButton, NDataTable, NMessageProvider } from 'naive-ui'
+import { NIcon, NButton } from 'naive-ui'
 
 import {
    AdminPanelSettingsFilled as Admin,
@@ -30,12 +26,9 @@ import {
 
 defineOptions({ layout: BELayout })
 
-const props = defineProps<{
-   users?: User[],
-   flashMessages?: Object
-}>()
+const props = defineProps(['users', 'flashMessages'])
 
-const columns: DataTableColumns<User> = [
+const columns = [
    {
       title: "Admin",
       key: "is_admin",
@@ -58,7 +51,7 @@ const columns: DataTableColumns<User> = [
       key: "actions",
       className: "space-x-4",
       render(row) {
-         let arr: VNode[] = []
+         let arr = []
          arr[0] = h(
             NButton,
             { 
@@ -84,11 +77,11 @@ const columns: DataTableColumns<User> = [
    }
 ]
 
-function clickEdit(id: Number){
+function clickEdit(id){
    console.log("Edit clicked: "+id)
 }
 
-function clickDelete(id: Number){
+function clickDelete(id){
    console.log("Delete clicked: "+id)
 }
 

resources/js/pages/Users/Show.vue

@@ -2,9 +2,8 @@
 
 </template>
 
-<script lang="ts" setup>
+<script setup>
 import BELayout from '@/layouts/BELayout.vue'
-//import FlashMessages from '@/components/FlashMessages.vue'
 
 defineOptions({ layout: BELayout })