Fixes #2612 - Tag KB Answers

LICENSE-ICONS-3RD-PARTY.json

@@ -244,6 +244,11 @@
         "url": "",
         "license": "MIT"
     },
+    "hashtag.svg": {
+        "author": "Felix Niklas",
+        "url": "",
+        "license": "MIT"
+    },
     "help.svg": {
         "author": "Felix Niklas",
         "url": "",

app/assets/javascripts/app/controllers/knowledge_base/reader_controller.coffee

@@ -2,13 +2,17 @@ class App.KnowledgeBaseReaderController extends App.Controller
   @extend App.PopoverProvidable
   @registerPopovers 'Ticket'
 
+  events:
+    'click .js-tag': 'searchTag'
+
   elements:
-    '.js-answer-title':      'answerTitle'
-    '.js-answer-body':       'answerBody'
-    '.js-answer-pagination': 'answerPagination'
-    '.js-answer-attachments': 'answerAttachments'
+    '.js-answer-title':          'answerTitle'
+    '.js-answer-body':           'answerBody'
+    '.js-answer-pagination':     'answerPagination'
+    '.js-answer-attachments':    'answerAttachments'
+    '.js-answer-tags':           'answerTags'
     '.js-answer-linked-tickets': 'answerLinkedTickets'
-    '.js-answer-meta': 'answerMeta'
+    '.js-answer-meta':           'answerMeta'
 
   constructor: ->
     super
@@ -60,6 +64,7 @@ class App.KnowledgeBaseReaderController extends App.Controller
       return
 
     @renderAttachments(answer.attachments)
+    @renderTags(answer.tags)
     @renderLinkedTickets(answer.translation(kb_locale.id)?.linked_tickets())
 
     paginator = new App.KnowledgeBaseReaderPagination(object: @object, kb_locale: kb_locale)
@@ -129,6 +134,11 @@ class App.KnowledgeBaseReaderController extends App.Controller
       attachments: attachments
     )
 
