fix #1 - description link clickable

app/controller/event.js

@@ -34,7 +34,6 @@ const eventController = {
   },
   async updatePlace (req, res) {
     const place = await Place.findByPk(req.body.id)
-    console.log(place)
     await place.update(req.body)
     res.json(place)
   },

app/controller/user.js

@@ -52,11 +52,14 @@ const userController = {
     }
   },
 
-  async addEvent (req, res, next) {
+  async addEvent (req, res) {
     const body = req.body
+    const description = body.description
+      .replace(/(<([^>]+)>)/ig, '')
+      .replace(/(https?:\/\/[^\s]+)/g, '<a href="$1">$1</a>')
     const eventDetails = {
       title: body.title,
-      description: body.description,
+      description,
       multidate: body.multidate,
       start_datetime: body.start_datetime,
       end_datetime: body.end_datetime
@@ -99,6 +102,11 @@ const userController = {
   async updateEvent (req, res) {
     const body = req.body
     const event = await Event.findByPk(body.id)
+
+    body.description = body.description
+      .replace(/(<([^>]+)>)/ig, '') // remove all tags from description
+      .replace(/(https?:\/\/[^\s]+)/g, '<a href="$1">$1</a>') // add links
+
     await event.update(body)
     let place
     try {

client/src/assets/main.css

@@ -23,4 +23,8 @@ pre {
 
 .el-tag:hover {
   cursor: pointer;
+}
+
+a, a:hover {
+  color: orange;
 }

client/src/components/EventDetail.vue

@@ -11,7 +11,7 @@
         span  {{event.place.name}} - {{event.place.address}}
         br
       b-card-body(v-if='event.description || event.tags')
-        pre {{event.description}}
+        pre(v-html='event.description')
         br
         el-tag.mr-1(:color='tag.color' v-for='tag in event.tags'
           size='mini') {{tag.tag}}

client/src/components/newEvent.vue

@@ -93,7 +93,7 @@ export default {
       this.time.start = moment(event.start_datetime).format('HH:mm')
       this.time.end = moment(event.end_datetime).format('HH:mm')
       this.event.title = event.title
-      this.event.description = event.description
+      this.event.description = event.description.replace(/(<([^>]+)>)/ig, '')
       this.event.id = event.id
       if (event.tags) {
         this.event.tags = event.tags.map(t => t.tag)