Copy dialog title

src/components/dialogs/AvatarDialog/AvatarDialog.vue

@@ -22,7 +22,17 @@
                 <div style="flex: 1; display: flex; align-items: center; margin-left: 15px">
                     <div style="flex: 1">
                         <div>
-                            <span class="dialog-title" v-text="avatarDialog.ref.name"></span>
+                            <el-popover placement="top" trigger="click">
+                                <span
+                                    slot="reference"
+                                    class="dialog-title"
+                                    style="margin-right: 5px; cursor: pointer"
+                                    v-text="avatarDialog.ref.name"
+                                    @click="copyToClipboard(avatarDialog.ref.name)"></span>
+                                <span style="display: block; text-align: center; font-family: monospace">{{
+                                    textToHex(avatarDialog.ref.name)
+                                }}</span>
+                            </el-popover>
                         </div>
                         <div style="margin-top: 5px">
                             <span
@@ -613,7 +623,8 @@
         storeAvatarImage,
         timeToText,
         moveArrayItem,
-        formatDateFilter
+        formatDateFilter,
+        textToHex
     } from '../../../shared/utils';
     import {
         useAppearanceSettingsStore,

src/components/dialogs/GroupDialog/GroupDialog.vue

@@ -37,7 +37,17 @@
                 <div style="flex: 1; display: flex; align-items: center; margin-left: 15px">
                     <div class="group-header" style="flex: 1">
                         <span v-if="groupDialog.ref.ownerId === currentUser.id" style="margin-right: 5px">👑</span>
-                        <span class="dialog-title" style="margin-right: 5px" v-text="groupDialog.ref.name"></span>
+                        <el-popover placement="top" trigger="click">
+                            <span
+                                slot="reference"
+                                class="dialog-title"
+                                style="margin-right: 5px; cursor: pointer"
+                                v-text="groupDialog.ref.name"
+                                @click="copyToClipboard(groupDialog.ref.name)"></span>
+                            <span style="display: block; text-align: center; font-family: monospace">{{
+                                textToHex(groupDialog.ref.name)
+                            }}</span>
+                        </el-popover>
                         <span
                             class="group-discriminator x-grey"
                             style="font-family: monospace; font-size: 12px; margin-right: 5px">
@@ -1181,7 +1191,8 @@
         removeFromArray,
         userImage,
         userStatusClass,
-        formatDateFilter
+        formatDateFilter,
+        textToHex
     } from '../../../shared/utils';
     import {
         useAppearanceSettingsStore,

src/components/dialogs/UserDialog/UserDialog.vue

@@ -86,7 +86,8 @@
                                     slot="reference"
                                     class="dialog-title"
                                     style="margin-left: 5px; margin-right: 5px; cursor: pointer"
-                                    v-text="userDialog.ref.displayName"></span>
+                                    v-text="userDialog.ref.displayName"
+                                    @click="copyUserDisplayName(userDialog.ref.displayName)"></span>
                                 <span style="display: block; text-align: center; font-family: monospace">{{
                                     textToHex(userDialog.ref.displayName)
                                 }}</span>

src/components/dialogs/WorldDialog/WorldDialog.vue

@@ -22,13 +22,25 @@
                 <div style="flex: 1; display: flex; align-items: center; margin-left: 15px">
                     <div style="flex: 1">
                         <div>
+                            <el-popover placement="top" trigger="click">
+                                <span
+                                    slot="reference"
+                                    class="dialog-title"
+                                    style="margin-right: 5px; cursor: pointer"
+                                    @click="copyToClipboard(worldDialog.ref.name)">
                                     <i
-                                v-show="
+                                        v-if="
-                                    currentUser.$homeLocation && currentUser.$homeLocation.worldId === worldDialog.id
+                                            currentUser.$homeLocation &&
+                                            currentUser.$homeLocation.worldId === worldDialog.id
                                         "
                                         class="el-icon-s-home"
                                         style="margin-right: 5px" />
-                            <span class="dialog-title" v-text="worldDialog.ref.name" />
+                                    {{ worldDialog.ref.name }}
+                                </span>
+                                <span style="display: block; text-align: center; font-family: monospace">{{
+                                    textToHex(worldDialog.ref.name)
+                                }}</span>
+                            </el-popover>
                         </div>
                         <div style="margin-top: 5px">
                             <span
@@ -785,7 +797,9 @@
         openFolderGeneric,
         deleteVRChatCache,
         commaNumber,
-        formatDateFilter
+        formatDateFilter,
+        textToHex,
+        copyToClipboard
     } from '../../../shared/utils';
     import {
         useAppearanceSettingsStore,