From 313609af559f123c1aa26abfdff3e6c39775f8fc Mon Sep 17 00:00:00 2001
From: Filip Gutica <filgut@protonmail.com>
Date: Tue, 1 Aug 2023 09:48:58 -0700
Subject: [PATCH] feat(copy-uuid): add option to completely hide uuid [MA-1917]

sometimes we only want to show the icon and no uuid at all, redacted or not.
---
 packages/core/copy-uuid/README.md                   | 9 +++++++++
 packages/core/copy-uuid/sandbox/App.vue             | 7 +++++++
 packages/core/copy-uuid/src/components/CopyUuid.vue | 9 ++++++++-
 3 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/packages/core/copy-uuid/README.md b/packages/core/copy-uuid/README.md
index e5958550d9..65ed104792 100644
--- a/packages/core/copy-uuid/README.md
+++ b/packages/core/copy-uuid/README.md
@@ -18,6 +18,7 @@ A Kong UI component for displaying uuid and copying it to clipboard.
   - [`iconColor`](#iconcolor)
   - [`tooltip`](#tooltip)
   - [`successTooltip`](#successtooltip)
+  - [`showUuid`](#showuuid)
 - [Events](#events)
   - [`success`](#success)
   - [`error`](#error)
@@ -205,6 +206,14 @@ Tooltip text to display on hovering over the copy icon. This field is required i
 Note: The `tooltip` prop is required to have a value in order to use this prop. When using this prop the `@success` and `@error` events will not be fired, as the tooltip text will be updated instead.
 Tooltip text to display on successful copy.
 
+### `showUuid`
+
+- type: `Boolean`
+- required: `false`
+- default: `true`
+
+If false the UUID will not be shown at all. Useful for the case the host app wants to display something that the uuid resolves to, but still be able to copy the uuid behind the scenes.
+
 ## Events
 
 Success and error events are only emitted if NOT using the `successTooltip` prop.
diff --git a/packages/core/copy-uuid/sandbox/App.vue b/packages/core/copy-uuid/sandbox/App.vue
index ada401c86f..3aacb4d2b1 100644
--- a/packages/core/copy-uuid/sandbox/App.vue
+++ b/packages/core/copy-uuid/sandbox/App.vue
@@ -49,6 +49,13 @@
           :uuid="uuid"
         />
       </div>
+      <div>
+        <h3>Don't show uuid</h3>
+        <CopyUuid
+          :show-uuid="false"
+          :uuid="uuid"
+        />
+      </div>
     </main>
   </div>
 </template>
diff --git a/packages/core/copy-uuid/src/components/CopyUuid.vue b/packages/core/copy-uuid/src/components/CopyUuid.vue
index 49891469e9..be38893a0e 100644
--- a/packages/core/copy-uuid/src/components/CopyUuid.vue
+++ b/packages/core/copy-uuid/src/components/CopyUuid.vue
@@ -11,7 +11,9 @@
           useMono ? 'mono' : null
         ]"
       >
-        {{ isHidden ? '**********' : uuid }}
+        <span v-if="showUuid">
+          {{ isHidden ? '**********' : uuid }}
+        </span>
       </div>
     </div>
     <component
@@ -82,6 +84,11 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  showUuid: {
+    type: Boolean,
+    required: false,
+    default: true,
+  },
 })
 
 const emit = defineEmits<{