From b6852b5e30595edc4b251fe3933960ed55bde9d6 Mon Sep 17 00:00:00 2001
From: Rex Wang <109048808+RexWangPT@users.noreply.github.com>
Date: Wed, 10 Aug 2022 09:07:20 +0800
Subject: [PATCH] fix(UI) registry page improvement EE-2705 (#7424)

* EE-2705 bug fix

* EE-2705 hide auth switch for gitlab
---
 .../registry-form-ecr.html                    | 40 ++++++-------
 .../registry-form-gitlab.html                 |  4 +-
 .../views/registries/edit/registry.html       | 56 +++++++++++--------
 .../registries/edit/registryController.js     |  2 +
 4 files changed, 56 insertions(+), 46 deletions(-)

diff --git a/app/portainer/components/forms/registry-form-aws-ecr/registry-form-ecr.html b/app/portainer/components/forms/registry-form-aws-ecr/registry-form-ecr.html
index 56bbed029..d471c6d2e 100644
--- a/app/portainer/components/forms/registry-form-aws-ecr/registry-form-ecr.html
+++ b/app/portainer/components/forms/registry-form-aws-ecr/registry-form-ecr.html
@@ -116,30 +116,30 @@
       </div>
     </div>
     <!-- !aws-secret-access-key -->
-  </div>
 
-  <!-- region -->
-  <div class="form-group">
-    <label for="registry_region" class="col-sm-3 col-lg-2 control-label text-left required">Region</label>
-    <div class="col-sm-9 col-lg-10">
-      <input type="text" class="form-control" id="registry_region" name="registry_region" placeholder="us-west-1" ng-model="$ctrl.model.Ecr.Region" required />
-    </div>
-  </div>
-  <div class="form-group" ng-show="$ctrl.registryFormEcr.registry_region.$invalid">
-    <div class="col-sm-12 small text-warning">
-      <div ng-messages="$ctrl.registryFormEcr.registry_region.$error">
-        <p ng-message="required" class="vertical-center">
-          <pr-icon icon="'alert-triangle'" feather="true"></pr-icon>
-          This field is required.
-        </p>
-        <p ng-message="used" class="vertical-center">
-          <pr-icon icon="'alert-triangle'" feather="true"></pr-icon>
-          A registry with the same name already exists.
-        </p>
+    <!-- region -->
+    <div class="form-group">
+      <label for="registry_region" class="col-sm-3 col-lg-2 control-label text-left required">Region</label>
+      <div class="col-sm-9 col-lg-10">
+        <input type="text" class="form-control" id="registry_region" name="registry_region" placeholder="us-west-1" ng-model="$ctrl.model.Ecr.Region" required />
       </div>
     </div>
+    <div class="form-group" ng-show="$ctrl.registryFormEcr.registry_region.$invalid">
+      <div class="col-sm-12 small text-warning">
+        <div ng-messages="$ctrl.registryFormEcr.registry_region.$error">
+          <p ng-message="required" class="vertical-center">
+            <pr-icon icon="'alert-triangle'" feather="true"></pr-icon>
+            This field is required.
+          </p>
+          <p ng-message="used" class="vertical-center">
+            <pr-icon icon="'alert-triangle'" feather="true"></pr-icon>
+            A registry with the same name already exists.
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- !region -->
   </div>
-  <!-- !region -->
 
   <!-- actions -->
   <div class="col-sm-12 form-section-title"> Actions </div>
diff --git a/app/portainer/components/forms/registry-form-gitlab/registry-form-gitlab.html b/app/portainer/components/forms/registry-form-gitlab/registry-form-gitlab.html
index 018ad00c6..0fa23ab5f 100644
--- a/app/portainer/components/forms/registry-form-gitlab/registry-form-gitlab.html
+++ b/app/portainer/components/forms/registry-form-gitlab/registry-form-gitlab.html
@@ -61,7 +61,7 @@
 
   <!-- url-input -->
   <div class="form-group" ng-if="$ctrl.state.overrideConfiguration">
-    <label for="instance_url" class="col-sm-3 col-lg-2 control-label text-left">
+    <label for="instance_url" class="col-sm-3 col-lg-2 control-label text-left required">
       Instance URL
       <portainer-tooltip message="'URL of Gitlab instance.'"></portainer-tooltip>
     </label>
@@ -82,7 +82,7 @@
   <!-- !url-input -->
   <!-- url-input -->
   <div class="form-group" ng-if="$ctrl.state.overrideConfiguration">
-    <label for="registry_url" class="col-sm-3 col-lg-2 control-label text-left">
+    <label for="registry_url" class="col-sm-3 col-lg-2 control-label text-left required">
       Registry URL
       <portainer-tooltip message="'URL of Gitlab registry instance.'"></portainer-tooltip>
     </label>
diff --git a/app/portainer/views/registries/edit/registry.html b/app/portainer/views/registries/edit/registry.html
index bd6738ffd..6e454febb 100644
--- a/app/portainer/views/registries/edit/registry.html
+++ b/app/portainer/views/registries/edit/registry.html
@@ -119,7 +119,8 @@
               $ctrl.registry.Type !== $ctrl.RegistryTypes.DOCKERHUB &&
               $ctrl.registry.Type !== $ctrl.RegistryTypes.QUAY &&
               $ctrl.registry.Type !== $ctrl.RegistryTypes.PROGET &&
-              $ctrl.registry.Type !== $ctrl.RegistryTypes.AZURE
+              $ctrl.registry.Type !== $ctrl.RegistryTypes.AZURE &&
+              $ctrl.registry.Type !== $ctrl.RegistryTypes.GITLAB
             "
           >
             <label for="registry_auth" class="col-sm-3 col-lg-2 control-label text-left">
@@ -156,11 +157,19 @@
             <!-- !credentials-user -->
             <!-- credentials-password -->
             <div class="form-group">
-              <label for="credentials_password" class="col-sm-3 col-lg-2 control-label text-left required">
+              <label for="credentials_password" class="col-sm-3 col-lg-2 control-label text-left">
                 {{ $ctrl.passwordLabel() }}
               </label>
               <div class="col-sm-9 col-lg-10">
-                <input type="password" class="form-control" id="credentials_password" name="credentials_password" ng-model="$ctrl.Password" autocomplete="off" required />
+                <input
+                  type="password"
+                  class="form-control"
+                  id="credentials_password"
+                  name="credentials_password"
+                  placeholder="*******"
+                  ng-model="$ctrl.Password"
+                  autocomplete="off"
+                />
               </div>
             </div>
             <div class="form-group" ng-show="editRegistry.credentials_password.$invalid">
@@ -173,6 +182,26 @@
                 </div>
               </div>
             </div>
+            <!-- region -->
+            <div ng-if="$ctrl.registry.Type == $ctrl.RegistryTypes.ECR">
+              <div class="form-group">
+                <label for="registry_region" class="col-sm-3 col-lg-2 control-label text-left required">Region</label>
+                <div class="col-sm-9 col-lg-10">
+                  <input type="text" class="form-control" id="registry_region" name="registry_region" ng-model="$ctrl.registry.Ecr.Region" placeholder="us-west-1" required />
+                </div>
+              </div>
+              <div class="form-group" ng-show="editRegistry.registry_region.$invalid">
+                <div class="col-sm-12 small text-warning">
+                  <div ng-messages="editRegistry.registry_region.$error">
+                    <p ng-message="required" class="vertical-center">
+                      <pr-icon icon="'alert-triangle'" mode="'warning'" feather="true"></pr-icon>
+                      This field is required.
+                    </p>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- !region -->
             <!-- !credentials-password -->
           </div>
           <!-- !authentication-credentials -->
@@ -212,27 +241,6 @@
             </div>
           </div>
 
-          <div ng-if="$ctrl.registry.Type == $ctrl.RegistryTypes.ECR">
-            <!-- region -->
-            <div class="form-group">
-              <label for="registry_region" class="col-sm-3 col-lg-2 control-label text-left required">Region</label>
-              <div class="col-sm-9 col-lg-10">
-                <input type="text" class="form-control" id="registry_region" name="registry_region" ng-model="$ctrl.registry.Ecr.Region" placeholder="us-west-1" required />
-              </div>
-            </div>
-            <div class="form-group" ng-show="editRegistry.registry_region.$invalid">
-              <div class="col-sm-12 small text-warning">
-                <div ng-messages="editRegistry.registry_region.$error">
-                  <p ng-message="required" class="vertical-center">
-                    <pr-icon icon="'alert-triangle'" mode="'warning'" feather="true"></pr-icon>
-                    This field is required.
-                  </p>
-                </div>
-              </div>
-            </div>
-            <!-- !region -->
-          </div>
-
           <div class="form-group">
             <div class="col-sm-12">
               <button
diff --git a/app/portainer/views/registries/edit/registryController.js b/app/portainer/views/registries/edit/registryController.js
index 842929f96..a4b1408fa 100644
--- a/app/portainer/views/registries/edit/registryController.js
+++ b/app/portainer/views/registries/edit/registryController.js
@@ -39,6 +39,8 @@ export default class RegistryController {
         return 'AWS Secret Access Key';
       case RegistryTypes.DOCKERHUB:
         return 'Access token';
+      case RegistryTypes.GITLAB:
+        return 'Personal Access Token';
       default:
         return 'Password';
     }