chore: Replace Thumbnail with Avatar (#12119)

app/javascript/shared/components/ui/MultiselectDropdown.vue

@@ -4,7 +4,7 @@ import { OnClickOutside } from '@vueuse/components';
 import { useToggle } from '@vueuse/core';
 
 import Button from 'dashboard/components-next/button/Button.vue';
-import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
+import Avatar from 'next/avatar/Avatar.vue';
 import MultiselectDropdownItems from 'shared/components/ui/MultiselectDropdownItems.vue';
 
 const props = defineProps({
@@ -82,12 +82,14 @@ const hasValue = computed(() => {
             {{ selectedItem.name }}
           </h4>
         </div>
-        <Thumbnail
+        <Avatar
           v-if="hasValue && hasThumbnail"
           :src="selectedItem.thumbnail"
-          size="24px"
           :status="selectedItem.availability_status"
-          :username="selectedItem.name"
+          :name="selectedItem.name"
+          :size="24"
+          hide-offline-status
+          rounded-full
         />
       </Button>
       <div

app/javascript/shared/components/ui/MultiselectDropdownItems.vue

@@ -1,14 +1,14 @@
 <script>
 import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
 import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
-import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
+import Avatar from 'next/avatar/Avatar.vue';
 import NextButton from 'dashboard/components-next/button/Button.vue';
 
 export default {
   components: {
     WootDropdownItem,
     WootDropdownMenu,
-    Thumbnail,
+    Avatar,
     NextButton,
   },
 
@@ -105,13 +105,14 @@ export default {
                   {{ option.name }}
                 </span>
               </div>
-              <Thumbnail
+              <Avatar
                 v-if="hasThumbnail"
                 :src="option.thumbnail"
-                size="24px"
-                :username="option.name"
+                :name="option.name"
                 :status="option.availability_status"
-                has-border
+                :size="24"
+                hide-offline-status
+                rounded-full
               />
             </NextButton>
           </WootDropdownItem>