From 57edc4ff81fa9c1a4802301eef83702c8dec0457 Mon Sep 17 00:00:00 2001
From: Jordan Reimer <zofskeez@gmail.com>
Date: Thu, 21 Apr 2022 07:44:06 -0600
Subject: [PATCH] updates LinkTo disabled attributes to args and fixes toolbar
 secret link disabled styling (#15106)

---
 ui/app/styles/components/toolbar.scss           |  9 +++++++++
 ui/app/templates/components/cluster-info.hbs    |  6 +++---
 .../components/keymgmt/provider-edit.hbs        |  2 +-
 .../components/secret-create-or-update.hbs      |  2 +-
 ui/app/templates/components/secret-link.hbs     |  1 +
 .../components/toolbar-secret-link.hbs          |  1 +
 ui/app/templates/vault/cluster/init.hbs         |  2 +-
 .../codemods/transform-deprecated-args.js       | 17 ++++++++++++++---
 8 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/ui/app/styles/components/toolbar.scss b/ui/app/styles/components/toolbar.scss
index 4835e265ce..2f53edd8ed 100644
--- a/ui/app/styles/components/toolbar.scss
+++ b/ui/app/styles/components/toolbar.scss
@@ -111,6 +111,15 @@
     }
   }
 }
+a.disabled.toolbar-link {
+  color: $black;
+  background-color: $white;
+  cursor: not-allowed;
+  &:hover {
+    background-color: $ui-gray-100;
+    color: $blue;
+  }
+}
 
 .toolbar-separator {
   border-right: $light-border;
diff --git a/ui/app/templates/components/cluster-info.hbs b/ui/app/templates/components/cluster-info.hbs
index deacf7d6f9..2e059b538f 100644
--- a/ui/app/templates/components/cluster-info.hbs
+++ b/ui/app/templates/components/cluster-info.hbs
@@ -11,7 +11,7 @@
                   <li>
                     <LinkTo
                       @route="vault.cluster.replication-dr-promote.details"
-                      disabled={{not this.auth.currentToken}}
+                      @disabled={{not this.auth.currentToken}}
                       {{on "click" @onLinkClick}}
                     >
                       <ReplicationModeSummary @mode="dr" @display="menu" @cluster={{@cluster}} />
@@ -32,7 +32,7 @@
                     <LinkTo
                       @route="vault.cluster.replication.mode.index"
                       @model="dr"
-                      disabled={{not this.auth.currentToken}}
+                      @disabled={{not this.auth.currentToken}}
                       {{on "click" @onLinkClick}}
                     >
                       <ReplicationModeSummary @mode="dr" @display="menu" @cluster={{@cluster}} />
@@ -43,7 +43,7 @@
                       <LinkTo
                         @route="vault.cluster.replication.mode.index"
                         @model="performance"
-                        disabled={{not this.auth.currentToken}}
+                        @disabled={{not this.auth.currentToken}}
                         {{on "click" @onLinkClick}}
                       >
                         <ReplicationModeSummary @mode="performance" @display="menu" @cluster={{@cluster}} @tagName="span" />
diff --git a/ui/app/templates/components/keymgmt/provider-edit.hbs b/ui/app/templates/components/keymgmt/provider-edit.hbs
index 0beee9ce98..bc3c2f83b3 100644
--- a/ui/app/templates/components/keymgmt/provider-edit.hbs
+++ b/ui/app/templates/components/keymgmt/provider-edit.hbs
@@ -154,7 +154,7 @@
             @title="No keys for this provider"
             @message="Keys for this provider will be listed here. Add a key to get started."
           >
-            <SecretLink @mode="create" @secret="" @queryParams={{query-params itemType="key"}} @class="link">
+            <SecretLink @mode="create" @secret="" @queryParams={{query-params itemType="key"}} class="link">
               Create key
             </SecretLink>
           </EmptyState>
diff --git a/ui/app/templates/components/secret-create-or-update.hbs b/ui/app/templates/components/secret-create-or-update.hbs
index cdf8878f92..14037fef28 100644
--- a/ui/app/templates/components/secret-create-or-update.hbs
+++ b/ui/app/templates/components/secret-create-or-update.hbs
@@ -251,8 +251,8 @@
           <SecretLink
             @mode="show"
             @secret={{@model.id}}
-            @class="button"
             @queryParams={{query-params version=@modelForData.version}}
+            class="button"
           >
             Cancel
           </SecretLink>
diff --git a/ui/app/templates/components/secret-link.hbs b/ui/app/templates/components/secret-link.hbs
index a261eeaec1..82ea55032b 100644
--- a/ui/app/templates/components/secret-link.hbs
+++ b/ui/app/templates/components/secret-link.hbs
@@ -2,6 +2,7 @@
   @route={{this.link.route}}
   @models={{this.link.models}}
   @query={{this.query}}
+  @disabled={{@disabled}}
   {{on "click" this.onLinkClick}}
   ...attributes
 >
diff --git a/ui/app/templates/components/toolbar-secret-link.hbs b/ui/app/templates/components/toolbar-secret-link.hbs
index bcd6f41532..8d59a0275e 100644
--- a/ui/app/templates/components/toolbar-secret-link.hbs
+++ b/ui/app/templates/components/toolbar-secret-link.hbs
@@ -3,6 +3,7 @@
   @secret={{@secret}}
   @replace={{@replace}}
   @queryParams={{@queryParams}}
+  @disabled={{@disabled}}
   class="toolbar-link"
   ...attributes
 >
diff --git a/ui/app/templates/vault/cluster/init.hbs b/ui/app/templates/vault/cluster/init.hbs
index 758ebf5af8..11c5366538 100644
--- a/ui/app/templates/vault/cluster/init.hbs
+++ b/ui/app/templates/vault/cluster/init.hbs
@@ -82,8 +82,8 @@
               <LinkTo
                 @route="vault.cluster.auth"
                 @model={{this.model.name}}
+                @disabled={{this.model.sealed}}
                 class={{concat (if this.model.sealed "is-loading " "") "button is-primary"}}
-                disabled={{this.model.sealed}}
               >
                 Continue to Authenticate
               </LinkTo>
diff --git a/ui/scripts/codemods/transform-deprecated-args.js b/ui/scripts/codemods/transform-deprecated-args.js
index e515f7f30a..a13120c566 100644
--- a/ui/scripts/codemods/transform-deprecated-args.js
+++ b/ui/scripts/codemods/transform-deprecated-args.js
@@ -14,7 +14,7 @@ module.exports = () => {
     '@name',
     '@autocomplete',
     '@spellcheck',
-    '@disabled',
+    '@disabled', // not deprecated for LinkTo
     '@class',
     '@placeholder',
     '@wrap',
@@ -26,11 +26,22 @@ module.exports = () => {
   ];
   return {
     ElementNode(node) {
-      if (['Textarea', 'Input', 'LinkTo'].includes(node.tag)) {
+      if (['Textarea', 'Input', 'LinkTo', 'ToolbarSecretLink', 'SecretLink'].includes(node.tag)) {
         const attrs = node.attributes;
         let i = 0;
         while (i < attrs.length) {
-          const arg = deprecatedArgs.find((name) => name === attrs[i].name);
+          // LinkTo uses disabled as named arg
+          // ensure that it is not present as attribute since link will still work
+          // since ToolbarSecretLink wraps SecretLink and SecretLink wraps LinkTo include them as well
+          const disabledAsArg = ['LinkTo', 'SecretLink', 'ToolbarSecretLink'].includes(node.tag);
+          if (disabledAsArg && attrs[i].name === 'disabled') {
+            attrs[i].name = '@disabled';
+          }
+          const arg = deprecatedArgs.find((name) => {
+            return node.tag.includes('SecretLink') || (node.tag === 'LinkTo' && name === '@disabled')
+              ? false
+              : name === attrs[i].name;
+          });
           if (arg) {
             attrs[i].name = arg.slice(1);
           }