1. Add copy Contact link to profile 2. move copyLink changes into component

src/components/CopyLink.vue

@@ -0,0 +1,99 @@
+<template>
+  <v-expand-transition>
+    <v-card class="ma-3" v-show="locationLink" flat>
+      <v-container>
+        <slot/>
+        <v-row cols="12" class="qr-container ma-3">
+          <v-col cols="auto" v-if="$slots.qrCode">
+            <slot name="qrCode"/>
+          </v-col>
+          <v-col align-self="center" class="public-link">
+            <div class="link">{{ locationLink }}</div>
+          </v-col>
+        </v-row>
+        <v-row align="center" class="mt-0 pt-0">
+          <v-col align="center" class="mt-0 pt-0">
+            <v-btn
+              id="btn-copy-room-link"
+              :color="publicRoomLinkCopied ? '#DEE6FF' : 'black'"
+              depressed
+              @click.stop="copyRoomLink"
+              :class="{'filled-button' : true, 'link-copied-in-place' : publicRoomLinkCopied}"
+              >{{ $t(`room_info.${publicRoomLinkCopied ? 'link_copied' : i18nCopyLinkKey}`) }}</v-btn
+            >
+          </v-col>
+        </v-row>
+      </v-container>
+    </v-card>
+  </v-expand-transition>
+</template>
+
+<script>
+export default {
+props: {
+  locationLink: {
+    type: String
+  },
+  i18nCopyLinkKey: {
+    type: String,
+    default: 'copy_link'
+  }
+},
+data() {
+  return {
+    publicRoomLinkCopied: false,
+  }
+},
+methods: {
+  copyRoomLink() {
+    if(this.publicRoomLinkCopied) return
+    const self = this;
+    this.$copyText(this.locationLink).then(
+      function (ignored) {
+        // Success!
+        self.publicRoomLinkCopied = true;
+        setInterval(() => {
+          // Hide again
+          self.publicRoomLinkCopied = false;
+        }, 3000);
+      },
+      function (e) {
+        console.log(e);
+      }
+    );
+  }
+}
+}
+</script>
+
+<style lang="scss">
+  .qr-container {
+    background-color: white;
+    border-radius: 8px;
+    margin-top: 20px !important;
+    .qr {
+      width: 60px;
+      height: 60px;
+      background-color: #e0e0e0;
+    }
+    .public-link {
+      background-color: #D6D5FC33;
+      border-radius: 11px;
+      .link {
+        font-family: "Inter", sans-serif;
+        font-size: 16px;
+        text-decoration: underline;
+        color: #3d6eff;
+        overflow-wrap: anywhere;
+      }
+    }
+
+  }
+
+  .link-copied-in-place .v-btn__content {
+    font-family: "Inter", sans-serif !important;
+    font-size: 12px !important;
+    text-transform: none !important;
+    color: #3d6eff;
+  }
+</style>