<script setup lang="ts">
import { Badge } from '~/components/pub/ui/badge'

const props = defineProps<{
  rec: any
  idx?: number
}>()

const statusMap: Record<string, { text: string; variant: 'default' | 'secondary' | 'fresh' | 'positive' | 'negative' | 'warning' | 'destructive' | 'outline' }> = {
  'belum_terverifikasi': { text: 'Belum Terverifikasi', variant: 'secondary' },
  'terverifikasi': { text: 'Terverifikasi', variant: 'positive' },
  'ditolak': { text: 'Ditolak', variant: 'destructive' },
}

const statusInfo = computed(() => {
  const status = props.rec.status?.toLowerCase() || props.rec.status_code?.toLowerCase() || 'belum_terverifikasi'
  return statusMap[status] || statusMap['belum_terverifikasi']
})
</script>

<template>
  <div class="flex justify-center">
    <Badge :variant="statusInfo.variant">
      {{ statusInfo.text }}
    </Badge>
  </div>
</template>

