vault/ui/lib/pki/addon/components/pki-key-usage.js
Angel Garbarino 8188328700
PKI role non-default options (#17393)
* dynamically render the secretlistheader in the parent route.

* start getting form setup even without openAPi working

* add in create and cancel

* making openAPI work

* add default openAPI params

* wip for new component with two radio options a ttl and input

* handle createRecord on pki-roles-form

* remove tooltips and cleanup

* move formfieldgroupsloop back to non addon

* cleanup

* move secretListHeader

* broadcast from radioSelectTtlOrString to parent

* cleanup

* hide tooltips

* pass through sub text to stringArray

* Add conditional for keybits and keyType

* set defaults for keyBits ... 🤮

* fix some small issues

* more info form field typ

* show only label and subText

* wip context switch 🤮

* fix dontShowLabel

* getting css grid setup

* more on flex groups

* adding the second chunk to key usage

* serialize the post for key_usage

* finish for ext_key_usage

* clean up

* fix snack_case issue

* commit for working state, next trying to remove form-field-group-loops because it's causing issues.

* remove usage of formfieldgroupsloop because of issues with css grid and conditionals

* clean up

* remove string-list helpText changes for tooltip removal because that should be it's own pr.

* clarification from design and backend.

* small cleanup

* pull key_usage and ext_key_usage out of the model and into a component

* clean up

* clean up

* restructure css grid:

* clean up

* broke some things

* fix error when roles list returned 404

* claires feedback

* cleanup

* clean up
2022-10-12 12:56:05 -06:00

94 lines
3.7 KiB
JavaScript

import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module PkiKeyUsage
* PkiKeyUsage components are used to build out the toggle options for PKI's role create/update key_usage, ext_key_usage and ext_key_usage_oids model params.
* Instead of having the user search on the following goLang pages for these options we present them in checkbox form and manually add them to the params as an array of strings.
* key_usage options: https://pkg.go.dev/crypto/x509#KeyUsage
* ext_key_usage options (not all are include on purpose): https://pkg.go.dev/crypto/x509#ExtKeyUsage
* @example
* ```js
* <PkiKeyUsage @model={@model} @group={group}/>
* ```
* @param {class} model - The pki/pki-role-engine model.
* @param {string} group - The name of the group created in the model. In this case, it's the "Key usage" group.
*/
const KEY_USAGE_FIELDS = {
DigitalSignature: {
label: 'Digital Signature',
value: true,
},
ContentCommitment: { label: 'Content Commitment' },
CrlSign: { label: 'CRL Sign' },
KeyAgreement: {
label: 'Key Agreement',
value: true,
},
DataEncipherment: { label: 'Data Encipherment' },
EncipherOnly: { label: 'Encipher Only' },
KeyEncipherment: {
label: 'Key Encipherment',
value: true,
},
CertSign: { label: 'Cert Sign' },
DecipherOnly: { label: 'Decipher Only' },
};
const EXT_KEY_USAGE_FIELDS = {
Any: { label: 'Any' },
EmailProtection: { label: 'Email Protection' },
TimeStamping: { label: 'Time Stamping' },
ServerAuth: { label: 'Server Auth' },
IpsecEndSystem: { label: 'IPSEC End System' },
OcspSigning: { label: 'OCSP Signing' },
ClientAuth: { label: 'Client Auth' },
IpsecTunnel: { label: 'IPSEC Tunnel' },
IpsecUser: { label: 'IPSEC User' },
CodeSigning: { label: 'Code Signing' },
};
export default class PkiKeyUsage extends Component {
constructor() {
super(...arguments);
this.keyUsageFields = {};
this.extKeyUsageFields = {};
Object.assign(this.keyUsageFields, KEY_USAGE_FIELDS);
Object.assign(this.extKeyUsageFields, EXT_KEY_USAGE_FIELDS);
}
@action onStringListChange(value) {
this.args.model.set('extKeyUsageOids', value);
}
_amendList(checkboxName, value, type) {
let keyUsageList = this.args.model.keyUsage;
let extKeyUsageList = this.args.model.extKeyUsage;
/* Process:
1. We first check if the checkbox change is coming from the checkbox options of key_usage or ext_key_usage.
// Param key_usage || ext_key_usage accept a comma separated string and an array of strings. E.g. "DigitalSignature,KeyAgreement,KeyEncipherment" || [“DigitalSignature”,“KeyAgreement”,“KeyEncipherment”]
2. Then we convert the string to an array if it's not already an array (e.g. it's already been converted). This makes it easier to add or remove items.
3. Then if the value of checkbox is "true" we add it to the arrayList, otherwise remove it.
*/
if (type === 'keyUsage') {
let keyUsageListArray = Array.isArray(keyUsageList) ? keyUsageList : keyUsageList.split(',');
return value ? keyUsageListArray.addObject(checkboxName) : keyUsageListArray.removeObject(checkboxName);
} else {
// because there is no default on init for ext_key_usage property (set normally by OpenAPI) we define it as an empty array if it is undefined.
let extKeyUsageListArray = !extKeyUsageList ? [] : extKeyUsageList;
return value
? extKeyUsageListArray.addObject(checkboxName)
: extKeyUsageListArray.removeObject(checkboxName);
}
}
@action checkboxChange(type) {
const checkboxName = event.target.id;
const value = event.target['checked'];
this.args.model.set(type, this._amendList(checkboxName, value, type));
}
}