open-vault/ui/app/components/policy-form.js
claire bontempo 56442f673d
ui: refactor text file component (#18458)
* wip tests

* Move text-file to addon

* rename fileName to filename, initial cleanup of text-fil

* rename args, rename test selector

* fix eye-con, remove enterAsText from file object

* add tests

* move files back to original location

* rename files via git for git diff

* adjsut test

* Revert "wip tests"

This reverts commit 63716a1e647a0b01236d34322837456ef3e9db43.

* fix policy form input

* cleanup conditional

* add bottom margin

* add element id

* change arg name

* add text area input test

* add upload test to policy form

Co-authored-by: Chelsea Shaw <cshaw@hashicorp.com>
2022-12-19 23:54:59 +00:00

69 lines
2.2 KiB
JavaScript

import Component from '@glimmer/component';
import { action } from '@ember/object';
import { inject as service } from '@ember/service';
import { task } from 'ember-concurrency';
import trimRight from 'vault/utils/trim-right';
import { tracked } from '@glimmer/tracking';
/**
* @module PolicyForm
* PolicyForm components are the forms to create and edit all types of policies. This is only the form, not the outlying layout, and expects that the form model is passed from the parent.
*
* @example
* <PolicyForm
* @model={{this.model}}
* @onSave={{transition-to "vault.cluster.policy.show" this.model.policyType this.model.name}}
* @onCancel={{transition-to "vault.cluster.policies.index"}}
* />
* ```
* @callback onCancel - callback triggered when cancel button is clicked
* @callback onSave - callback triggered when save button is clicked. Passes saved model
* @param {object} model - ember data model from createRecord
*/
export default class PolicyFormComponent extends Component {
@service flashMessages;
@tracked errorBanner = '';
@tracked showFileUpload = false;
@task
*save(event) {
event.preventDefault();
try {
const { name, policyType, isNew } = this.args.model;
yield this.args.model.save();
this.flashMessages.success(
`${policyType.toUpperCase()} policy "${name}" was successfully ${isNew ? 'created' : 'updated'}.`
);
this.args.onSave(this.args.model);
} catch (error) {
const message = error.errors ? error.errors.join('. ') : error.message;
this.errorBanner = message;
}
}
@action
setModelName({ target }) {
this.args.model.name = target.value.toLowerCase();
}
@action
setPolicyFromFile(fileInfo) {
const { value, filename } = fileInfo;
this.args.model.policy = value;
if (!this.args.model.name) {
const trimmedFileName = trimRight(filename, ['.json', '.txt', '.hcl', '.policy']);
this.args.model.name = trimmedFileName.toLowerCase();
}
this.showFileUpload = false;
}
@action
cancel() {
const method = this.args.model.isNew ? 'unloadRecord' : 'rollbackAttributes';
this.args.model[method]();
this.args.onCancel();
}
}