From 698a91596e0a29f0a9b5805f8ff692b99759b343 Mon Sep 17 00:00:00 2001
From: Rex Wang <109048808+RexWangPT@users.noreply.github.com>
Date: Wed, 27 Jul 2022 20:22:40 +0800
Subject: [PATCH] EE-3498 update registry/endpoint registry/manage access
 (#7353)

---
 .../configs-datatable/configsDatatable.html   |  2 +-
 .../secrets-datatable/secretsDatatable.html   |  2 +-
 .../access-datatable/accessDatatable.html     | 42 ++++++++++++-------
 .../accessManagement/porAccessManagement.html | 10 ++---
 .../registriesDatatable.html                  |  2 +-
 .../registry-form-ecr.html                    |  1 +
 .../registry-form-custom.html                 |  1 +
 .../registry-form-quay.html                   |  9 +++-
 .../registry-details/registry-details.html    |  2 +-
 .../endpoints/access/endpointAccess.html      |  2 +-
 10 files changed, 45 insertions(+), 28 deletions(-)

diff --git a/app/docker/components/datatables/configs-datatable/configsDatatable.html b/app/docker/components/datatables/configs-datatable/configsDatatable.html
index 1e8f4f9a5..69b7aa4d3 100644
--- a/app/docker/components/datatables/configs-datatable/configsDatatable.html
+++ b/app/docker/components/datatables/configs-datatable/configsDatatable.html
@@ -19,7 +19,7 @@
             data-cy="config-searchInput"
           />
         </div>
-        <div class="actionBar !gap-3" ng-if="!$ctrl.offlineMode" authorization="DockerConfigDelete, DockerConfigCreate">
+        <div class="actionBar !gap-3" authorization="DockerConfigDelete, DockerConfigCreate">
           <button
             type="button"
             class="btn btn-sm btn-dangerlight h-fit vertical-center !ml-0"
diff --git a/app/docker/components/datatables/secrets-datatable/secretsDatatable.html b/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
index 0cf39be30..b478f2935 100644
--- a/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
+++ b/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
@@ -19,7 +19,7 @@
             data-cy="secret-searchInput"
           />
         </div>
-        <div class="actionBar !gap-3" ng-if="!$ctrl.offlineMode" authorization="DockerSecretDelete, DockerSecretCreate">
+        <div class="actionBar !gap-3" authorization="DockerSecretDelete, DockerSecretCreate">
           <button
             type="button"
             class="btn btn-sm btn-dangerlight h-fit vertical-center !ml-0"
diff --git a/app/portainer/components/access-datatable/accessDatatable.html b/app/portainer/components/access-datatable/accessDatatable.html
index 50ae49717..cabcfeb02 100644
--- a/app/portainer/components/access-datatable/accessDatatable.html
+++ b/app/portainer/components/access-datatable/accessDatatable.html
@@ -1,26 +1,36 @@
 <div class="datatable">
   <rd-widget>
-    <rd-widget-header icon="{{ $ctrl.titleIcon }}" title-text="{{ $ctrl.titleText }}"> </rd-widget-header>
+    <rd-widget-header icon="{{ $ctrl.titleIcon }}" feather-icon="true" title-text="{{ $ctrl.titleText }}"> </rd-widget-header>
     <rd-widget-body classes="no-padding">
       <div class="toolBar small" ng-if="$ctrl.inheritFrom">
         Access tagged as <code>inherited</code> are inherited from the group access. They cannot be removed or modified at the environment level but they can be overridden.
       </div>
       <div class="toolBar small" ng-if="$ctrl.inheritFrom"> Access tagged as <code>override</code> are overriding the group access for the related users/teams. </div>
-      <div class="actionBar">
-        <button type="button" class="btn btn-sm btn-danger" ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)">
-          <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
-        </button>
-      </div>
-      <div class="searchBar">
-        <i class="fa fa-search searchIcon" aria-hidden="true"></i>
-        <input
-          type="text"
-          class="searchInput"
-          ng-model="$ctrl.state.textFilter"
-          ng-change="$ctrl.onTextFilterChange()"
-          placeholder="Search..."
-          ng-model-options="{ debounce: 300 }"
-        />
+      <div class="toolBar vertical-center !gap-x-5 !gap-y-1 flex-wrap">
+        <div class="actionBar !gap-3">
+          <button
+            type="button"
+            class="btn btn-sm btn-dangerlight h-fit vertical-center !ml-0"
+            authorization="PortainerStackDelete"
+            ng-disabled="$ctrl.state.selectedItemCount === 0"
+            ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"
+            data-cy="access-removeButton"
+          >
+            <pr-icon icon="'trash-2'" feather="true" mode="'danger'"></pr-icon>Remove
+          </button>
+        </div>
+        <div class="searchBar vertical-center">
+          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <input
+            type="text"
+            class="searchInput"
+            ng-model="$ctrl.state.textFilter"
+            ng-change="$ctrl.onTextFilterChange()"
+            placeholder="Search..."
+            ng-model-options="{ debounce: 300 }"
+            data-cy="access-searchInput"
+          />
+        </div>
       </div>
       <div class="table-responsive">
         <table class="table table-hover nowrap-cells">
