From d53f5bfa92b41363de2b39cb4696acad0f456128 Mon Sep 17 00:00:00 2001
From: Lapo Luchini <lapo@lapo.it>
Date: Mon, 22 Jun 2020 20:56:02 +0200
Subject: [PATCH] Add support for links in description

---
 pinry-spa/src/components/Pins.vue | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/pinry-spa/src/components/Pins.vue b/pinry-spa/src/components/Pins.vue
index b229bbf..a096ea7 100644
--- a/pinry-spa/src/components/Pins.vue
+++ b/pinry-spa/src/components/Pins.vue
@@ -36,8 +36,7 @@
                      class="pin-preview-image">
                 </div>
                 <div class="pin-footer">
-                  <div class="description" v-show="item.description"><p>{{ item.description }}</p>
-                  </div>
+                  <div class="description" v-show="item.description" v-html="niceLinks(item.description)"></div>
                   <div class="details">
                     <div class="is-pulled-left">
                       <img class="avatar" :src="item.avatar" alt="">
@@ -127,6 +126,18 @@ function initialData() {
   };
 }
 
+const encoder = document.createElement('div');
+function escapeHTML(text) {
+  encoder.innerText = text;
+  return encoder.innerHTML;
+}
+
+const reURL = /https?:[/][/](?:www[.])?([^/]+)(?:[/]([.]?[^\s,.<>])+)?/g;
+function niceLinks(text) {
+  if (!text) return '';
+  return escapeHTML(text).replace(reURL, '<a href="$&" target="_blank">$1</a>');
+}
+
 export default {
   name: 'pins',
   components: {
@@ -293,6 +304,7 @@ export default {
         () => { this.status.loading = false; },
       );
     },
+    niceLinks,
   },
   created() {
     bus.bus.$on(bus.events.refreshPin, this.reset);