1 import { Component, OnInit } from '@angular/core';
2 import { FormControl, FormGroup, ValidatorFn } from '@angular/forms';
3 import { ActivatedRoute, Router } from '@angular/router';
5 import { I18n } from '@ngx-translate/i18n-polyfill';
6 import * as _ from 'lodash';
8 import { ConfigurationService } from '../../../../shared/api/configuration.service';
9 import { ConfigFormModel } from '../../../../shared/components/config-option/config-option.model';
10 import { ConfigOptionTypes } from '../../../../shared/components/config-option/config-option.types';
11 import { NotificationType } from '../../../../shared/enum/notification-type.enum';
12 import { CdFormGroup } from '../../../../shared/forms/cd-form-group';
13 import { NotificationService } from '../../../../shared/services/notification.service';
14 import { ConfigFormCreateRequestModel } from './configuration-form-create-request.model';
17 selector: 'cd-configuration-form',
18 templateUrl: './configuration-form.component.html',
19 styleUrls: ['./configuration-form.component.scss']
21 export class ConfigurationFormComponent implements OnInit {
22 configForm: CdFormGroup;
23 response: ConfigFormModel;
26 humanReadableType: string;
29 patternHelpText: string;
30 availSections = ['global', 'mon', 'mgr', 'osd', 'mds', 'client'];
33 private route: ActivatedRoute,
34 private router: Router,
35 private configService: ConfigurationService,
36 private notificationService: NotificationService,
43 const formControls = {
44 name: new FormControl({ value: null }),
45 desc: new FormControl({ value: null }),
46 long_desc: new FormControl({ value: null }),
47 values: new FormGroup({}),
48 default: new FormControl({ value: null }),
49 daemon_default: new FormControl({ value: null }),
50 services: new FormControl([])
53 this.availSections.forEach((section) => {
54 formControls.values.addControl(section, new FormControl(null));
57 this.configForm = new CdFormGroup(formControls);
61 this.route.params.subscribe((params: { name: string }) => {
62 const configName = params.name;
63 this.configService.get(configName).subscribe((resp: ConfigFormModel) => {
64 this.setResponse(resp);
69 getValidators(configOption: any): ValidatorFn[] {
70 const typeValidators = ConfigOptionTypes.getTypeValidators(configOption);
72 this.patternHelpText = typeValidators.patternHelpText;
74 if ('max' in typeValidators && typeValidators.max !== '') {
75 this.maxValue = typeValidators.max;
78 if ('min' in typeValidators && typeValidators.min !== '') {
79 this.minValue = typeValidators.min;
82 return typeValidators.validators;
88 getStep(type: string, value: number): number | undefined {
89 return ConfigOptionTypes.getTypeStep(type, value);
92 setResponse(response: ConfigFormModel) {
93 this.response = response;
94 const validators = this.getValidators(response);
96 this.configForm.get('name').setValue(response.name);
97 this.configForm.get('desc').setValue(response.desc);
98 this.configForm.get('long_desc').setValue(response.long_desc);
99 this.configForm.get('default').setValue(response.default);
100 this.configForm.get('daemon_default').setValue(response.daemon_default);
101 this.configForm.get('services').setValue(response.services);
103 if (this.response.value) {
104 this.response.value.forEach((value) => {
105 // Check value type. If it's a boolean value we need to convert it because otherwise we
106 // would use the string representation. That would cause issues for e.g. checkboxes.
107 let sectionValue = null;
108 if (value.value === 'true') {
110 } else if (value.value === 'false') {
111 sectionValue = false;
113 sectionValue = value.value;
115 this.configForm.get('values').get(value.section).setValue(sectionValue);
119 this.availSections.forEach((section) => {
120 this.configForm.get('values').get(section).setValidators(validators);
123 const currentType = ConfigOptionTypes.getType(response.type);
124 this.type = currentType.name;
125 this.inputType = currentType.inputType;
126 this.humanReadableType = currentType.humanReadable;
129 createRequest(): ConfigFormCreateRequestModel | null {
130 const values: any[] = [];
132 this.availSections.forEach((section) => {
133 const sectionValue = this.configForm.getValue(section);
134 if (sectionValue !== null && sectionValue !== '') {
135 values.push({ section: section, value: sectionValue });
139 if (!_.isEqual(this.response.value, values)) {
140 const request = new ConfigFormCreateRequestModel();
141 request.name = this.configForm.getValue('name');
142 request.value = values;
150 const request = this.createRequest();
153 this.configService.create(request).subscribe(
155 this.notificationService.show(
156 NotificationType.success,
157 this.i18n('Updated config option {{name}}', { name: request.name })
159 this.router.navigate(['/configuration']);
162 this.configForm.setErrors({ cdSubmitButton: true });
167 this.router.navigate(['/configuration']);