<template>
  <div class="flex-none">
    <div class="-1m1-20px"  v-if="!inversion">
      <img class="w-120px h-120px" src="@/assets/images/aiball.png" alt="" srcset="" />
    </div>
    <img v-else class="w-50px h-50px object-contain rounded-full" :src="avatar" />
  </div>
</template>
<script setup>
import { computed } from 'vue';
import { useUserInfo } from '@/stores/userInfo';
import defaultAvatar from '@/assets/images/avatar@2x.png'
const userInfo = useUserInfo();
const props = defineProps({
  inversion: {
    type: Boolean,
    default: false,
  },
})

const avatar = computed(() => {
  return userInfo?.userData?.avatar || defaultAvatar;
})
</script>
