overhauled client member management system

ui/src/stores/user.ts

@@ -1,15 +1,18 @@
 import { ref, computed, watch } from 'vue'
 import { defineStore } from 'pinia'
 import { useRoute, useRouter } from 'vue-router'
+import { myData } from '@shared/types/member'
+
 
 const POLL_INTERVAL = 10_000
 
 export const useUserStore = defineStore('user', () => {
-    const user = ref(null)
-    const roles = computed(() => new Set(user.value?.roleData?.map(r => r.name) ?? []));
+    const user = ref<myData>(null)
+    const roles = computed(() => new Set(user.value?.roles?.map(r => r.name) ?? []));
     const loaded = ref(false);
     const state = computed<string | undefined>(() => user.value?.state || undefined);
     const isLoggedIn = computed(() => user.value !== null)
+    const displayName = computed(() => user.value?.member.displayName || user.value?.member.member_name)
 
     async function loadUser() {
         //@ts-ignore
@@ -19,7 +22,6 @@ export const useUserStore = defineStore('user', () => {
 
         if (res.ok) {
             const data = await res.json();
-            console.log(data);
             user.value = data;
         }
 
@@ -87,5 +89,5 @@ export const useUserStore = defineStore('user', () => {
         }
     })
 
-    return { user, isLoggedIn, roles, loadUser, loaded, hasAnyRole, hasRole, state }
+    return { user, displayName, isLoggedIn, roles, loadUser, loaded, hasAnyRole, hasRole, state }
 })