diff --git a/app/portainer/components/accessManagement/porAccessManagement.html b/app/portainer/components/accessManagement/porAccessManagement.html
index 88984f4b8..b40a8d6d2 100644
--- a/app/portainer/components/accessManagement/porAccessManagement.html
+++ b/app/portainer/components/accessManagement/porAccessManagement.html
@@ -1,13 +1,13 @@
 <div class="row">
   <div class="col-sm-12">
     <rd-widget ng-if="ctrl.availableUsersAndTeams && ctrl.accessControlledEntity">
-      <rd-widget-header icon="fa-user-lock" title-text="Create access"></rd-widget-header>
+      <rd-widget-header icon="user-check" feather-icon="true" title-text="Create access"></rd-widget-header>
       <rd-widget-body>
         <form class="form-horizontal">
           <div ng-if="ctrl.entityType !== 'registry'" class="form-group">
             <span class="col-sm-12 small text-warning">
               <p>
-                <i class="fa fa-exclamation-circle orange-icon" aria-hidden="true" style="margin-right: 2px"></i>
+                <pr-icon icon="'alert-circle'" mode="'warning'" feather="true"></pr-icon>
                 Adding user access will require the affected user(s) to logout and login for the changes to be taken into account.
               </p>
             </span>
@@ -35,13 +35,13 @@
             <div class="col-sm-12">
               <button
                 type="submit"
-                class="btn btn-primary btn-sm"
+                class="btn btn-primary btn-sm vertical-center"
                 ng-disabled="(ctrl.availableUsersAndTeams | filter:{ticked:true}).length === 0 || ctrl.actionInProgress"
                 ng-click="ctrl.authorizeAccess()"
                 button-spinner="ctrl.actionInProgress"
                 data-cy="access-createAccess"
               >
-                <span ng-hide="ctrl.state.actionInProgress"><i class="fa fa-plus" aria-hidden="true"></i> Create access</span>
+                <span ng-hide="ctrl.state.actionInProgress"><pr-icon icon="'plus'" feather="true"></pr-icon> Create access</span>
                 <span ng-show="ctrl.state.actionInProgress">Creating access...</span>
               </button>
             </div>
@@ -57,7 +57,7 @@
     <access-datatable
       ng-if="ctrl.authorizedUsersAndTeams"
       title-text="Access"
-      title-icon="fa-user-lock"
+      title-icon="user-x"
       table-key="{{ 'access_' + ctrl.entityType }}"
       order-by="Name"
       show-warning="ctrl.entityType !== 'registry'"
diff --git a/app/portainer/components/datatables/registries-datatable/registriesDatatable.html b/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
index 233661014..3eb83c846 100644
--- a/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
+++ b/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
@@ -114,7 +114,7 @@
       <div class="footer" ng-if="$ctrl.dataset">
         <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
         <div class="paginationControls">
