implement

front/src/services/authService.ts

@@ -34,8 +34,9 @@ export const authService = {
   async getMe() : Promise<User> {
     const raw = await api.get<any>('/api/User/me')
     // backend User may have fields like userName / UserName and email / Email
+    const userId = raw?.userId ?? ''
     const username = raw?.userName ?? raw?.UserName ?? raw?.username ?? raw?.name ?? ''
     const email = raw?.email ?? raw?.Email ?? ''
-    return { username, email }
+    return { userId, username, email }
   },
 }

front/src/services/userService.ts

@@ -0,0 +1,34 @@
+import type { User } from '@/types'
+import { api } from './api'
+
+const userCache = new Map<string, User>()
+const pendingRequests = new Map<string, Promise<User>>()
+
+export async function fetchUser(userId: string): Promise<User> {
+  const cached = userCache.get(userId)
+  if (cached) return cached
+
+  const pending = pendingRequests.get(userId)
+  if (pending) return pending
+
+  const promise = api.get<any>(`/api/User?userId=${userId}`).then((raw) => {
+    const id = raw?.userId ?? raw?.UserId ?? raw?.id ?? raw?.Id ?? userId
+    const username = raw?.userName ?? raw?.UserName ?? raw?.username ?? raw?.name ?? ''
+    const email = raw?.email ?? raw?.Email ?? ''
+    const user: User = { userId: id, username, email }
+    userCache.set(userId, user)
+    pendingRequests.delete(userId)
+    return user
+  }).catch((err) => {
+    pendingRequests.delete(userId)
+    throw err
+  })
+
+  pendingRequests.set(userId, promise)
+  return promise
+}
+
+export function clearUserCache() {
+  userCache.clear()
+  pendingRequests.clear()
+}

front/src/services/whiteboardHubService.ts

@@ -1,5 +1,5 @@
 import { SignalRService } from '@/services/signalr.ts'
-import type { Rectangle, Whiteboard } from '@/types/whiteboard.ts'
+import type { Arrow, Line, MoveShapeCommand, Rectangle, TextShape, Whiteboard } from '@/types/whiteboard.ts'
 
 const client = new SignalRService(`/hubs/whiteboard`)
 
@@ -24,6 +24,18 @@ export const whiteboardHubService = {
     await client.invoke('AddRectangle', rectangle)
   },
 
+  async addArrow(arrow: Arrow) {
+    await client.invoke('AddArrow', arrow)
+  },
+
+  async addLine(line: Line) {
+    await client.invoke('AddLine', line)
+  },
+
+  async addTextShape(textShape: TextShape) {
+    await client.invoke('AddTextShape', textShape)
+  },
+
   onInitWhiteboard(callback: (whiteboard: Whiteboard) => void) {
     client.on<Whiteboard>('InitWhiteboard', callback)
   },
@@ -32,6 +44,30 @@ export const whiteboardHubService = {
     client.on<Rectangle>('AddedRectangle', callback)
   },
 
+  onAddedArrow(callback: (arrow: Arrow) => void) {
+    client.on<Arrow>('AddedArrow', callback)
+  },
+
+  onAddedLine(callback: (line: Line) => void) {
+    client.on<Line>('AddedLine', callback)
+  },
+
+  onAddedTextShape(callback: (textShape: TextShape) => void) {
+    client.on<TextShape>('AddedTextShape', callback)
+  },
+
+  async moveShape(command: MoveShapeCommand) {
+    await client.invoke('MoveShape', command)
+  },
+
+  async placeShape(command: MoveShapeCommand) {
+    await client.invoke('PlaceShape', command)
+  },
+
+  onMovedShape(callback: (command: MoveShapeCommand) => void) {
+    client.on<MoveShapeCommand>('MovedShape', callback)
+  },
+
   onJoined(callback: (userId: string) => void) {
     client.on<string>('Joined', callback)
   },
@@ -43,6 +79,10 @@ export const whiteboardHubService = {
   offAll() {
     client.off('InitWhiteboard')
     client.off('AddedRectangle')
+    client.off('AddedArrow')
+    client.off('AddedLine')
+    client.off('AddedTextShape')
+    client.off('MovedShape')
     client.off('Joined')
     client.off('Leaved')
   },