<template>    
    <v-avatar 
        v-if="user.icon" 
        :size="size"
    >
        <v-img 
            :src="user.icon"
        >
        </v-img>
    </v-avatar>
    <span 
        v-else
    >
        <v-avatar 
            :size="size" 
            color="bg-light-blue" 
            class="white--text"
            :class="{
                'text-caption': size <= 64,
                'text-body-1': size > 64,
            }"
        >
            {{ user.initials }}
        </v-avatar> 
    </span>
</template>

<script>
    export default {
        props: {
            user: {required: true},
            size: {default: 32},
        },

        name: 'UserAvatar',
    }
</script>