+  renderTags: (tags) ->
+    @answerTags.html App.view('knowledge_base/_reader_tags')(
+      tags: tags
+    )
+
   renderLinkedTickets: (linked_tickets) ->
     @answerLinkedTickets.html App.view('knowledge_base/_reader_linked_tickets')(
       tickets: linked_tickets
@@ -154,3 +164,8 @@ class App.KnowledgeBaseReaderController extends App.Controller
       return
 
     decodeURIComponent @parentController.lastParams.arguments
+
+  searchTag: (e) ->
+    e.preventDefault()
+    item = $(e.currentTarget).text()
+    App.GlobalSearchWidget.search(item, 'tags')

app/assets/javascripts/app/controllers/knowledge_base/sidebar.coffee

@@ -15,7 +15,9 @@ class App.KnowledgeBaseSidebar extends App.Controller
       true
 
   rerender: ->
-    @show(@savedParams, @savedAction)
+    @delay( =>
+      @show(@savedParams, @savedAction)
+    , 300, 'rerender')
 
   contentActionClicked: (e) ->
     # coffeelint: disable=indentation
@@ -59,5 +61,6 @@ class App.KnowledgeBaseSidebar extends App.Controller
     if object instanceof App.KnowledgeBaseAnswer
       output.push App.KnowledgeBaseSidebarLinkedTickets
       output.push App.KnowledgeBaseSidebarAttachments
+      output.push App.KnowledgeBaseSidebarTags
 
     output

app/assets/javascripts/app/controllers/knowledge_base/sidebar/tags.coffee

@@ -0,0 +1,13 @@
+class App.KnowledgeBaseSidebarTags extends App.Controller
+  className: 'sidebar-block'
+
+  constructor: ->
+    super
+
+    @widget = new App.WidgetTag(
+      el:          @el
+      templateName: 'knowledge_base/sidebar/tags'
+      object_type: 'KnowledgeBaseAnswer'
+      object:      @object
+      tags:        @object.tags
+    )

app/assets/javascripts/app/controllers/widget/tag.coffee

@@ -2,6 +2,7 @@ class App.WidgetTag extends App.Controller
   editMode: false
   pendingRefresh: false
   possibleTags: {}
+  templateName:'widget/tag'
   elements:
     '.js-newTagLabel': 'newTagLabel'
     '.js-newTagInput': 'newTagInput'
@@ -50,7 +51,7 @@ class App.WidgetTag extends App.Controller
   render: =>
     return if @lastLocalTags && _.isEqual(@lastLocalTags, @localTags)
     @lastLocalTags = _.clone(@localTags)
-    @html App.view('widget/tag')(
+    @html App.view(@templateName)(
       tags: @localTags || [],
     )
     source = "#{App.Config.get('api_path')}/tag_search"

app/assets/javascripts/app/lib/mixins/knowledge_base_translatable.coffee

@@ -45,6 +45,7 @@ InstanceMethods =
     if @ instanceof App.KnowledgeBaseAnswer
       attrs.icon  = 'knowledge-base-answer'
       attrs.state = @can_be_published_state()
+      attrs.tags  = @tags
 
       if options.isEditor
         attrs.editorOnly = !@is_internally_published(kb_locale)

app/assets/javascripts/app/views/knowledge_base/_reader_tags.jst.eco

@@ -0,0 +1,14 @@
+<% if @tags?.length: %>
+  <div class="attachments attachments--list">
+    <%- @Icon('hashtag') %>
+    <div class="attachments-title">
+      <%- @T('Tags') %>
+    </div>
+
+    <div class="knowledge-base-article-tags--container">
+      <% for tag, i in @tags: %>
+        <a href="#" class="tag js-tag"><%= tag %></a>
+      <% end %>
+    </div>
+  </div>
+<% end %>

app/assets/javascripts/app/views/knowledge_base/reader.jst.eco

@@ -16,6 +16,7 @@
       <div class="knowledge-base-article-content richtext-content js-answer-body"></div>
       <div class="knowledge-base-article-attachments js-answer-attachments"></div>
       <div class="knowledge-base-article-linked-tickets js-answer-linked-tickets"></div>
+      <div class="knowledge-base-article-tags js-answer-tags"></div>
     </div>
 
     <div class="js-answer-pagination"></div>

app/assets/javascripts/app/views/knowledge_base/sidebar/attachments.jst.eco

@@ -4,15 +4,12 @@
 
 <div class="dropContainer">
   <% if @attachments.length > 0: %>
-    <ol class="tasks tasks--standalone">
+    <ol class="list list--sidebar">
       <% for attachment in @attachments: %>
-        <li class="task">
-          <div class="task-text">
-            <a class="name" target=_blank href="<%= attachment.url %>">
-              <%= attachment.filename %>
-            </a>
-          </div>
-
+        <li class="list-item">
+          <a class="list-item-name" target=_blank href="<%= attachment.url %>">
+            <%= attachment.filename %>
+          </a>
           <a class="list-item-delete js-delete" data-object-id="<%= attachment.id %>" href="#">
             <%- @Icon('diagonal-cross') %>
           </a>

app/assets/javascripts/app/views/knowledge_base/sidebar/tags.jst.eco

@@ -0,0 +1,24 @@
+<div class="sidebar-block-header">
+  <h2><%- @T('Tags') %></h2>
+</div>
+
+<% if @tags.length > 0: %>
+<ol class="list list--sidebar">
+  <% for elem in @tags: %>
+    <li class="list-item" data-id="<%= elem %>">
+      <a class="list-item-name js-tag"><%= elem %></a>
+      <div class="list-item-delete js-delete" data-type="remove">
+        <%- @Icon('diagonal-cross') %>
+      </div>
+    </li>
+  <% end %>
+</ol>
+<% end %>
+
+<a class="sidebar-block-button text-muted js-newTagLabel" href="#">
+  + <%- @T('Add Tag') %>
+</a>
+
+<form class="ui-front">
+  <input type="text" name="new_tag" class="hide js-newTagInput" autocomplete="off">
+</form>