From 1b8627c0988d18eaad0d5c4285acab5fa7b8dad4 Mon Sep 17 00:00:00 2001
From: Ivan Kolodyazhny <e0ne@e0ne.info>
Date: Tue, 15 Sep 2020 11:07:38 +0000
Subject: [PATCH] Set unique identifier for Django messages

Messages details template should have unique IDs to get
collapse/expand working.

Change-Id: Ia9ff81694fc7a84417ea2c998721475332a7e772
Closes: Bug #1895570
---
 horizon/karma.conf.js                         |  1 +
 horizon/static/framework/util/uuid/uuid.js    | 15 ++---------
 horizon/static/horizon/js/horizon.messages.js |  2 ++
 horizon/static/horizon/js/horizon.uuid.js     | 27 +++++++++++++++++++
 horizon/templates/horizon/_messages.html      |  6 ++---
 .../horizon/client_side/_alert_message.html   |  4 +--
 .../templates/horizon/_scripts.html           |  1 +
 7 files changed, 38 insertions(+), 18 deletions(-)
 create mode 100644 horizon/static/horizon/js/horizon.uuid.js

diff --git a/horizon/karma.conf.js b/horizon/karma.conf.js
index f05dc11f97..91b80f86c3 100644
--- a/horizon/karma.conf.js
+++ b/horizon/karma.conf.js
@@ -81,6 +81,7 @@ module.exports = function (config) {
 
       // from jasmine_tests.py; only those that are deps for others
       'horizon/js/horizon.js',
+      'horizon/js/horizon.uuid.js',
 
       /**
        * First, list all the files that defines application's angular modules.
diff --git a/horizon/static/framework/util/uuid/uuid.js b/horizon/static/framework/util/uuid/uuid.js
index a728934f59..569349e847 100644
--- a/horizon/static/framework/util/uuid/uuid.js
+++ b/horizon/static/framework/util/uuid/uuid.js
@@ -27,19 +27,8 @@
    * have unique IDs for interactions.
    */
   function uuidService() {
-    var service = {
-      generate: generate
+    return {
+      generate: horizon.uuid.generate
     };
-    return service;
-
-    function generate() {
-      var d = new Date().getTime();
-      var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
-        var r = (d + Math.random() * 16) % 16 | 0;
-        d = Math.floor(d / 16);
-        return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
-      });
-      return uuid;
-    }
   }
 })();
diff --git a/horizon/static/horizon/js/horizon.messages.js b/horizon/static/horizon/js/horizon.messages.js
index 33cb8f4cad..94d654efe2 100644
--- a/horizon/static/horizon/js/horizon.messages.js
+++ b/horizon/static/horizon/js/horizon.messages.js
@@ -39,9 +39,11 @@ horizon.alert = function (type, message, extra_tags, details) {
     return str.split('\u2026');
   }
 
+  var id = horizon.uuid.generate();
   var template = horizon.templates.compiled_templates["#alert_message_template"],
     params = {
       "type": type || 'default',
+      "id": id,
       "type_display": type_display,
       "message": message,
       "safe": safe,
diff --git a/horizon/static/horizon/js/horizon.uuid.js b/horizon/static/horizon/js/horizon.uuid.js
new file mode 100644
index 0000000000..53a6b732dc
--- /dev/null
+++ b/horizon/static/horizon/js/horizon.uuid.js
@@ -0,0 +1,27 @@
+/**
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License. You may obtain
+ * a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ */
+
+horizon.uuid = {
+
+  generate: function() {
+    var d = new Date().getTime();
+    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
+      var r = (d + Math.random() * 16) % 16 | 0;
+      d = Math.floor(d / 16);
+      return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
+    });
+    return uuid;
+  }
+};
+
diff --git a/horizon/templates/horizon/_messages.html b/horizon/templates/horizon/_messages.html
index 7d19a48a21..e189253965 100644
--- a/horizon/templates/horizon/_messages.html
+++ b/horizon/templates/horizon/_messages.html
@@ -35,9 +35,9 @@
         {% with message.message|split_message as messages %}
         <strong>{% trans "Error: " %}</strong>{{ messages|first }}
           {% if messages|length > 1 %}
-            <a href="#message_details"  data-toggle="collapse"
-            data-target="#message_details">Details</a>
-            <div id="message_details" class="collapse">
+            <a href="#message_details" data-toggle="collapse"
+             data-target="#message_details_{{ forloop.counter }}">Details</a>
+            <div id="message_details_{{ forloop.counter }}" class="collapse">
               {{ messages|last }}
             </div>
           {% endif %}
diff --git a/horizon/templates/horizon/client_side/_alert_message.html b/horizon/templates/horizon/client_side/_alert_message.html
index cc28637186..c5a28349c7 100644
--- a/horizon/templates/horizon/client_side/_alert_message.html
+++ b/horizon/templates/horizon/client_side/_alert_message.html
@@ -16,8 +16,8 @@
     [[^safe]]
       [[message]]
       <a id="details_link" href="#message_details"  data-toggle="collapse"
-         data-target="#message_details">Details</a>
-      <div id="message_details" class="collapse">
+         data-target="#message_details_[[id]]">Details</a>
+      <div id="message_details_[[id]]" class="collapse">
       [[details]]
       </div>
     [[/safe]]
diff --git a/openstack_dashboard/templates/horizon/_scripts.html b/openstack_dashboard/templates/horizon/_scripts.html
index 7e56f029f6..a400a2eaba 100644
--- a/openstack_dashboard/templates/horizon/_scripts.html
+++ b/openstack_dashboard/templates/horizon/_scripts.html
@@ -28,6 +28,7 @@
 <script src='{{ STATIC_URL }}horizon/js/horizon.messages.js'></script>
 <script src='{{ STATIC_URL }}horizon/js/horizon.modals.js'></script>
 <script src='{{ STATIC_URL }}horizon/js/horizon.hacks.js'></script>
+<script src='{{ STATIC_URL }}horizon/js/horizon.uuid.js'></script>
 <script type="text/javascript">
   horizon.modals.MODAL_BACKDROP = "{% firstof HORIZON_CONFIG.modal_backdrop 'static' %}";
 </script>