<script setup lang="ts">
import { PhShieldCheck as ShieldCheck } from '@phosphor-icons/vue'
import { getPoliceFilingUrl, MIIT_FILING_URL } from '~/utils/filing'

const props = defineProps<{ icp: string; policeRecord?: string }>()
const policeRecord = computed(() => props.policeRecord?.trim() || '')
const policeFilingUrl = computed(() => getPoliceFilingUrl(policeRecord.value))
</script>

<template>
  <span class="filing-links">
    <a :href="MIIT_FILING_URL" target="_blank" rel="noopener noreferrer">{{ icp }}</a>
    <template v-if="policeRecord">
      <span aria-hidden="true">·</span>
      <a class="police-filing-link" :href="policeFilingUrl" target="_blank" rel="noopener noreferrer">
        <ShieldCheck :size="16" weight="fill" aria-hidden="true" />
        {{ policeRecord }}
      </a>
    </template>
  </span>
</template>
