✨ New user management

app/components/artifact/Artifact.ts

@@ -1,4 +1,5 @@
 import {MavenApi} from "~/utils/Api";
+import {type EnhancedResponse, useUserStore} from "~/components/users/UserStore";
 
 export class Artifact
 {
@@ -17,10 +18,11 @@ export class Artifact
 
     static get(onSuccess: (artifacts: Artifact[]) => void)
     {
-        MavenApi.create().get<Artifact[]>("/artifacts")
+        MavenApi.create().get<EnhancedResponse<Artifact[]>>("/artifacts")
             .then((response) =>
             {
-                onSuccess(response.data)
+                useUserStore().add(response.data.users);
+                onSuccess(response.data.data);
             });
     }
 

app/components/events/Event.ts

@@ -1,6 +1,7 @@
 import axios from "axios";
 import type {Account} from "~/auth/Account";
 import {Session} from "~/auth/Session";
+import {type EnhancedResponse, useUserStore} from "~/components/users/UserStore";
 
 export class Event
 {
@@ -8,17 +9,18 @@ export class Event
         public type: EventType,
         public timestamp: Date,
         public resource: Resource,
-        public account: Account
+        public userId: string
     )
     {
     }
 
     static get(onSuccess: (events: Event[]) => void)
     {
-        MavenApi.create().get<Event[]>("/events", {withCredentials: true})
+        MavenApi.create().get<EnhancedResponse<Event[]>>("/events", {withCredentials: true})
             .then((response) =>
             {
-                onSuccess(response.data)
+                useUserStore().add(response.data.users);
+                onSuccess(response.data.data)
             });
     }
 }

app/components/events/EventComponent.vue

@@ -8,7 +8,7 @@
         <ContentCell>{{ event.resource.artifactId }}</ContentCell>
         <ContentCell>{{ event.resource.version }}</ContentCell>
         <ContentCell>
-            <DisplayNameComponent :account="event.account"></DisplayNameComponent>
+            <p>{{useUserStore().get(event.userId)?.displayName}}</p>
         </ContentCell>
         <ContentCell>{{ Age.calc(event.timestamp) }}</ContentCell>
     </ContentRow>
@@ -20,6 +20,7 @@ import ContentCell from "~/components/ui/table/ContentCell.vue";
 import {Event, EventType} from "~/components/events/Event";
 import {Age} from "~/utils/Age";
 import DisplayNameComponent from "~/components/auth/DisplayNameComponent.vue";
+import {useUserStore} from "~/components/users/UserStore";
 
 defineProps<{
     event: Event

app/components/users/UserStore.ts

@@ -0,0 +1,41 @@
+export const useUserStore = defineStore('user', {
+    state: () => ({
+        users: {} as Record<string, User>
+    }),
+    getters: {
+        get: (state) =>
+        {
+            return (id: string): User | undefined =>
+            {
+                return state.users[id];
+            }
+        }
+    },
+    actions: {
+        add(users: Record<string, User>)
+        {
+            for (const [id, user] of Object.entries(users))
+            {
+                if (this.users[id] == null)
+                {
+                    this.users[id] = user;
+                }
+            }
+        }
+    }
+})
+
+export class EnhancedResponse<P>
+{
+    constructor(
+        public data: P,
+        public users: Record<string, User>
+    )
+    {
+    }
+}
+
+export class User
+{
+    displayName?: string;
+}