Modify Shot Data Table Functions

frontend/src/components/task/TaskDetailPanel.vue

@@ -136,7 +136,7 @@
                 <div v-if="task.assigned_user_name" class="mt-1 flex items-center gap-2">
                   <Avatar class="h-6 w-6">
                     <AvatarImage
-                      :src="`https://api.dicebear.com/7.x/initials/svg?seed=${task.assigned_user_name}`"
+                      :src="`getInitialsAvatarUrl(task.assigned_user_name)`"
                     />
                     <AvatarFallback class="text-xs">{{ getAssignedUserInitials(task.assigned_user_name) }}</AvatarFallback>
                   </Avatar>
@@ -228,7 +228,7 @@
                   <div class="flex items-center gap-3 w-full">
                     <Avatar class="h-8 w-8">
                       <AvatarImage
-                        :src="`https://api.dicebear.com/7.x/initials/svg?seed=${member.user_first_name} ${member.user_last_name}`"
+                        :src="`https://ui-avatars.com/api/?name=${member.user_first_name} ${member.user_last_name}`"
                       />
                       <AvatarFallback>{{ getUserInitials(member) }}</AvatarFallback>
                     </Avatar>
@@ -478,12 +478,9 @@ function getUserInitials(member: ProjectMember): string {
   return `${member.user_first_name.charAt(0)}${member.user_last_name.charAt(0)}`.toUpperCase()
 }
 
-function getAvatarUrl(url: string | null | undefined) {
-  if (!url) return ''
-  if (url.startsWith('http')) return url
-  const cleanUrl = url.replace(/^backend[\/\\]/, '').replace(/\\/g, '/')
-  return `http://localhost:8000/${cleanUrl}`
-}
+import { useAvatarUrl } from '@/composables/useAvatarUrl'
+
+const { getAvatarUrl } = useAvatarUrl()
 
 function getAssignedUserInitials(name: string) {
   const parts = name.split(' ')