From ac15f131d1951e049108ff8ad6cecf33144d2f96 Mon Sep 17 00:00:00 2001
From: John Simons <john.simons@particular.net>
Date: Fri, 4 Apr 2025 17:24:58 +1000
Subject: [PATCH] Clears previous timeout when copying

Ensures that only one timeout is active for hiding the "copied" tooltip, preventing potential issues when copying multiple times in quick succession.

This is achieved by clearing any existing timeout before setting a new one.
---
 src/Frontend/src/components/CopyToClipboard.vue | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/Frontend/src/components/CopyToClipboard.vue b/src/Frontend/src/components/CopyToClipboard.vue
index 4ec0c1323..3f43a1a63 100644
--- a/src/Frontend/src/components/CopyToClipboard.vue
+++ b/src/Frontend/src/components/CopyToClipboard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Tippy, TippyComponent } from "vue-tippy";
-import { useTemplateRef } from "vue";
+import { ref, useTemplateRef, watch } from "vue";
 
 const props = withDefaults(
   defineProps<{
@@ -11,14 +11,16 @@ const props = withDefaults(
 );
 
 const tippyRef = useTemplateRef<TippyComponent | null>("tippyRef");
-let timeoutId: number;
+const timeoutId = ref(0);
 
 async function copyToClipboard() {
   await navigator.clipboard.writeText(props.value);
-  window.clearTimeout(timeoutId);
+
   tippyRef.value?.show();
-  timeoutId = window.setTimeout(() => tippyRef.value?.hide(), 3000);
+  timeoutId.value = window.setTimeout(() => tippyRef.value?.hide(), 3000);
 }
+
+watch(timeoutId, (_, previousTimeoutId) => window.clearTimeout(previousTimeoutId));
 </script>
 
 <template>