<script lang="ts" setup>
// #region --Props--.
/** Typescript typage */
defineProps<{
  score: number;
  nbVote: number;
}>();
// #endregion

// #region --Function--.
/**
 * Format vote count if > 1000.
 * @param count
 */
function formatVoteCount(count: number) {
  if (count >= 1000) return `${(count / 1000).toFixed(1)}k votes`;
  return `${count} votes`;
}
// #endregion
</script>

<template>
  <section class="flex items-center mb-6">
    <section class="bg-primary text-white rounded-full w-12 h-12 flex items-center justify-center font-bold mr-3">
      {{ score.toFixed(1) }}
    </section>
    <section>
      <p class="font-semibold">
        Note TMDB
      </p>
      <div class="text-sm text-gray-400">
        {{ formatVoteCount(nbVote) }}
      </div>
    </section>
  </section>
</template>

<style scoped></style>