From 68d815da273aae959c49dd355a58f067b24edef3 Mon Sep 17 00:00:00 2001
From: Martin Edenhofer <me@zammad.com>
Date: Sun, 21 Mar 2021 15:02:32 +0000
Subject: [PATCH] Fixes #3461 - Dashboard stats widgets are sometimes
 lost/empty

---
 .../app/controllers/_dashboard/stats.coffee   | 11 ++++-
 .../controllers/_dashboard/stats/_base.coffee | 10 +----
 .../stats/ticket_channel_distribution.jst.eco | 42 +++++++++----------
 .../dashboard/stats/ticket_escalation.jst.eco | 22 +++++-----
 .../dashboard/stats/ticket_in_process.jst.eco | 22 +++++-----
 .../stats/ticket_load_measure.jst.eco         | 36 ++++++++--------
 .../dashboard/stats/ticket_reopen.jst.eco     | 22 +++++-----
 .../stats/ticket_waiting_time.jst.eco         | 30 +++++++------
 8 files changed, 93 insertions(+), 102 deletions(-)

diff --git a/app/assets/javascripts/app/controllers/_dashboard/stats.coffee b/app/assets/javascripts/app/controllers/_dashboard/stats.coffee
index ee23a1737..0b2581d99 100644
--- a/app/assets/javascripts/app/controllers/_dashboard/stats.coffee
+++ b/app/assets/javascripts/app/controllers/_dashboard/stats.coffee
@@ -19,8 +19,17 @@ class App.DashboardStats extends App.Controller
       for widget in widgets
         if @permissionCheck(widget.permission)
           try
+
+            el = @el.find(".column.#{widget.className}")
+            localEl = $("<div class=\"column #{widget.className}\"></div>")
+
+            if !el.get(0)
+              @el.append(localEl)
+            else
+              el.replaceWith(localEl)
+
             new widget.controller(
-              parentEl: @el
+              el: localEl
               className: widget.className
             )
             @$('.js-stat-help').tooltip()
diff --git a/app/assets/javascripts/app/controllers/_dashboard/stats/_base.coffee b/app/assets/javascripts/app/controllers/_dashboard/stats/_base.coffee
index 5beb6fcc6..f849b550d 100644
--- a/app/assets/javascripts/app/controllers/_dashboard/stats/_base.coffee
+++ b/app/assets/javascripts/app/controllers/_dashboard/stats/_base.coffee
@@ -1,12 +1,6 @@
 class App.ControllerDashboardStatsBase extends App.Controller
-  constructor: (params) ->
-    if params.parentEl
-      el = params.parentEl.find(".column.#{params.className}")
-      if !el.get(0)
-        el = $("<div class=\"column #{params.className}\"></div>")
-        params.parentEl.append(el)
-      params.el = el
-    super(params)
+  constructor: ->
+    super
     @load()
 
   load: =>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_channel_distribution.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_channel_distribution.jst.eco
index 4b713a384..6b5db8406 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_channel_distribution.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_channel_distribution.jst.eco
@@ -1,25 +1,23 @@
-<div class="column ticket_channel_distribution">
-  <div class="stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('Channel Distribution') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketChannelDistribution.description) %>" data-placement="left">
-        <%- @Icon('help') %>
-      </div>
-    </div>
-    <div class="stat-graphic" data-columns="<%- _.size(@StatsTicketChannelDistribution.channels) %>">
-      <% for id, channel of @StatsTicketChannelDistribution.channels: %>
-        <div class="stats-row">
-          <div title="<%- channel.sender %>">
-            <%- @Icon(channel.icon, 'stat-channel-icon') %>
-          </div>
-          <div class="stat-bars">
-            <div class="stat-bar stat-bar--inbound" style="height: <%- channel.inbound_in_percent %>%" title="<%- @Ti('Inbound') %>: <%- channel.inbound_in_percent %>% (<%- channel.inbound %>)"></div>
-            <div class="stat-bar stat-bar--outbound" style="height: <%- channel.outbound_in_percent %>%" title="<%- @Ti('Outbound') %>: <%- channel.outbound_in_percent %>% (<%- channel.outbound %>)"></div>
-          </div>
-          <div class="stat-detail"><%- channel.overal_percentage %>%</div>
-        </div>
-        <div class="stat-label"></div>
-      <% end %>
+<div class="stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('Channel Distribution') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketChannelDistribution.description) %>" data-placement="left">
+      <%- @Icon('help') %>
     </div>
   </div>
