From 873f1f247d5d5a52f6e1af1cf0b58bfd7f779e86 Mon Sep 17 00:00:00 2001
From: Richard Lawley <richard@richardlawley.com>
Date: Thu, 13 Jun 2019 11:21:26 +0100
Subject: [PATCH] ui: Fix labels broken by translate code (#3386)

As discussed in #3385, the translation code does not work with self closing translate tags when there is other content at the same level, e.g. <div><translate key="foo"/>: Something</div> - it will remove the ": Something". This PR changes the affected tags to non-self closing, e.g. <translate key="foo"></translate>: Something

This fixes the Zone names not being displayed on the capacity graphs on the dashboard, plus some minor missing labels elsewhere.

Fixes #3385
---
 ui/index.html | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/ui/index.html b/ui/index.html
index 7556fbe9302..8645fc252c8 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -311,9 +311,9 @@
                                 <p id="from_vpc_tier">
                                     <div class="specify-ip">
                                         <label>
-                                            <translate key="label.ip.address"/>
-                                            (<translate key="label.optional"/>):
+                                            <translate key="label.ip.address" />
                                         </label>
+                                        (<label><translate key="label.optional"></translate></label>):
                                         <input type="text" name="vpc-specify-ip" />
                                     </div>
                                 </p>
@@ -431,7 +431,7 @@
                                     <!-- Name -->
                                     <div class="select odd vm-instance-name">
                                         <div class="name">
-                                            <span><translate key="label.name"/> (<translate key="label.optional"/>)</span>
+                                            <span><label><translate key="label.name" /></label> (<label><translate key="label.optional"/></label>)</span>
                                         </div>
                                         <div class="value">
                                             <input type="text" name="displayname" class="disallowSpecialCharacters" />
@@ -440,7 +440,7 @@
                                     <!-- Add to group -->
                                     <div class="select">
                                         <div class="name">
-                                            <span><translate key="label.add.to.group"/> (<translate key="label.optional"/>)</span>
+                                            <span><label><translate key="label.add.to.group"/></label> (<label><translate key="label.optional"/></label>)</span>
                                         </div>
                                         <div class="value">
                                             <input type="text" name="groupname" class="disallowSpecialCharacters" />
@@ -575,7 +575,7 @@
                                     <!-- userdata -->
                                     <div class="select">
                                         <div class="name">
-                                            <span><translate key="label.add.userdata"/> (<translate key="label.optional"/>)</span>
+                                            <span><label><translate key="label.add.userdata"/></label> (<label><translate key="label.optional"/></label>)</span>
                                         </div>
                                         <div class="value">
                                             <textarea name="userdata"></textarea>
@@ -1429,12 +1429,12 @@
 
                         <div class="selects" style="display:none;">
                             <div class="select">
-                                <label><translate key="label.zone"/>:</label>
+                                <label><translate key="label.zone"/></label>:
                                 <select>
                                 </select>
                             </div>
                             <div class="select">
-                                <label><translate key="label.pods"/>:</label>
+                                <label><translate key="label.pods"/></label>:
                                 <select>
                                 </select>
                             </div>
@@ -1495,7 +1495,7 @@
                             <table>
                                 <thead>
                                     <tr>
-                                        <th><translate key="label.latest.events"/> <div class="button view-all events"><translate key="label.view.all"/></div></th>
+                                        <th><label><translate key="label.latest.events"/></label> <div class="button view-all events"><translate key="label.view.all"/></div></th>
                                     </tr>
                                 </thead>
                             </table>
@@ -1512,7 +1512,7 @@
                             <table>
                                 <thead>
                                     <tr>
-                                        <th><translate key="label.network"/> <div class="button view-all network"><translate key="label.view.all"/></div></th>
+                                        <th><label><translate key="label.network"/></label> <div class="button view-all network"><translate key="label.view.all"/></div></th>
                                     </tr>
                                 </thead>
                             </table>
@@ -1520,13 +1520,13 @@
                                 <tbody>
                                     <tr>
                                         <td>
-                                            <div class="desc"><span><translate key="label.isolated.networks"/>:</span></div>
+                                            <div class="desc"><span><label><translate key="label.isolated.networks"/></label>:</span></div>
                                             <div class="value"><span data-item="netTotal"></span></div>
                                         </td>
                                     </tr>
                                     <tr class="odd">
                                         <td>
-                                            <div class="desc"><span><translate key="label.public.ips"/>:</span></div>
+                                            <div class="desc"><span><label><translate key="label.public.ips"/></label>:</span></div>
                                             <div class="value"><span data-item="ipTotal"></span></div>
                                         </td>
                                     </tr>