diff --git a/src/components/Topbar.vue b/src/components/Topbar.vue
index 33c511072..81f8dd2f0 100644
--- a/src/components/Topbar.vue
+++ b/src/components/Topbar.vue
@@ -46,7 +46,7 @@ import { useSession } from '@/core/composables/useSession';
 import UserPanel from '@/components/UserPanel.vue';
 
 const session = useSession();
-const { getUser } = useState();
-const user = getUser;
+const state = useState();
+const user = state.getUser();
 const token = session.getToken();
 </script>
diff --git a/src/components/UserPanel.vue b/src/components/UserPanel.vue
index b89226c56..dc96cde79 100644
--- a/src/components/UserPanel.vue
+++ b/src/components/UserPanel.vue
@@ -62,7 +62,7 @@ const darkMode = computed({
     },
 });
 
-const user = state.getUser;
+const user = state.getUser();
 const token = session.getToken();
 
 onMounted(() => {
diff --git a/src/core/composables/useState.ts b/src/core/composables/useState.ts
index 13c46e4a1..d6c7a86d6 100644
--- a/src/core/composables/useState.ts
+++ b/src/core/composables/useState.ts
@@ -6,15 +6,32 @@ interface User {
     nickname: string;
 }
 
+interface useState {
+    getUser: () => ComputedRef<User>;
+    setUser: (data: User) => void;
+    getRoles: () => ComputedRef<string[]>;
+    setRoles: (data: string[]) => void;
+}
+
 const user: Ref<User> = ref({
     id: 0,
     username: '',
     nickname: '',
 });
 
-const roles = ref([]);
+const roles: Ref<string[]> = ref([]);
+
+export function useState(): useState {
+    function getUser(): ComputedRef<User> {
+        return computed(() => {
+            return {
+                id: user.value.id,
+                username: user.value.username,
+                nickname: user.value.nickname,
+            };
+        });
+    }
 
-export function useState() {
     function setUser(data: User): void {
         user.value = {
             id: data.id,
@@ -23,21 +40,20 @@ export function useState() {
         };
     }
 
-    const getUser: ComputedRef<User> = computed(() => {
-        return {
-            id: user.value.id,
-            username: user.value.username,
-            nickname: user.value.nickname,
-        };
-    });
+    function getRoles(): ComputedRef<string[]> {
+        return computed(() => {
+            return roles.value;
+        });
+    }
 
-    /*   function setRoles(data) {
+    function setRoles(data: string[]): void {
         roles.value = data;
-    } */
+    }
 
     return {
-        roles,
         getUser,
         setUser,
+        getRoles,
+        setRoles,
     };
 }