+  <div class="stat-graphic" data-columns="<%- _.size(@StatsTicketChannelDistribution.channels) %>">
+    <% for id, channel of @StatsTicketChannelDistribution.channels: %>
+      <div class="stats-row">
+        <div title="<%- channel.sender %>">
+          <%- @Icon(channel.icon, 'stat-channel-icon') %>
+        </div>
+        <div class="stat-bars">
+          <div class="stat-bar stat-bar--inbound" style="height: <%- channel.inbound_in_percent %>%" title="<%- @Ti('Inbound') %>: <%- channel.inbound_in_percent %>% (<%- channel.inbound %>)"></div>
+          <div class="stat-bar stat-bar--outbound" style="height: <%- channel.outbound_in_percent %>%" title="<%- @Ti('Outbound') %>: <%- channel.outbound_in_percent %>% (<%- channel.outbound %>)"></div>
+        </div>
+        <div class="stat-detail"><%- channel.overal_percentage %>%</div>
+      </div>
+      <div class="stat-label"></div>
+    <% end %>
+  </div>
 </div>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_escalation.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_escalation.jst.eco
index ae42aca64..1420431c9 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_escalation.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_escalation.jst.eco
@@ -1,15 +1,13 @@
-<div class="column ticket_escalation">
-  <div class="stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('Mood') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketEscalation.description) %>" data-placement="bottom">
-        <%- @Icon('help') %>
-      </div>
+<div class="stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('Mood') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketEscalation.description) %>" data-placement="bottom">
+      <%- @Icon('help') %>
     </div>
-    <div class="stat-graphic">
-      <%- @Icon("mood-#{@StatsTicketEscalation.state}", 'stat-icon mood-icon') %>
-    </div>
-    <div class="stat-label"><%- @T('%s of my tickets escalated.', @StatsTicketEscalation.own) %></div>
-    <div class="stat-detail"><%- @T('Total: %s', @StatsTicketEscalation.total) %></div>
   </div>
+  <div class="stat-graphic">
+    <%- @Icon("mood-#{@StatsTicketEscalation.state}", 'stat-icon mood-icon') %>
+  </div>
+  <div class="stat-label"><%- @T('%s of my tickets escalated.', @StatsTicketEscalation.own) %></div>
+  <div class="stat-detail"><%- @T('Total: %s', @StatsTicketEscalation.total) %></div>
 </div>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_in_process.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_in_process.jst.eco
index f1c82a833..a6268755b 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_in_process.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_in_process.jst.eco
@@ -1,15 +1,13 @@
-<div class="column ticket_in_process">
-  <div class="stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('Your tickets in process') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketInProcess.description) %>" data-placement="bottom">
-        <%- @Icon('help') %>
-      </div>
+<div class="stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('Your tickets in process') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketInProcess.description) %>" data-placement="bottom">
+      <%- @Icon('help') %>
     </div>
-    <div class="stat-graphic">
-      <%- @Icon('in-process', "in-process-icon #{@StatsTicketInProcess.state}-color") %>
-    </div>
-    <div class="stat-label" title="<%- @T('%s of your tickets are currently in process.', @StatsTicketInProcess.in_process) %>"><%- @T('%s% are currently in process', @StatsTicketInProcess.percent) %></div>
-    <div class="stat-detail"><%- @T('Average: %s%', @StatsTicketInProcess.average_per_agent) %></div>
   </div>
+  <div class="stat-graphic">
+    <%- @Icon('in-process', "in-process-icon #{@StatsTicketInProcess.state}-color") %>
+  </div>
+  <div class="stat-label" title="<%- @T('%s of your tickets are currently in process.', @StatsTicketInProcess.in_process) %>"><%- @T('%s% are currently in process', @StatsTicketInProcess.percent) %></div>
+  <div class="stat-detail"><%- @T('Average: %s%', @StatsTicketInProcess.average_per_agent) %></div>
 </div>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_load_measure.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_load_measure.jst.eco
index 592efae29..df346cc5d 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_load_measure.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_load_measure.jst.eco
@@ -1,22 +1,20 @@
-<div class="column ticket_load_measure">
-  <div class="stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('Assigned') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketLoadMeasure.description) %>" data-placement="bottom">
-        <%- @Icon('help') %>
-      </div>
+<div class="stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('Assigned') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketLoadMeasure.description) %>" data-placement="bottom">
+      <%- @Icon('help') %>
     </div>
-    <div class="stat-graphic">
-      <div class="stat-tickets vertical reverse end">
-        <% stack_counter = parseInt(@StatsTicketLoadMeasure.percent*0.16) %>
-        <% for count in [1..stack_counter]: %>
-          <%- @Icon('one-ticket', "one-ticket #{@StatsTicketLoadMeasure.state}-color") %>
-        <% end %>
-      </div>
-      <%- @Icon('total-tickets', 'total-tickets') %>
-    </div>
-
-    <div class="stat-label"><%- @T('Tickets assigned to me: %s of %s', @StatsTicketLoadMeasure.own, @StatsTicketLoadMeasure.total) %></div>
-    <div class="stat-detail"><%- @T('Average: %s', @StatsTicketLoadMeasure.average_per_agent) %></div>
   </div>
