<template>
  <Button
    :icon="isCopied ? 'pi pi-check' : 'pi pi-copy'"
    :label="isCopied ? 'Ссылка скопирована!' : 'Копировать ссылку'"
    class="text-nowrap"
    severity="secondary"
    size="small"
    @click="copyLink()"
    :outlined="!isCopied"
  />
</template>

<script setup lang="ts">
const props = defineProps<{ url: string }>()
const {
  mutate: copyLink,
  isSuccess: isCopied,
  reset,
} = useMutation({
  mutationFn: async () => {
    await navigator.clipboard.writeText(props.url)
    setTimeout(reset, 2500)
  },
  gcTime: 100,
})
</script>
