<script setup lang="ts">
import type { Message } from "@/interfaces";

import { DocumentDuplicateIcon } from "@/assets/Icons";
import { copy } from "@/utils";

const { msg } = defineProps<{
  msg: Message;
}>();
</script>

<template>
  <div class="flex items-center gap-2 justify-end mt-2">
    <div v-if="msg.role !== 'user'">
      <tts :text="msg.content || ''" :message-id="msg.id!" />
    </div>
    <NPopover trigger="hover">
      <template #trigger>
        <NButton quaternary circle @click="copy(msg.content || '')">
          <DocumentDuplicateIcon class="!w-4 !h-4" />
        </NButton>
      </template>
      <span>复制内容</span>
    </NPopover>
  </div>
</template>