refactor secrets into environment var from

2018-03-20 16:22:06 -07:00 · 2018-03-20 16:22:06 -07:00 · c1d5d65d47
parent 862c98619d
commit c1d5d65d47
6 changed files with 167 additions and 129 deletions
--- a/app/components/form-secrets-row/component.js
+++ b/app/components/form-secrets-row/component.js
@ -2,23 +2,32 @@ import Component from '@ember/component';
 import layout from './template';
 import { get, set, computed } from '@ember/object';

+const SOURCES = [
+  {id: 'configMap', label: 'Config Map', disabled: true},
+  {id: 'field', label: 'Field', disabled: true},
+  {id: 'resource', label: 'Resource', disabled: true},
+  {id: 'secret', label: 'Secret', disabled: false}
+];
+
 export default Component.extend({
  layout,
-  tagName: 'tr',
-  secrets: null,
+  tagName:       'tr',
+  secrets:       null,
+  secret:        null,
+  usePrefix:     false,
+  editing:       true,
+  disableTarget: true,
+  sources:       SOURCES,
+
  allSecrets: computed('secrets.@each.{sourceName}', function() {
    return get(this, 'secrets').map(s => { return {id: get(s, 'name'), label: get(s, 'name')} }).sortBy('label');
  }),
-  secret: null,
-  usePrefix: false,
-  editing: true,
-  disableTarget: true,
  secretSet: computed('secret.sourceName', function() {
    return get(this, 'secret.sourceName') ? false : true;
  }),

  prefixOrTarget: computed('sourceKey', {
-    get(key) {
+    get(/* key */) {
      if (get(this, 'sourceKey') === 'prefix') {
        return get(this, 'secret.prefix');
      } else {
@ -33,6 +42,7 @@ export default Component.extend({
      }
    }
  }),
+
  sourceKey: computed({
    get(key) {
      let nue = key;
@ -42,10 +52,9 @@ export default Component.extend({
      return get(this, `secret.${nue}`);
    },
    set(key, value) {
-      let out = get(this, 'secret.sourceKey');
+      let out = get(this, 'secret.sourceKey') || value;

      if (value === 'prefix') {
-        // TODO verify that when prefix is set we do not set the sourceKey
        out = "prefix";
      } else {
        set(this, 'secret.sourceKey', value);
@ -56,13 +65,18 @@ export default Component.extend({
      return out;
    },
  }),
+
  prefixOrKeys: computed('allSecrets.[]', 'secret.sourceName', function() {
-    let prefix = { id: 'prefix', label: 'All'};
+    let prefix         = { id: 'prefix', label: 'All'};
    let selectedSecret = get(this, 'secret.sourceName');
-    let out = [prefix];
+    let out            = [prefix];
+
    if (selectedSecret) {
      let secret = get(this, 'secrets').findBy('name', selectedSecret);
      let secretKeys = Object.keys(get(secret, 'data'));
+
+      set(this, 'sourceKey', 'prefix');
+
      if (secretKeys) {
        secretKeys.forEach((sk) => {
          out.addObject({id: sk, label: sk});
--- a/app/components/form-secrets-row/template.hbs
+++ b/app/components/form-secrets-row/template.hbs
@ -1,51 +1,64 @@
-  <td data-title="{{t 'formSecrets.kind.label'}}">
-    {{#if editing}}
-      {{searchable-select
-          classNames="form-control"
-          optionValuePath="id"
-          optionLabelPath="label"
-          content=allSecrets
-          value=secret.sourceName
-      }}
+<td data-title="{{t 'formSecrets.kind.label'}}">
+  {{#if editing}}
+    {{new-select
+        classNames="form-control"
+        content=sources
+        value=secret.source
+    }}
+  {{else}}
+    {{#if secret.source}}
+      {{secret.source}}
    {{else}}
-      {{#if secret}}
-        {{secret.sourceName}}
-      {{else}}
-        <span class="text-muted">{{t 'generic.na'}}</span>
-      {{/if}}
+      <span class="text-muted">{{t 'generic.na'}}</span>
    {{/if}}
-  </td>
-  <td>&nbsp;</td>
-  <td data-title="{{t 'formSecrets.prefixOrKey.label'}}">
+  {{/if}}
+</td>
+<td>&nbsp;</td>
+<td data-title="{{t 'formSecrets.kind.label'}}">
+  {{#if editing}}
    {{searchable-select
        classNames="form-control"
        optionValuePath="id"
        optionLabelPath="label"
-        content=prefixOrKeys
-        value=sourceKey
-        readOnly=secretSet
+        content=allSecrets
+        value=secret.sourceName
    }}
-  </td>
-  <td>&nbsp;</td>
-
-  <td data-title="{{t 'formSecrets.prefix.label'}}">
-    <div class="row">
-      <div class="col span-2 p-10" style="min-width:60px;">
-        {{#if (eq sourceKey 'prefix')}}
-          {{sourceKey}}
-        {{else}}
-          {{t 'generic.as'}}
-        {{/if}}
-      </div>
-      <div class="col span-10">
-        {{input type="text" value=prefixOrTarget classNames="form-control" disabled=disableTarget}}
-      </div>
-    </div>
-  </td>
-  <td>
-    {{#if editing}}
-      <button class="btn bg-primary btn-sm" {{action "removeSecret" secret}}>
-        <i class="icon icon-minus"/><span class="sr-only">{{t 'generic.remove'}}</span>
-      </button>
+  {{else}}
+    {{#if secret}}
+      {{secret.sourceName}}
+    {{else}}
+      <span class="text-muted">{{t 'generic.na'}}</span>
    {{/if}}
-  </td>
+  {{/if}}
+</td>
+<td>&nbsp;</td>
+<td data-title="{{t 'formSecrets.prefixOrKey.label'}}">
+  {{searchable-select
+      classNames="form-control"
+      optionValuePath="id"
+      optionLabelPath="label"
+      content=prefixOrKeys
+      value=sourceKey
+      readOnly=secretSet
+  }}
+</td>
+<td>
+  <div class="text-center">
+    {{#if (eq sourceKey 'prefix')}}
+      {{sourceKey}}
+    {{else}}
+      {{t 'generic.as'}}
+    {{/if}}
+  </div>
+</td>
+
+<td data-title="{{t 'formSecrets.prefix.label'}}">
+  {{input type="text" value=prefixOrTarget classNames="form-control" disabled=disableTarget}}
+</td>
+<td>
+  {{#if editing}}
+    <button class="btn bg-primary btn-sm" {{action remove secret}}>
+      <i class="icon icon-minus"/><span class="sr-only">{{t 'generic.remove'}}</span>
+    </button>
+  {{/if}}
+</td>
--- a/lib/shared/addon/components/container/form-secrets/component.js
+++ b/lib/shared/addon/components/container/form-secrets/component.js
@ -25,24 +25,25 @@ export default Component.extend({
      get(this, 'secrets').addObject(secret);
    },
    removeSecret(secret) {
-      console.log('removed', secret);
+      get(this, 'secrets').removeObject(secret);
    },
  },

  init() {
-    this._super(...arguments);
-    //TODO you can do this better, its blocking
    set(this, '_allSecrets', get(this, 'store').all('secret'));
    get(this, 'store').find('secret');
+
+    this._super(...arguments);
+
    if (!get(this, 'secrets') ) {
      set(this, 'secrets', [])
    }
+
  },

  status: computed('secrets.@each.secretId','errors.length', function() {
-    // TODO refactor for new struct
    let k = STATUS.NONE;
-    let count = (this.get('secrets')||[]).filter((x) => !!get(x, 'secretId')).get('length') || 0;
+    let count = get(this, 'secrets.length') || 0;

    if ( count ) {
      if ( this.get('errors.length') ){
--- a/lib/shared/addon/components/container/form-secrets/template.hbs
+++ b/lib/shared/addon/components/container/form-secrets/template.hbs
@ -1,42 +1,39 @@
-{{#accordion-list-item
-    title=(t 'formSecrets.title')
-    detail=(t 'formSecrets.detail' appName=settings.appName)
-    status=status
-    statusClass=statusClass
-    expandAll=expandAll
-    expand=(action expandFn)
-}}
-  <div class="clearfix pt-20">
-    {{#if secrets.length}}
-      <table class="table fixed no-lines small mb-10">
-        <thead>
-          <tr class="hidden-sm">
-            <th width="220" class="{{unless editing 'acc-label'}}">{{t 'formSecrets.secret.label'}}</th>
-            <th width="10"></th>
-            <th class="{{unless editing 'acc-label'}}">{{t 'formSecrets.prefixOrKey.label'}}{{#if editing}}{{field-required}}{{/if}}</th>
-            <th width="10"></th>
-            <th class="{{unless editing 'acc-label'}}">{{t 'formSecrets.prefix.label'}}</th>
-            <th width="40">&nbsp;</th>
-          </tr>
-        </thead>
-        <tbody>
-          {{#each secrets as |secret|}}
-            {{form-secrets-row
-                secret=secret
-                secrets=_allSecrets
-                editing=editing
-            }}
-          {{/each}}
-        </tbody>
-      </table>
+<div class="clearfix">
+  <label class="acc-label">{{t 'newContainer.environment.from'}}</label>
+</div>
+<div>
+  {{#if secrets.length}}
+    <table class="table fixed no-lines small mb-10">
+      <thead>
+        <tr class="hidden-sm">
+          <th width="140" class="{{unless editing 'acc-label'}}">{{t 'formSecrets.type.label'}}{{#if editing}}{{field-required}}{{/if}}</th>
+          <th width="10"></th>
+          <th width="220" class="{{unless editing 'acc-label'}}">{{t 'formSecrets.source.label'}}{{#if editing}}{{field-required}}{{/if}}</th>
+          <th width="10"></th>
+          <th class="{{unless editing 'acc-label'}}">{{t 'formSecrets.prefixOrKey.label'}}{{#if editing}}{{field-required}}{{/if}}</th>
+          <th width="70"></th>
+          <th class="{{unless editing 'acc-label'}}">{{t 'formSecrets.prefix.label'}}</th>
+          <th width="40">&nbsp;</th>
+        </tr>
+      </thead>
+      <tbody>
+        {{#each secrets as |secret|}}
+          {{form-secrets-row
+              secret=secret
+              secrets=_allSecrets
+              editing=editing
+              remove=(action "removeSecret")
+          }}
+        {{/each}}
+      </tbody>
+    </table>
    {{else}}
-      {{#unless editing}}
-        <span class="text-center text-muted">{{t 'formSecrets.noSecrets'}}</span>
-      {{/unless}}
-    {{/if}}
-    <button type="button" class="btn bg-link icon-btn" {{action "addSecret"}}>
-      <span class="darken"><i class="icon icon-plus icon-small"></i></span>
-      <span>{{t 'formSecrets.addLabel'}}</span>
-    </button>
-  </div>
-{{/accordion-list-item}}
+    {{#unless editing}}
+      <span class="text-center text-muted">{{t 'formSecrets.noSecrets'}}</span>
+    {{/unless}}
+  {{/if}}
+  <button type="button" class="btn bg-link icon-btn" {{action "addSecret"}}>
+    <span class="darken"><i class="icon icon-plus icon-small"></i></span>
+    <span>{{t 'newContainer.environment.addFrom'}}</span>
+  </button>
+</div>
--- a/lib/shared/addon/components/container/new-edit/template.hbs
+++ b/lib/shared/addon/components/container/new-edit/template.hbs
@ -54,30 +54,45 @@
 <hr class="mt-30 mb-30" />
 <div class="row">
  {{container/form-ports
-    initialPorts=launchConfig.ports
-    changed=(action (mut launchConfig.ports))
-    errors=portErrors
-    editing=true
-  }}
-</div>
-<hr class="mt-30 mb-30" />
-<div class="row">
-  {{form-key-value
-    initialMap=launchConfig.environment
-    changed=(action (mut launchConfig.environment))
-    allowEmptyValue=true
-    editing=true
-    header=(t 'newContainer.environment.label')
-    addActionLabel="newContainer.environment.addAction"
-    keyLabel="newContainer.environment.keyLabel"
-    keyPlaceholder="newContainer.environment.keyPlaceholder"
-    valueLabel="newContainer.environment.valueLabel"
-    valuePlaceholder="newContainer.environment.valuePlaceholder"
+      initialPorts=launchConfig.ports
+      changed=(action (mut launchConfig.ports))
+      errors=portErrors
+      editing=true
  }}
 </div>

 <hr class="mt-30 mb-30" />
 {{#accordion-list as | al expandFn | }}
+  {{#accordion-list-item
+       title=(t 'newContainer.environment.label')
+       detail=(t 'newContainer.environment.detail' appName=settings.appName)
+       status=status
+       statusClass=statusClass
+       expandAll=al.expandAll
+       expand=(action expandFn)
+  }}
+    {{form-key-value
+        initialMap=launchConfig.environment
+        changed=(action (mut launchConfig.environment))
+        allowEmptyValue=true
+        editing=true
+        header=(t 'newContainer.environment.label')
+        addActionLabel="newContainer.environment.addAction"
+        keyLabel="newContainer.environment.keyLabel"
+        keyPlaceholder="newContainer.environment.keyPlaceholder"
+        valueLabel="newContainer.environment.valueLabel"
+        valuePlaceholder="newContainer.environment.valuePlaceholder"
+    }}
+    <hr class="mt-30 mb-30" />
+    {{container/form-secrets
+        classNames="accordion-wrapper"
+        secrets=launchConfig.environmentFrom
+        errors=secretErrors
+        editing=true
+    }}
+
+  {{/accordion-list-item}}
+
  {{#unless isSidekick}}
    {{container/form-scheduling
      isGlobal=isGlobal
@ -202,15 +217,6 @@
      expandFn=expandFn
    }}

-    {{container/form-secrets
-        classNames="accordion-wrapper"
-        secrets=launchConfig.environmentFrom
-        errors=secretErrors
-        editing=true
-        expandAll=al.expandAll
-        expandFn=expandFn
-    }}
-
    {{container/form-security
        instance=launchConfig
        service=service
--- a/translations/en-us.yaml
+++ b/translations/en-us.yaml
@ -3144,8 +3144,12 @@ formSecrets:
    placeholder: e.g. db_password
  secret:
    label: Secret
+  type:
+    label: Type
+  source:
+    label: Source
  prefixOrKey:
-    label: Key in Secret
+    label: Key
  prefix:
    label: Prefix or Alias
  uid:
@ -4653,7 +4657,10 @@ newContainer:
    placeholder: e.g. My Application
  environment:
    label: Environment Variables
+    from: Environment Variables From Source
+    detail: Environment Variables allow you to inject passwords, keys, or other sensitive information into the containers that need them.
    addAction: Add Variable
+    addFrom: Add From Source
    keyLabel: Variable
    keyPlaceholder: e.g. FOO
    valueLabel: Value