Fixes #2848 - Show age (indicator) for public KB Answers

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

@@ -87,7 +87,9 @@ class App.KnowledgeBaseReaderController extends App.Controller
     @renderBody(answer_translation)
 
     @answerMeta.html App.view('knowledge_base/_reader_answer_meta')(
-      answer: answer
+      answer:      answer,
+      translation: answer_translation,
+      isEditor:    @parentController.isEditor()
     )
 
     @renderPopovers()

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

@@ -28,6 +28,16 @@ InstanceMethods =
 
     @["#{state}_at"]
 
+  can_be_published_internal_by: ->
+    return if !@is_internally_published_object()
+
+    App.User.find(@internal_by_id || @published_by_id)
+
+  can_be_published_internal_at: ->
+    return if !@is_internally_published_object()
+
+    @internal_at || @published_at
+
   can_be_published_state_css: ->
     "state-#{@can_be_published_state()}"
 
@@ -62,11 +72,11 @@ InstanceMethods =
   can_be_published_internal_in_future: ->
     @date(@internal_at) > (new Date()).getTime()
 
-  is_internally_published: (kb_locale) ->
-    state = @can_be_published_state()
-    object_published = state == 'internal' || state == 'published'
+  is_internally_published_object: (state = @can_be_published_state()) ->
+    state == 'internal' || state == 'published'
 
-    if !object_published
+  is_internally_published: (kb_locale) ->
+    if !@is_internally_published_object()
       return false
 
     if !@translation(kb_locale.id)
@@ -83,7 +93,6 @@ InstanceMethods =
 
     true
 
-
   date: (string) ->
     return undefined if !string
     new Date(string).getTime()

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

@@ -89,6 +89,10 @@ App.ViewHelpers =
   Ti: (item, args...) ->
     App.i18n.translateInline(item, args...)
 
+  # define translation plain helper
+  Tp: (item, args...) ->
+    App.i18n.translatePlain(item, args...)
+
   # define translation for date helper
   Tdate: (item, args...) ->
     App.i18n.translateDate(item, args...)

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

@@ -1,10 +1,13 @@
-<%- @T(@answer.can_be_published_state()) %>
+<% if @isEditor: %>
+  <span><%- @T(@answer.can_be_published_state()) %></span>
+<% end %>
 
-<% if user = @answer.can_be_published_by(): %>
-  <%- @T('by') %>
-  <%= user.displayName() %>
+<% if @answer.is_internally_published_object() && user_id = @translation.updated_by_id: %>
+  <% if user = App.User.find(user_id): %>
+    <span><%- user.displayName() %></span>
+  <% end %>
 <% end %>
 
-<% if date = @answer.can_be_published_at(): %>
-  <%- @humanTime(date) %>
+<% if @answer.is_internally_published_object() && timestamp = Math.max(new Date(@answer.can_be_published_internal_at()), new Date(@translation.updated_at)): %>
+  <%- @Tp 'Published %s', @humanTime(new Date(timestamp).toISOString()) %>
 <% end %>

app/assets/stylesheets/knowledge_base.scss

@@ -926,6 +926,12 @@ b {
   color: $dark-color;
 }
 
+.article-meta {
+  margin-top: 30px;
+  font-size: 0.865em;
+  color: gray;
+}
+
 .article-content {
   display: block;
 

app/assets/stylesheets/zammad.scss

@@ -555,7 +555,7 @@ pre code {
     }
 
     .icon:only-child {
-      margin: 0;
+      margin: 0 !important;
     }
 
     &.btn--slim {
@@ -13686,6 +13686,20 @@ span.is-disabled {
   &-meta {
     display: block;
     text-align: center;
+
+    > * {
+      &:first-child {
+        text-transform: capitalize;
+      }
+
+      &::after {
+        content: ' · ';
+      }
+
+      &:last-child::after {
+        display: none;
+      }
+    }
   }
 
   &-body {

app/helpers/knowledge_base_human_date_helper.rb

@@ -0,0 +1,13 @@
+# Copyright (C) 2012-2022 Zammad Foundation, https://zammad-foundation.org/
+
+module KnowledgeBaseHumanDateHelper
+  def human_time_tag(time, locale: system_locale_via_uri)
+    timezone     = Setting.get('timezone_default').presence || 'UTC'
+    time_in_zone = time.in_time_zone(timezone)
+    locale_name  = locale.locale
+
+    time_tag time, title: time_in_zone do
+      Translation.timestamp(locale_name, timezone, time_in_zone, append_timezone: false)
+    end
+  end
+end

app/helpers/translation_helper.rb

@@ -1,8 +1,8 @@
 # Copyright (C) 2012-2022 Zammad Foundation, https://zammad-foundation.org/
 
 module TranslationHelper
-  def zammad_translate(string)
-    Translation.translate(system_locale_via_uri&.locale, string)
+  def zammad_translate(string, *args)
+    Translation.translate(system_locale_via_uri&.locale, string, *args)
   end
 
   alias zt zammad_translate

app/models/translation.rb

@@ -94,8 +94,12 @@ translate strings in Ruby context, e. g. for notifications
 
 =end
 
-  def self.translate(locale, string)
-    find_source(locale, string)&.target || string
+  def self.translate(locale, string, *args)
+    translated = find_source(locale, string)&.target || string
+
+    translated = translated % args if args.any?
+
+    translated
   end
 
 =begin
@@ -122,7 +126,7 @@ or
 
 =end
 
-  def self.timestamp(locale, timezone, timestamp)
+  def self.timestamp(locale, timezone, timestamp, append_timezone: true)
 
     if timestamp.instance_of?(String)
       begin
@@ -155,7 +159,10 @@ or
     record.sub!('HH', format('%<hour>02d', hour: timestamp.hour.to_s))
     record.sub!('l', timestamp.strftime('%l'))
     record.sub!('P', timestamp.strftime('%P'))
-    "#{record} (#{timezone})"
+
+    record += " (#{timezone})" if append_timezone
+
+    record
   end
 
 =begin

app/views/knowledge_base/public/answers/show.html.erb

@@ -35,6 +35,12 @@ data-available-locales='<%= @object_locales.map(&:locale).join(',') %>'>
           </div>
         </div>
       <% end %>
+
+      <% if @object.visible? %>
+        <div class="article-meta">
+          <%= raw zt 'Published %s', human_time_tag([@object.published_at, @object.translation.updated_at].max) %>
+        </div>
+      <% end %>
     </div>
   </article>
 </main>