<script setup lang="ts">

import {computed} from "vue";
import {computedAsync} from "@vueuse/core";
import {ActivitySourceResponse, ActivitySourceResponseTypeEnum} from "@/generated/mammon";
import {CharacterLabel, useCharactersStore} from "@/characters";
import {CorporationLabel} from "@/corporations";
import {LedgerLabel, useLedgersStore} from "@/ledger";

interface Props {
  source: ActivitySourceResponse;
  size?: number;
}

const props = withDefaults(defineProps<Props>(), {
  size: 32
});

const charactersStore = useCharactersStore();
const ledgersStore = useLedgersStore();

const character = computedAsync(async () => {
  if (props.source.type === ActivitySourceResponseTypeEnum.Character && props.source.characterId) {
    return await charactersStore.findById(props.source.characterId);
  }
  return undefined;
}, undefined);

const ledger = computed(() =>
  props.source.type === ActivitySourceResponseTypeEnum.Ledger && props.source.ledgerId
    ? ledgersStore.findById(props.source.ledgerId)
    : undefined);
</script>

<template>
  <CharacterLabel v-if="source.type === ActivitySourceResponseTypeEnum.Character && character" :character="character" :size="size" />
  <CorporationLabel v-else-if="source.type === ActivitySourceResponseTypeEnum.Corporation && source.corporationId" :corporation-id="source.corporationId" :division="source.division" :size="size" />
  <LedgerLabel v-else-if="ledger" :ledger="ledger" link />
</template>