-          <form class="form-inline">
+          <form class="form-inline vertical-center">
             <span class="limitSelector">
               <span style="margin-right: 5px"> Items per page </span>
               <select class="form-control" ng-model="$ctrl.state.paginatedItemLimit" ng-change="$ctrl.changePaginationLimit()" data-cy="component-paginationSelect">
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 2d6f6d889..0388b1fcb 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
@@ -67,6 +67,7 @@
     <div class="col-sm-12">
       <por-switch-field
         label="'Authentication'"
+        label-class="'col-sm-3 col-lg-2'"
         tooltip="'Enable this option if you need to specify credentials to connect to a private registry.'"
         name="'administrator'"
         checked="$ctrl.model.Authentication"
diff --git a/app/portainer/components/forms/registry-form-custom/registry-form-custom.html b/app/portainer/components/forms/registry-form-custom/registry-form-custom.html
index 2e77af807..c37c4fd1c 100644
--- a/app/portainer/components/forms/registry-form-custom/registry-form-custom.html
+++ b/app/portainer/components/forms/registry-form-custom/registry-form-custom.html
@@ -55,6 +55,7 @@
     <div class="col-sm-12">
       <por-switch-field
         label="'Authentication'"
+        label-class="'col-sm-3 col-lg-2'"
         tooltip="'Enable this option if you need to specify credentials to connect to this registry.'"
         name="'administrator'"
         checked="$ctrl.model.Authentication"
diff --git a/app/portainer/components/forms/registry-form-quay/registry-form-quay.html b/app/portainer/components/forms/registry-form-quay/registry-form-quay.html
index 3b583f762..313af28d4 100644
--- a/app/portainer/components/forms/registry-form-quay/registry-form-quay.html
+++ b/app/portainer/components/forms/registry-form-quay/registry-form-quay.html
@@ -59,10 +59,15 @@
   </div>
   <!-- !credentials-password -->
 
-  <!-- organisation-checkbox -->
+  <!-- organization-checkbox -->
   <div class="form-group">
     <div class="col-sm-12">
-      <por-switch-field label="'Use organisation registry'" checked="$ctrl.model.Quay.useOrganisation" on-change="($ctrl.toggleOrganisation)"></por-switch-field>
+      <por-switch-field
+        label="'Use organization registry'"
+        label-class="'col-sm-3 col-lg-2'"
+        checked="$ctrl.model.Quay.useOrganisation"
+        on-change="($ctrl.toggleOrganisation)"
+      ></por-switch-field>
     </div>
   </div>
   <!-- !organisation-checkbox -->
diff --git a/app/portainer/components/registry-details/registry-details.html b/app/portainer/components/registry-details/registry-details.html
index b67e69b03..8f870c977 100644
--- a/app/portainer/components/registry-details/registry-details.html
+++ b/app/portainer/components/registry-details/registry-details.html
@@ -1,7 +1,7 @@
 <div class="row" ng-if="$ctrl.registry">
   <div class="col-lg-12 col-md-12 col-xs-12">
     <rd-widget>
-      <rd-widget-header icon="fa-plug" title-text="Registry"></rd-widget-header>
+      <rd-widget-header icon="radio" feather-icon="true" title-text="Registry"></rd-widget-header>
       <rd-widget-body classes="no-padding">
         <table class="table">
           <tbody>
diff --git a/app/portainer/views/endpoints/access/endpointAccess.html b/app/portainer/views/endpoints/access/endpointAccess.html
index b4dacb908..739c28335 100644
--- a/app/portainer/views/endpoints/access/endpointAccess.html
+++ b/app/portainer/views/endpoints/access/endpointAccess.html
@@ -13,7 +13,7 @@
 <div class="row" ng-if="ctrl.endpoint">
   <div class="col-sm-12">
     <rd-widget>
-      <rd-widget-header icon="fa-plug" title-text="Environment"></rd-widget-header>
+      <rd-widget-header icon="hard-drive" feather-icon="true" title-text="Environment"></rd-widget-header>
       <rd-widget-body classes="no-padding">
         <table class="table">
           <tbody>