vault/ui/app/components/role-edit.js
Zack Moore e6ce95acd3
Replace codemirror 6 code editor with HDS CodeEditor component (#30188)
* Completed initial replacement of editor

* fixing ts issues

* removing codemirror modifier and deps

* working on replacing the code editor

* addressing linting concerns

* cleaning up policy-form editor

* fixing linting issues

* fixing linting issues

* fixing tests

* fixing tests

* fixing tests

* fixing tests

* fixing failing tests

* cleaning up PR

* fixing tests

* remove outdated message for navigating editor

* fix linting in tests

* add changelog

* fix tests

* update naming

* remove unused lint param + name changes

* update test selector usage

* update test selector usage

* update test selector usage

* lint fixes

* replace page object selectors

* lint fix

* fix lint

* fix lint after merge

* update tests

* remove import

---------

Co-authored-by: Lane Wetmore <lane.wetmore@hashicorp.com>
2025-07-23 11:12:20 -07:00

115 lines
2.8 KiB
JavaScript

/**
* Copyright (c) HashiCorp, Inc.
* SPDX-License-Identifier: BUSL-1.1
*/
import { service } from '@ember/service';
import { or } from '@ember/object/computed';
import { isBlank } from '@ember/utils';
import { task, waitForEvent } from 'ember-concurrency';
import Component from '@ember/component';
import { set } from '@ember/object';
import FocusOnInsertMixin from 'vault/mixins/focus-on-insert';
import keys from 'core/utils/keys';
const LIST_ROOT_ROUTE = 'vault.cluster.secrets.backend.list-root';
const SHOW_ROUTE = 'vault.cluster.secrets.backend.show';
/**
* @type Class
*/
export default Component.extend(FocusOnInsertMixin, {
router: service(),
mode: null,
emptyData: '{\n}',
onDataChange() {},
onRefresh() {},
model: null,
requestInFlight: or('model.isLoading', 'model.isReloading', 'model.isSaving'),
willDestroyElement() {
if (this.model && this.model.isError && !this.model.isDestroyed && !this.model.isDestroying) {
this.model.rollbackAttributes();
}
this._super(...arguments);
},
waitForKeyUp: task(function* () {
while (true) {
const event = yield waitForEvent(document.body, 'keyup');
this.onEscape(event);
}
})
.on('didInsertElement')
.cancelOn('willDestroyElement'),
transitionToRoute() {
this.router.transitionTo(...arguments);
},
onEscape(e) {
const isEscKeyPressed = keys.ESC.includes(e.key);
if (isEscKeyPressed || this.mode !== 'show') {
return;
}
this.transitionToRoute(LIST_ROOT_ROUTE);
},
hasDataChanges() {
this.onDataChange(this.model.hasDirtyAttributes);
},
persist(method, successCallback) {
const model = this.model;
return model[method]().then(() => {
if (!model.isError) {
successCallback(model);
}
});
},
actions: {
createOrUpdate(type, event) {
event.preventDefault();
// all of the attributes with fieldValue:'id' are called `name`
const modelId = this.model.id || this.model.name;
// prevent from submitting if there's no key
// maybe do something fancier later
if (type === 'create' && isBlank(modelId)) {
return;
}
this.persist('save', () => {
this.hasDataChanges();
this.transitionToRoute(SHOW_ROUTE, modelId);
});
},
setValue(key, event) {
set(this.model, key, event.target.checked);
},
refresh() {
this.onRefresh();
},
delete() {
this.persist('destroyRecord', () => {
this.hasDataChanges();
this.transitionToRoute(LIST_ROOT_ROUTE);
});
},
editorUpdated(attr, val) {
// wont set invalid JSON to the model
try {
set(this.model, attr, JSON.parse(val));
} catch {
// linting is handled by the component
}
},
},
});