ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

Fix resource deployment text field validation (#12421) (#12457)

Browse Source
This commit is contained in:
Charles Gagnon
2020-09-18 11:22:23 -07:00
committed by GitHub
parent 681ecbd946
commit 7a1e0a7d2e
1 changed files with 23 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
extensions/resource-deployment/src/ui/modelViewUtils.ts
View File

@@ -117,7 +117,16 @@ interface ContextBase {
onNewInputComponentCreated: (name: string, inputComponentInfo: InputComponentInfo) => void; onNewInputComponentCreated: (name: string, inputComponentInfo: InputComponentInfo) => void;
} }
export function createTextInput(view: azdata.ModelView, inputInfo: { defaultValue?: string, ariaLabel: string, required?: boolean, placeHolder?: string, width?: string, enabled?: boolean }): azdata.InputBoxComponent { export function createTextInput(view: azdata.ModelView, inputInfo: {
defaultValue?: string,
ariaLabel: string,
required?: boolean,
placeHolder?: string,
width?: string,
enabled?: boolean,
validationRegex?: RegExp,
validationErrorMessage?: string
}): azdata.InputBoxComponent {
return view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({ return view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
value: inputInfo.defaultValue, value: inputInfo.defaultValue,
ariaLabel: inputInfo.ariaLabel, ariaLabel: inputInfo.ariaLabel,
@@ -125,7 +134,13 @@ export function createTextInput(view: azdata.ModelView, inputInfo: { defaultValu
required: inputInfo.required, required: inputInfo.required,
placeHolder: inputInfo.placeHolder, placeHolder: inputInfo.placeHolder,
width: inputInfo.width, width: inputInfo.width,
enabled: inputInfo.enabled enabled: inputInfo.enabled,
validationErrorMessage: inputInfo.validationErrorMessage
}).withValidation(component => {
if (inputInfo.validationRegex?.test(component.value || '') === false) {
return false;
}
return true;
}).component(); }).component();
} }
@@ -525,6 +540,7 @@ function processNumberField(context: FieldContext): void {
} }
function processTextField(context: FieldContext): void { function processTextField(context: FieldContext): void {
let validationRegex: RegExp | undefined = context.fieldInfo.textValidationRequired ? new RegExp(context.fieldInfo.textValidationRegex!) : undefined;
const label = createLabel(context.view, { text: context.fieldInfo.label, description: context.fieldInfo.description, required: context.fieldInfo.required, width: context.fieldInfo.labelWidth, cssStyles: context.fieldInfo.labelCSSStyles }); const label = createLabel(context.view, { text: context.fieldInfo.label, description: context.fieldInfo.description, required: context.fieldInfo.required, width: context.fieldInfo.labelWidth, cssStyles: context.fieldInfo.labelCSSStyles });
const input = createTextInput(context.view, { const input = createTextInput(context.view, {
defaultValue: context.fieldInfo.defaultValue, defaultValue: context.fieldInfo.defaultValue,
@@ -532,16 +548,16 @@ function processTextField(context: FieldContext): void {
required: context.fieldInfo.required, required: context.fieldInfo.required,
placeHolder: context.fieldInfo.placeHolder, placeHolder: context.fieldInfo.placeHolder,
width: context.fieldInfo.inputWidth, width: context.fieldInfo.inputWidth,
enabled: context.fieldInfo.enabled enabled: context.fieldInfo.enabled,
validationRegex: validationRegex,
validationErrorMessage: context.fieldInfo.textValidationDescription
}); });
context.onNewInputComponentCreated(context.fieldInfo.variableName!, { component: input }); context.onNewInputComponentCreated(context.fieldInfo.variableName!, { component: input });
addLabelInputPairToContainer(context.view, context.components, label, input, context.fieldInfo); addLabelInputPairToContainer(context.view, context.components, label, input, context.fieldInfo);
if (context.fieldInfo.textValidationRequired) { if (context.fieldInfo.textValidationRequired) {
let validationRegex: RegExp = new RegExp(context.fieldInfo.textValidationRegex!);
const removeInvalidInputMessage = (): void => { const removeInvalidInputMessage = (): void => {
if (validationRegex.test(input.value!)) { // input is valid if (validationRegex!.test(input.value!)) { // input is valid
removeValidationMessage(context.container, context.fieldInfo.textValidationDescription!); removeValidationMessage(context.container, context.fieldInfo.textValidationDescription!);
} }
}; };
@@ -551,7 +567,7 @@ function processTextField(context: FieldContext): void {
})); }));
const inputValidator: Validator = (): { valid: boolean; message: string; } => { const inputValidator: Validator = (): { valid: boolean; message: string; } => {
const inputIsValid = validationRegex.test(input.value!); const inputIsValid = validationRegex!.test(input.value!);
return { valid: inputIsValid, message: context.fieldInfo.textValidationDescription! }; return { valid: inputIsValid, message: context.fieldInfo.textValidationDescription! };
}; };
context.onNewValidatorCreated(inputValidator); context.onNewValidatorCreated(inputValidator);