From 4893ed3ff30a99da570cc044a0a6671982da0376 Mon Sep 17 00:00:00 2001
From: Matthew Irish <matthew.irish@gmail.com>
Date: Mon, 8 Oct 2018 23:22:29 -0500
Subject: [PATCH] use new local capabilities, move secret-edit-display partial
 to a component

---
 .../components/secret-edit-display.hbs        | 51 ++++++++++++
 ui/app/templates/components/secret-edit.hbs   | 31 ++++---
 .../partials/secret-edit-display.hbs          | 46 -----------
 .../templates/partials/secret-form-create.hbs | 16 +++-
 .../templates/partials/secret-form-edit.hbs   | 80 ++++++-------------
 5 files changed, 111 insertions(+), 113 deletions(-)
 create mode 100644 ui/app/templates/components/secret-edit-display.hbs
 delete mode 100644 ui/app/templates/partials/secret-edit-display.hbs

diff --git a/ui/app/templates/components/secret-edit-display.hbs b/ui/app/templates/components/secret-edit-display.hbs
new file mode 100644
index 000000000..4065ce10b
--- /dev/null
+++ b/ui/app/templates/components/secret-edit-display.hbs
@@ -0,0 +1,51 @@
+  {{#if @showAdvancedMode}}
+    <JsonEditor
+      @value={{@codemirrorString}}
+      @valueUpdated={{@editActions.codemirrorUpdated}}
+      @onFocusOut={{@editActions.formatJSON}}
+    />
+  {{else}}
+    {{#each @secretData as |secret index|}}
+    <div class="info-table-row">
+        <div class="column is-one-quarter info-table-row-edit">
+          {{input
+            data-test-secret-key=true
+            value=secret.name
+            placeholder="key"
+            change="handleChange"
+            class="input"
+          }}
+        </div>
+        <div class="column info-table-row-edit">
+          <MaskedInput
+            @name={{secret.name}}
+            @onKeyDown={{@editActions.handleKeyDown}}
+            @onChange={{@editActions.handleChange}}
+            @value={{secret.value}}
+            data-test-secret-value="true"
+         /> 
+        </div>
+        <div class="column is-narrow info-table-row-edit">
+          {{#if (eq @secretData.length (inc index))}}
+            <button type="button" {{action @editActions.addRow}} class="button is-outlined is-primary" data-test-secret-add-row="true">
+              Add
+            </button>
+          {{else}}
+            <button
+              class="button has-text-grey is-expanded is-icon"
+              type="button"
+              {{action @editActions.deleteRow secret.name}}
+              aria-label="Delete row"
+            >
+              <ICon 
+                @size="22"
+                @glyph="trash-a"
+                @excludeIconClass={{true}}
+                class="is-large has-text-grey-light"
+              />
+            </button>
+          {{/if}}
+        </div>
+      </div>
+    {{/each}}
+  {{/if}}
\ No newline at end of file
diff --git a/ui/app/templates/components/secret-edit.hbs b/ui/app/templates/components/secret-edit.hbs
index 218ba3b43..18e2f0f66 100644
--- a/ui/app/templates/components/secret-edit.hbs
+++ b/ui/app/templates/components/secret-edit.hbs
@@ -19,6 +19,19 @@
       {{/if}}
     </h1>
   </p.levelLeft>
+  <p.levelRight>
+    {{#if canDelete}}
+      {{#confirm-action
+        buttonClasses="button is-compact is-ghost has-icon-right"
+        onConfirmAction=(action "deleteKey")
+        confirmMessage=(concat "Are you sure you want to delete " model.id "?")
+        cancelButtonText="Cancel"
+        data-test-secret-delete="true"
+      }}
+        Delete secret <ICon @glyph="chevron-right" @size="11" />
+      {{/confirm-action}}
+    {{/if}}
+  </p.levelRight>
 </PageHeader>
 <div class="box is-sideless has-background-grey-lighter has-slim-padding is-marginless">
   <div class="level">
@@ -39,17 +52,15 @@
           />
           <label for="json">JSON</label>
         </div>
-        {{#if (and (not-eq mode 'create') (or capabilities.canUpdate capabilities.canDelete))}}
+        {{#if (and (eq mode 'show') canEdit)}}
           <div class="control is-flex">
-            {{input
-              id="edit"
-              type="checkbox"
-              name="navToEdit"
-              class="switch is-rounded is-success is-small"
-              checked=(eq mode 'edit')
-              change=(action (nav-to-route (concat 'vault.cluster.secrets.backend.' (if (eq mode 'show') 'edit' 'show')) key.id replace=true) )
-            }}
-            <label for="edit">Edit</label>
+            <LinkTo
+              @params={{array (concat 'vault.cluster.secrets.backend.' (if (eq mode 'show') 'edit' 'show')) model.id }}
+              @replace={{true}}
+              class="link link-plain has-text-weight-semibold"
+            >
+            Edit Secret
+            </LinkTo>
           </div>
         {{/if}}
       </div>
diff --git a/ui/app/templates/partials/secret-edit-display.hbs b/ui/app/templates/partials/secret-edit-display.hbs
deleted file mode 100644
index aad4f6716..000000000
--- a/ui/app/templates/partials/secret-edit-display.hbs
+++ /dev/null
@@ -1,46 +0,0 @@
-  {{#if showAdvancedMode}}
-    {{json-editor
-      value=codemirrorString
-      valueUpdated=(action "codemirrorUpdated")
-      onFocusOut=(action "formatJSON")
-    }}
-  {{else}}
-    {{#each secretData as |secret index|}}
-    <div class="info-table-row">
-        <div class="column is-one-quarter info-table-row-edit">
-          {{input
-            data-test-secret-key=true
-            value=secret.name
-            placeholder="key"
-            change="handleChange"
-            class="input"
-          }}
-        </div>
-        <div class="column info-table-row-edit">
-          {{masked-input
-            data-test-secret-value=true
-            name=secret.name
-            onKeyDown=(action "handleKeyDown")
-            onChange=(action "handleChange")
-            value=secret.value
-          }}
-        </div>
-        <div class="column is-narrow info-table-row-edit">
-          {{#if (eq secretData.length (inc index))}}
-            <button type="button" {{action "addRow"}} class="button is-outlined is-primary" data-test-secret-add-row=true>
-              Add
-            </button>
-          {{else}}
-            <button
-              class="button has-text-grey is-expanded is-icon"
-              type="button"
-              {{action "deleteRow" secret.name}}
-              aria-label="Delete row"
-            >
-              {{i-con size=22 glyph='trash-a' excludeIconClass=true class="is-large has-text-grey-light"}}
-            </button>
-          {{/if}}
-        </div>
-      </div>
-    {{/each}}
-  {{/if}}
\ No newline at end of file
diff --git a/ui/app/templates/partials/secret-form-create.hbs b/ui/app/templates/partials/secret-form-create.hbs
index 1eef75afa..0b699251b 100644
--- a/ui/app/templates/partials/secret-form-create.hbs
+++ b/ui/app/templates/partials/secret-form-create.hbs
@@ -12,9 +12,19 @@
       </p>
     {{/if}}
   </div>
-
-  {{partial "partials/secret-edit-display"}}
-
+  <SecretEditDisplay
+    @showAdvancedMode={{showAdvancedMode}}
+    @codemirrorString={{codemirrorString}}
+    @secretData={{secretData}}
+    @editActions={{hash
+      codemirrorUpdated=(action "codemirrorUpdated")
+      formatJSON=(action "formatJSON")
+      handleKeyDown=(action "handleKeyDown")
+      handleChange=(action "handleChange")
+      deleteRow=(action "deleteRow")
+      addRow=(action "addRow")
+    }}
+  />
   <div class="field is-grouped box is-fullwidth is-bottomless">
     <div class="control">
       <button
diff --git a/ui/app/templates/partials/secret-form-edit.hbs b/ui/app/templates/partials/secret-form-edit.hbs
index 5b1495fb4..0a5743202 100644
--- a/ui/app/templates/partials/secret-form-edit.hbs
+++ b/ui/app/templates/partials/secret-form-edit.hbs
@@ -1,6 +1,6 @@
-<form onsubmit={{action "createOrUpdateKey" "update"}} onchange={{action "handleChange"}}>
+<form onsubmit={{action "createOrUpdateKey" "update"}}>
   <div class="box is-sideless is-fullwidth is-marginless">
-    {{message-error model=key errorMessage=error}}
+    <MessageError @model={{model}} @errorMessage={{error}} />
     <NamespaceReminder @mode="edit" @noun="secret" />
     {{#unless showAdvancedMode}}
       <div class="table info-table-row-header">
@@ -15,67 +15,39 @@
       </div>
     {{/unless}}
   </div>
-  {{#if capabilities.canUpdate}}
-    {{partial "partials/secret-edit-display"}}
-  {{else}}
-    <div class="field is-horizontal box is-sideless is-marginless">
-      <div class="content">
-        <p>Your current token does not have capabilities to update this secret.</p>
-        <p>
-          {{#secret-link
-            mode=(if key.isFolder "list" "show")
-            secret=key.id
-            class="button"
-          }}
-          Back to <code>{{key.id}}</code>
-          {{/secret-link}}
-        </p>
-      </div>
-    </div>
-  {{/if}}
-
+  <SecretEditDisplay
+    @showAdvancedMode={{showAdvancedMode}}
+    @codemirrorString={{codemirrorString}}
+    @secretData={{secretData}}
+    @editActions={{hash
+      codemirrorUpdated=(action "codemirrorUpdated")
+      formatJSON=(action "formatJSON")
+      handleKeyDown=(action "handleKeyDown")
+      handleChange=(action "handleChange")
+      deleteRow=(action "deleteRow")
+      addRow=(action "addRow")
+    }}
+  />
   <div class="field is-grouped is-grouped-split is-fullwidth box is-bottomless">
     <div class="field is-grouped">
-      {{#unless key.isFolder}}
-        {{#if capabilities.canUpdate}}
-          <div class="control">
-            <button
-              type="submit"
-              disabled={{buttonDisabled}}
-              class="button is-primary"
-            >
-             Save
-            </button>
-          </div>
-        {{/if}}
-      {{/unless}}
+      <div class="control">
+        <button
+          type="submit"
+          disabled={{buttonDisabled}}
+          class="button is-primary"
+        >
+          Save
+        </button>
+      </div>
       <div class="control">
         {{#secret-link
-          mode=(if key.isFolder "list" "show")
-          secret=key.id
+          mode="show"
+          secret=model.id
           class="button"
         }}
           Cancel
         {{/secret-link}}
       </div>
     </div>
-    {{#if capabilities.canDelete}}
-      {{#confirm-action
-        buttonClasses="button"
-        onConfirmAction=(action "deleteKey")
-        confirmMessage=(if key.isFolder
-          (concat "Are you sure you want to delete " key.id " and all its contents?")
-          (concat "Are you sure you want to delete " key.id "?")
-        )
-        cancelButtonText="Cancel"
-        data-test-secret-delete="true"
-      }}
-        {{#if key.isFolder}}
-          Delete folder
-        {{else}}
-          Delete secret
-        {{/if}}
-      {{/confirm-action}}
-    {{/if}}
   </div>
 </form>