<template>
  <template v-if="cell.columnType === ColumnType.Boolean">
    <BmsChip v-if="cellValue" :color="ChipColor.Green">Oui</BmsChip>
    <BmsChip v-else>Non</BmsChip>
  </template>
  <template v-else-if="cell.columnType === ColumnType.Date">
    <BmsRelativeTime :relativeTo="relativeToTime" />
  </template>
  <template v-else>
    {{ cellValue }}
  </template>
</template>

<script setup lang="ts">
import { ChipColor, ColumnType, TableHeader } from '@/models';
import _get from 'lodash/get';
import BmsChip from '../form/BmsChip.vue';
import { computed } from 'vue';
import BmsRelativeTime from '../utils/BmsRelativeTime.vue';

const props = defineProps<{ cell: TableHeader; item: any }>();

const cellValue = computed(() => _get(props.item, props.cell.key) ?? '');
const relativeToTime = computed(() => new Date(cellValue.value)?.getTime());
</script>
