From 5518bd5f94c6e3821974e447ae7754e76e350211 Mon Sep 17 00:00:00 2001
From: maxsva <110593497+maxsva@users.noreply.github.com>
Date: Tue, 12 Mar 2024 17:06:41 +0100
Subject: [PATCH] fix new environment param create (#204)

Co-authored-by: Maksym Veres <Maksym.Veres@sva.de>
---
 .../edit-environment.component.html           | 131 +++++++++++++-----
 1 file changed, 96 insertions(+), 35 deletions(-)

diff --git a/src/app/configuration/environments/edit-environment/edit-environment.component.html b/src/app/configuration/environments/edit-environment/edit-environment.component.html
index 86504d85..c6feb4d0 100644
--- a/src/app/configuration/environments/edit-environment/edit-environment.component.html
+++ b/src/app/configuration/environments/edit-environment/edit-environment.component.html
@@ -346,38 +346,58 @@ <h4>Basic Information</h4>
         </tr>
       </thead>
       <tbody>
-        <tr>
-          <td>Display Name</td>
-          <td *ngIf="env.display_name == uneditedEnv.display_name">{{ env.display_name }}</td>
-          <td *ngIf="env.display_name != uneditedEnv.display_name">
-            <span class="del-elem arrow-after">{{ uneditedEnv.display_name }}</span > 
-            <span class="add-elem">{{ env.display_name }}</span >     
-          </td>     
-        </tr>
-        <tr>
-          <td>DNS Suffix</td>
-          <td *ngIf="env.dnssuffix == uneditedEnv.dnssuffix">{{ env.dnssuffix }}</td>
-          <td *ngIf="env.dnssuffix != uneditedEnv.dnssuffix">
-            <span class="del-elem arrow-after">{{ uneditedEnv.dnssuffix }}</span > 
-            <span class="add-elem">{{ env.dnssuffix }}</span >  
-          </td>          
-        </tr>
-        <tr>
-          <td>Provider</td>
-          <td *ngIf="env.provider == uneditedEnv.provider">{{ env.provider }}</td>
-          <td *ngIf="env.provider != uneditedEnv.provider">
-            <span class="del-elem arrow-after">{{ uneditedEnv.provider }}</span > 
-            <span class="add-elem">{{ env.provider }}</span >
-          </td>
-        </tr>
-        <tr>
-          <td>Websocket Endpoint</td>
-          <td *ngIf="env.ws_endpoint == uneditedEnv.ws_endpoint">{{ env.ws_endpoint }}</td>
-          <td *ngIf="env.ws_endpoint != uneditedEnv.ws_endpoint">
-            <span class="del-elem arrow-after">{{ uneditedEnv.ws_endpoint }}</span > 
-            <span class="add-elem">{{ env.ws_endpoint }}</span >
-          </td>          
-        </tr>
+        <ng-container *ngIf="!!updateEnv; else newTemplate">
+          <tr>
+            <td>Display Name</td>
+            <td *ngIf="env.display_name == uneditedEnv.display_name">{{ env.display_name }}</td>
+            <td *ngIf="env.display_name != uneditedEnv.display_name">
+              <span class="del-elem arrow-after">{{ uneditedEnv.display_name }}</span > 
+              <span class="add-elem">{{ env.display_name }}</span >     
+            </td>     
+          </tr>
+          <tr>
+            <td>DNS Suffix</td>
+            <td *ngIf="env.dnssuffix == uneditedEnv.dnssuffix">{{ env.dnssuffix }}</td>
+            <td *ngIf="env.dnssuffix != uneditedEnv.dnssuffix">
+              <span class="del-elem arrow-after">{{ uneditedEnv.dnssuffix }}</span > 
+              <span class="add-elem">{{ env.dnssuffix }}</span >  
+            </td>          
+          </tr>
+          <tr>
+            <td>Provider</td>
+            <td *ngIf="env.provider == uneditedEnv.provider">{{ env.provider }}</td>
+            <td *ngIf="env.provider != uneditedEnv.provider">
+              <span class="del-elem arrow-after">{{ uneditedEnv.provider }}</span > 
+              <span class="add-elem">{{ env.provider }}</span >
+            </td>
+          </tr>
+          <tr>
+            <td>Websocket Endpoint</td>
+            <td *ngIf="env.ws_endpoint == uneditedEnv.ws_endpoint">{{ env.ws_endpoint }}</td>
+            <td *ngIf="env.ws_endpoint != uneditedEnv.ws_endpoint">
+              <span class="del-elem arrow-after">{{ uneditedEnv.ws_endpoint }}</span > 
+              <span class="add-elem">{{ env.ws_endpoint }}</span >
+            </td>          
+          </tr>
+        </ng-container>
+        <ng-template #newTemplate>
+          <tr>
+            <td>Display Name</td>
+            <td>{{ env.display_name }}</td>
+          </tr>
+          <tr>
+            <td>DNS Suffix</td>
+            <td>{{ env.dnssuffix }}</td>
+          </tr>
+          <tr>
+            <td>Provider</td>
+            <td>{{ env.provider }}</td>
+          </tr>
+          <tr>
+            <td>Websocket Endpoint</td>
+            <td>{{ env.ws_endpoint }}</td>
+          </tr>              
+        </ng-template> 
       </tbody>
     </table>
 
@@ -390,6 +410,7 @@ <h4>Environment Specifics</h4>
         </tr>
       </thead>
       <tbody>
+        <ng-container *ngIf="!!updateEnv; else newTemplate">
         <tr *ngFor="let item of env.environment_specifics | keyvalue">         
           <!-- view of unedit value -->
           <td *ngIf="uneditedEnv.environment_specifics.hasOwnProperty(item.key)">{{ item.key }}</td>
@@ -411,7 +432,14 @@ <h4>Environment Specifics</h4>
             <td class="del-elem">{{ item.key }}</td>       
             <td class="del-elem">{{ item.value }}</td >  
           </ng-container> 
-        </tr>
+        </tr></ng-container>
+        <ng-template #newTemplate>
+          <tr *ngFor="let item of env.environment_specifics | keyvalue">
+            <td>{{ item.key }}</td>
+            <td>{{ item.value }}</td>      
+          </tr>                 
+        </ng-template> 
+
       </tbody>
     </table>
 
@@ -425,7 +453,8 @@ <h4>Template Mappings</h4>
         </tr>
       </thead>
       <tbody>
-        <tr *ngFor="let template of env.template_mapping | keyvalue">         
+        <ng-container *ngIf="!!updateEnv; else newTemplate">
+          <tr *ngFor="let template of env.template_mapping | keyvalue">         
           <ng-container *ngIf="!isVMTemplateInUneditedEnv(template.key); else templateCountInUneditedEnv">
             <td class="add-elem">{{ getVirtualMachineTemplateName(template.key) }}</td>
             <td class="add-elem">{{ getTemplateCount(template.key) }}</td>          
@@ -481,6 +510,30 @@ <h4>Template Mappings</h4>
             </table>
           </td>
         </tr>
+        </ng-container>
+        <ng-template #newTemplate>
+          <tr *ngFor="let template of env.template_mapping | keyvalue">
+            <td>{{ template.key }}</td>
+            <td>{{ getTemplateCount(template.key) }}</td>
+            <td>
+              <table class="table table-compact">
+                <thead>
+                  <tr>
+                    <th>Key</th>
+                    <th>Value</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr *ngFor="let item of template.value | keyvalue">
+                    <td>{{ item.key }}</td>
+                    <td>{{ item.value }}</td>
+                  </tr>  
+                </tbody>
+              </table>
+            </td>
+          </tr>               
+        </ng-template> 
+
       </tbody>
     </table>
 
@@ -493,7 +546,8 @@ <h4>IP Mappings</h4>
         </tr>
       </thead>
       <tbody>
-        <tr *ngFor="let item of env.ip_translation_map | keyvalue">         
+        <ng-container *ngIf="!!updateEnv; else newTemplate">
+          <tr *ngFor="let item of env.ip_translation_map | keyvalue">         
           <!-- view of unedit value -->
           <td *ngIf="uneditedEnv.ip_translation_map.hasOwnProperty(item.key)">{{ item.key }}</td>
           <td *ngIf="item.value == uneditedEnv.ip_translation_map[item.key]">{{ item.value }}</td>  
@@ -515,6 +569,13 @@ <h4>IP Mappings</h4>
             <td class="del-elem">{{ item.value }}</td > 
           </ng-container>            
         </tr>
+        </ng-container>
+        <ng-template #newTemplate>
+          <tr *ngFor="let item of env.ip_translation_map | keyvalue">
+            <td>{{ item.key }}</td>
+            <td>{{ item.value }}</td>
+          </tr>              
+        </ng-template> 
       </tbody>
     </table>
   </clr-wizard-page>