+  <div class="stat-graphic">
+    <div class="stat-tickets vertical reverse end">
+      <% stack_counter = parseInt(@StatsTicketLoadMeasure.percent*0.16) %>
+      <% for count in [1..stack_counter]: %>
+        <%- @Icon('one-ticket', "one-ticket #{@StatsTicketLoadMeasure.state}-color") %>
+      <% end %>
+    </div>
+    <%- @Icon('total-tickets', 'total-tickets') %>
+  </div>
+
+  <div class="stat-label"><%- @T('Tickets assigned to me: %s of %s', @StatsTicketLoadMeasure.own, @StatsTicketLoadMeasure.total) %></div>
+  <div class="stat-detail"><%- @T('Average: %s', @StatsTicketLoadMeasure.average_per_agent) %></div>
 </div>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_reopen.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_reopen.jst.eco
index 4e13354e0..2a0c1eeb5 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_reopen.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_reopen.jst.eco
@@ -1,15 +1,13 @@
-<div class="column ticket_reopen">
-  <div class="stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('Reopening rate') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketReopen.description) %>" data-placement="left">
-        <%- @Icon('help') %>
-      </div>
+<div class="stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('Reopening rate') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketReopen.description) %>" data-placement="left">
+      <%- @Icon('help') %>
     </div>
-    <div class="stat-graphic">
-      <%- @Icon('reopening', "reopening-icon #{@StatsTicketReopen.state}-color") %>
-    </div>
-    <div class="stat-label"><%- @T('%s% have been reopened', @StatsTicketReopen.percent) %></div>
-    <div class="stat-detail"><%- @T('Average: %s%', @StatsTicketReopen.average_per_agent) %></div>
   </div>
+  <div class="stat-graphic">
+    <%- @Icon('reopening', "reopening-icon #{@StatsTicketReopen.state}-color") %>
+  </div>
+  <div class="stat-label"><%- @T('%s% have been reopened', @StatsTicketReopen.percent) %></div>
+  <div class="stat-detail"><%- @T('Average: %s%', @StatsTicketReopen.average_per_agent) %></div>
 </div>
diff --git a/app/assets/javascripts/app/views/dashboard/stats/ticket_waiting_time.jst.eco b/app/assets/javascripts/app/views/dashboard/stats/ticket_waiting_time.jst.eco
index 7ef19c345..76230f199 100644
--- a/app/assets/javascripts/app/views/dashboard/stats/ticket_waiting_time.jst.eco
+++ b/app/assets/javascripts/app/views/dashboard/stats/ticket_waiting_time.jst.eco
@@ -1,19 +1,17 @@
-<div class="column ticket_waiting_time">
-  <div class="time stat-widget vertical">
-    <div class="stat-title">
-      <%- @T('∅ Waiting time today') %>
-      <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketWaitingTime.description) %>" data-placement="bottom">
-        <%- @Icon('help') %>
-      </div>
+<div class="time stat-widget vertical">
+  <div class="stat-title">
+    <%- @T('∅ Waiting time today') %>
+    <div class="stat-icon-help js-stat-help" title="<%- @Ti(@StatsTicketWaitingTime.description) %>" data-placement="bottom">
+      <%- @Icon('help') %>
     </div>
-    <div class="stat-graphic">
-      <div class="stat-stopwatch centered">
-        <%- @Icon('stopwatch', 'stat-icon stopwatch-icon') %>
-        <canvas class="stat-dial"></canvas>
-        <div class="stat-amount"></div>
-      </div>
-    </div>
-    <div class="stat-label"><%- @T('My handling time: %s minutes', @StatsTicketWaitingTime.handling_time) %></div>
-    <div class="stat-detail"><%- @T('Average: %s minutes', @StatsTicketWaitingTime.average_per_agent) %></div>
   </div>
+  <div class="stat-graphic">
+    <div class="stat-stopwatch centered">
+      <%- @Icon('stopwatch', 'stat-icon stopwatch-icon') %>
+      <canvas class="stat-dial"></canvas>
+      <div class="stat-amount"></div>
+    </div>
+  </div>
+  <div class="stat-label"><%- @T('My handling time: %s minutes', @StatsTicketWaitingTime.handling_time) %></div>
+  <div class="stat-detail"><%- @T('Average: %s minutes', @StatsTicketWaitingTime.average_per_agent) %></div>
 </div>