From d5a354bdaa21263be0f0b5684829f0913546c3a2 Mon Sep 17 00:00:00 2001
From: DenChaykovskiy <den.chaykovskiy@gmail.com>
Date: Fri, 12 Apr 2024 10:34:49 +0200
Subject: [PATCH] ui-gui: archive: added the show/hide input for password and
 clientSecret

---
 .../src/main/resources/messages_de.properties |  2 +-
 .../src/main/resources/messages_en.properties |  2 +-
 .../templates/productarchive-show.html        | 60 +++++++++++++++----
 3 files changed, 50 insertions(+), 14 deletions(-)

diff --git a/ui/gui/src/main/resources/messages_de.properties b/ui/gui/src/main/resources/messages_de.properties
index 4bd9923ae..5ea027ff5 100644
--- a/ui/gui/src/main/resources/messages_de.properties
+++ b/ui/gui/src/main/resources/messages_de.properties
@@ -100,9 +100,9 @@ productarchive = Produktarchiv
 productarchive-archive-type = Archiv-Typ
 productarchive-available-product-classes = Verfügbare Produktklassen
 productarchive-base-uri = Basis-URI
-productarchive-code = Code
 productarchive-client-id = Klient Id
 productarchive-client-secret = Kundengehemnis
+productarchive-code = Code
 productarchive-context = Kontext
 productarchive-name = Name
 productarchive-send-auth-in-body = Auth Im Body senden
diff --git a/ui/gui/src/main/resources/messages_en.properties b/ui/gui/src/main/resources/messages_en.properties
index 21e8b291d..2501437c6 100644
--- a/ui/gui/src/main/resources/messages_en.properties
+++ b/ui/gui/src/main/resources/messages_en.properties
@@ -100,9 +100,9 @@ productarchive = Product Archive
 productarchive-archive-type = Archive Type
 productarchive-available-product-classes = Available Product Classes
 productarchive-base-uri = Base URI
-productarchive-code = Code
 productarchive-client-id = Client Id
 productarchive-client-secret = Client Secret
+productarchive-code = Code
 productarchive-context = Context
 productarchive-name = Name
 productarchive-send-auth-in-body = Send Auth in Body
diff --git a/ui/gui/src/main/resources/templates/productarchive-show.html b/ui/gui/src/main/resources/templates/productarchive-show.html
index fab3335d5..aa9df4f9c 100644
--- a/ui/gui/src/main/resources/templates/productarchive-show.html
+++ b/ui/gui/src/main/resources/templates/productarchive-show.html
@@ -162,10 +162,10 @@ <h5>
 										<td class="cursorpointer first-row no-left-border"
 											th:onclick="'toggleProductArchive('+${productarchive.id}+')'"
 											th:text="${productarchive.id}"></td>
-										<td class="first-row" th:text="${productarchive.code}"></td>	
-										<td class="first-row" th:text="${productarchive.name}"></td>
-										<td class="first-row" th:text="${productarchive.archiveType}"></td>
-										<td class="first-row" th:text="${productarchive.baseUri}"></td>
+										<td class="first-row" th:text="${productarchive?.code}"></td>	
+										<td class="first-row" th:text="${productarchive?.name}"></td>
+										<td class="first-row" th:text="${productarchive?.archiveType}"></td>
+										<td class="first-row" th:text="${productarchive?.baseUri}"></td>
 										
 									</tr>
 								</tbody>
@@ -185,10 +185,10 @@ <h5>
 									<!-- Hidden content -->
 									<tr class="proseo-row-divider">
 										<td class="tr-rowspan">&nbsp;</td>
-										<td class="first-row" th:text="${productarchive.context}"></td>
-										<td class="first-row" th:text="${productarchive.tokenRequired}"></td>
-										<td class="first-row" th:text="${productarchive.tokenUri}"></td>
-										<td class="first-row" th:text="${productarchive.username}"></td>
+										<td class="first-row" th:text="${productarchive?.context}"></td>
+										<td class="first-row" th:text="${productarchive?.tokenRequired}"></td>
+										<td class="first-row" th:text="${productarchive?.tokenUri}"></td>
+										<td class="first-row" th:text="${productarchive?.username}"></td>
 									</tr>
 
 									<!-- More hidden table headers -->
@@ -203,10 +203,22 @@ <h5>
 									<!-- More hidden table content -->
 									<tr class="proseo-row-divider">
 										<td class="tr-rowspan">&nbsp;</td>
-										<td class="first-row" th:text="${productarchive.password}"></td>
-										<td class="first-row" th:text="${productarchive.clientId}"></td>
-										<td class="first-row" th:text="${productarchive.clientSecret}"></td>										
-										<td class="first-row" th:text="${productarchive.sendAuthInBody}"></td>
+										
+										<td class="first-row"><input th:id="'passwordinput' + ${productarchive?.id}" th:value="${productarchive?.password}" type="password" readonly></input>
+											<a class="eye" th:id="'passwordeye' + ${productarchive?.id}" th:onclick="'showHidePassword(' + ${productarchive?.id} + ')'">
+										   		<span data-feather="eye"></span>
+										   	</a>
+										</td>
+										   	
+										<td class="first-row" th:text="${productarchive?.clientId}"></td>
+										
+									    <td class="first-row"><input th:id="'clientsecretinput' + ${productarchive?.id}" th:value="${productarchive?.clientSecret}" type="password" readonly></input> 
+									  		<a class="eye" th:id="'clientsecreteye' + ${productarchive?.id}" th:onclick="'showHideClientSecret(' + ${productarchive?.id} + ')'">
+									      		<span data-feather="eye"></span>
+									     	</a>
+									    </td>
+												
+										<td class="first-row" th:text="${productarchive?.sendAuthInBody}"></td>
 									</tr>				
 
 								</tbody>
@@ -258,6 +270,30 @@ <h5>
 		var name = null;
 		var archiveType = null;
 		
+		function showHideClientSecret(id) {
+		      if (document.getElementById('clientsecretinput' + id).type == 'password' ) { 
+		          document.getElementById('clientsecretinput' + id).type = 'text';
+		          document.getElementById('clientsecreteye' + id).innerHTML = '<span data-feather="eye-off"></span>';
+		          feather.replace();
+		      } else {
+			      document.getElementById('clientsecretinput' + id).type = 'password';
+		          document.getElementById('clientsecreteye' + id).innerHTML = '<span data-feather="eye"></span>';
+		          feather.replace();
+		      }
+	    };
+	    
+	    function showHidePassword(id) {
+	        if (document.getElementById('passwordinput' + id).type == 'password' ) { 
+	            document.getElementById('passwordinput' + id).type = 'text';
+	            document.getElementById('passwordeye' + id).innerHTML = '<span data-feather="eye-off"></span>';
+	            feather.replace();
+	        } else {
+	            document.getElementById('passwordinput' + id).type = 'password';
+	            document.getElementById('passwordeye' + id).innerHTML = '<span data-feather="eye"></span>';
+	            feather.replace();
+	        }
+	    };
+		
 		// Function to fetch objects from the REST controller
 		function updateTable(newPage) {
 			currentPage = newPage;