5c2a08de6d
* Update browserslist * Add browserslistrc * ember-cli-update --to 3.26, fix conflicts * Run codemodes that start with ember-* * More codemods - before cp* * More codemods (curly data-test-*) * WIP ember-basic-dropdown template errors * updates ember-basic-dropdown and related deps to fix build issues * updates basic dropdown instances to new version API * updates more deps -- ember-template-lint is working again * runs no-implicit-this codemod * creates and runs no-quoteless-attributes codemod * runs angle brackets codemod * updates lint:hbs globs to only touch hbs files * removes yield only templates * creates and runs deprecated args transform * supresses lint error for invokeAction on LinkTo component * resolves remaining ambiguous path lint errors * resolves simple-unless lint errors * adds warnings for deprecated tagName arg on LinkTo components * adds warnings for remaining curly component invocation * updates global template lint rules * resolves remaining template lint errors * disables some ember specfic lint rules that target pre octane patterns * js lint fix run * resolves remaining js lint errors * fixes test run * adds npm-run-all dep * fixes test attribute issues * fixes console acceptance tests * fixes tests * adds yield only wizard/tutorial-active template * fixes more tests * attempts to fix more flaky tests * removes commented out settled in transit test * updates deprecations workflow and adds initializer to filter by version * updates flaky policies acl old test * updates to flaky transit test * bumps ember deps down to LTS version * runs linters after main merge * fixes client count tests after bad merge conflict fixes * fixes client count history test * more updates to lint config * another round of hbs lint fixes after extending stylistic rule * updates lint-staged commands * removes indent eslint rule since it seems to break things * fixes bad attribute in transform-edit-form template * test fixes * fixes enterprise tests * adds changelog * removes deprecated ember-concurrency-test-waiters dep and adds @ember/test-waiters * flaky test fix Co-authored-by: hashishaw <cshaw@hashicorp.com>
103 lines
2.9 KiB
JavaScript
103 lines
2.9 KiB
JavaScript
/**
|
|
* @module KvObjectEditor
|
|
* KvObjectEditor components are called in FormFields when the editType on the model is kv. They are used to show a key-value input field.
|
|
*
|
|
* @example
|
|
* ```js
|
|
* <KvObjectEditor
|
|
* @value={{get model valuePath}}
|
|
* @onChange={{action "setAndBroadcast" valuePath }}
|
|
* @label="some label"
|
|
/>
|
|
* ```
|
|
* @param {string} value - the value is captured from the model.
|
|
* @param {function} onChange - function that captures the value on change
|
|
* @param {function} onKeyUp - function passed in that handles the dom keyup event. Used for validation on the kv custom metadata.
|
|
* @param {string} [label] - label displayed over key value inputs
|
|
* @param {string} [warning] - warning that is displayed
|
|
* @param {string} [helpText] - helper text. In tooltip.
|
|
* @param {string} [subText] - placed under label.
|
|
* @param {boolean} [small-label]- change label size.
|
|
* @param {boolean} [formSection] - if false the component is meant to live outside of a form, like in the customMetadata which is nested already inside a form-section.
|
|
*/
|
|
|
|
import { isNone } from '@ember/utils';
|
|
import { assert } from '@ember/debug';
|
|
import Component from '@ember/component';
|
|
import { computed } from '@ember/object';
|
|
import { guidFor } from '@ember/object/internals';
|
|
import KVObject from 'vault/lib/kv-object';
|
|
|
|
export default Component.extend({
|
|
'data-test-component': 'kv-object-editor',
|
|
classNames: ['field'],
|
|
classNameBindings: ['formSection:form-section'],
|
|
formSection: true,
|
|
// public API
|
|
// Ember Object to mutate
|
|
value: null,
|
|
label: null,
|
|
helpText: null,
|
|
subText: null,
|
|
// onChange will be called with the changed Value
|
|
onChange() {},
|
|
|
|
init() {
|
|
this._super(...arguments);
|
|
const data = KVObject.create({ content: [] }).fromJSON(this.value);
|
|
this.set('kvData', data);
|
|
this.addRow();
|
|
},
|
|
|
|
kvData: null,
|
|
|
|
kvDataAsJSON: computed('kvData', 'kvData.[]', function () {
|
|
return this.kvData.toJSON();
|
|
}),
|
|
|
|
kvDataIsAdvanced: computed('kvData', 'kvData.[]', function () {
|
|
return this.kvData.isAdvanced();
|
|
}),
|
|
|
|
kvHasDuplicateKeys: computed('kvData', 'kvData.@each.name', function () {
|
|
let data = this.kvData;
|
|
return data.uniqBy('name').length !== data.get('length');
|
|
}),
|
|
|
|
addRow() {
|
|
let data = this.kvData;
|
|
let newObj = { name: '', value: '' };
|
|
if (!isNone(data.findBy('name', ''))) {
|
|
return;
|
|
}
|
|
guidFor(newObj);
|
|
data.addObject(newObj);
|
|
},
|
|
actions: {
|
|
addRow() {
|
|
this.addRow();
|
|
},
|
|
|
|
updateRow() {
|
|
let data = this.kvData;
|
|
this.onChange(data.toJSON());
|
|
},
|
|
|
|
deleteRow(object, index) {
|
|
let data = this.kvData;
|
|
let oldObj = data.objectAt(index);
|
|
|
|
assert('object guids match', guidFor(oldObj) === guidFor(object));
|
|
data.removeAt(index);
|
|
this.onChange(data.toJSON());
|
|
},
|
|
|
|
handleKeyUp(name, value) {
|
|
if (!this.onKeyUp) {
|
|
return;
|
|
}
|
|
this.onKeyUp(name, value);
|
|
},
|
|
},
|
|
});
|