diff --git a/web-console/src/components/auto-form/__snapshots__/auto-form.spec.tsx.snap b/web-console/src/components/auto-form/__snapshots__/auto-form.spec.tsx.snap index 02a63a1b1074..0e28a10eba41 100644 --- a/web-console/src/components/auto-form/__snapshots__/auto-form.spec.tsx.snap +++ b/web-console/src/components/auto-form/__snapshots__/auto-form.spec.tsx.snap @@ -5,8 +5,8 @@ exports[`AutoForm matches snapshot 1`] = ` className="auto-form" > + + + - + + + diff --git a/web-console/src/components/auto-form/auto-form.spec.tsx b/web-console/src/components/auto-form/auto-form.spec.tsx index d0e6c4105912..c2391300a21c 100644 --- a/web-console/src/components/auto-form/auto-form.spec.tsx +++ b/web-console/src/components/auto-form/auto-form.spec.tsx @@ -28,14 +28,26 @@ describe('AutoForm', () => { const autoForm = shallow( true, + }, { name: 'testNotDefined', type: 'string', defined: false }, { name: 'testAdvanced', type: 'string', hideInMore: true }, diff --git a/web-console/src/components/auto-form/auto-form.tsx b/web-console/src/components/auto-form/auto-form.tsx index 4021a242534c..5c8e0f63156f 100644 --- a/web-console/src/components/auto-form/auto-form.tsx +++ b/web-console/src/components/auto-form/auto-form.tsx @@ -62,6 +62,12 @@ export interface Field { issueWithValue?: (value: any) => string | undefined; } +interface ComputedFieldValues { + required: boolean; + defaultValue?: any; + modelValue: any; +} + export interface AutoFormProps { fields: Field[]; model: M | undefined; @@ -93,6 +99,15 @@ export class AutoForm> extends React.PureComponent return newLabel; } + static computeFieldValues(model: M | undefined, field: Field): ComputedFieldValues { + const required = AutoForm.evaluateFunctor(field.required, model, false); + return { + required, + defaultValue: required ? undefined : field.defaultValue, + modelValue: deepGet(model as any, field.name), + }; + } + static evaluateFunctor( functor: undefined | Functor, model: M | undefined, @@ -204,12 +219,12 @@ export class AutoForm> extends React.PureComponent private renderNumberInput(field: Field): JSX.Element { const { model, large, onFinalize } = this.props; + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); - const modelValue = deepGet(model as any, field.name); return ( { let newValue: number | undefined; if (valueAsString !== '' && !isNaN(valueAsNumber)) { @@ -228,21 +243,18 @@ export class AutoForm> extends React.PureComponent large={large} disabled={AutoForm.evaluateFunctor(field.disabled, model, false)} placeholder={AutoForm.evaluateFunctor(field.placeholder, model, '')} - intent={ - AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null - ? AutoForm.REQUIRED_INTENT - : undefined - } + intent={required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined} /> ); } private renderSizeBytesInput(field: Field): JSX.Element { const { model, large, onFinalize } = this.props; + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); return ( { if (isNaN(v)) return; this.fieldChange(field, v); @@ -256,17 +268,18 @@ export class AutoForm> extends React.PureComponent fill large={large} disabled={AutoForm.evaluateFunctor(field.disabled, model, false)} + intent={required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined} /> ); } private renderStringInput(field: Field, sanitize?: (str: string) => string): JSX.Element { const { model, large, onFinalize } = this.props; + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); - const modelValue = deepGet(model as any, field.name); return ( { if (sanitize && typeof v === 'string') v = sanitize(v); this.fieldChange(field, v); @@ -279,24 +292,17 @@ export class AutoForm> extends React.PureComponent suggestions={AutoForm.evaluateFunctor(field.suggestions, model, undefined)} large={large} disabled={AutoForm.evaluateFunctor(field.disabled, model, false)} - intent={ - AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null - ? AutoForm.REQUIRED_INTENT - : undefined - } + intent={required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined} /> ); } private renderBooleanInput(field: Field): JSX.Element { const { model, large, onFinalize } = this.props; - const modelValue = deepGet(model as any, field.name); - const shownValue = modelValue == null ? field.defaultValue : modelValue; + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); + const shownValue = modelValue == null ? defaultValue : modelValue; const disabled = AutoForm.evaluateFunctor(field.disabled, model, false); - const intent = - AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null - ? AutoForm.REQUIRED_INTENT - : undefined; + const intent = required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined; return ( @@ -342,41 +348,34 @@ export class AutoForm> extends React.PureComponent private renderStringArrayInput(field: Field): JSX.Element { const { model, large } = this.props; - const modelValue = deepGet(model as any, field.name); + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); + return ( { this.fieldChange(field, v); }} placeholder={AutoForm.evaluateFunctor(field.placeholder, model, '')} large={large} disabled={AutoForm.evaluateFunctor(field.disabled, model, false)} - intent={ - AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null - ? AutoForm.REQUIRED_INTENT - : undefined - } + intent={required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined} /> ); } private renderIntervalInput(field: Field): JSX.Element { const { model } = this.props; + const { required, defaultValue, modelValue } = AutoForm.computeFieldValues(model, field); - const modelValue = deepGet(model as any, field.name); return ( { this.fieldChange(field, v); }} placeholder={AutoForm.evaluateFunctor(field.placeholder, model, '')} - intent={ - AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null - ? AutoForm.REQUIRED_INTENT - : undefined - } + intent={required && modelValue == null ? AutoForm.REQUIRED_INTENT : undefined} /> ); } diff --git a/web-console/src/druid-models/ingestion-spec.tsx b/web-console/src/druid-models/ingestion-spec.tsx index f5471c9364c3..4424ff2b990a 100644 --- a/web-console/src/druid-models/ingestion-spec.tsx +++ b/web-console/src/druid-models/ingestion-spec.tsx @@ -883,7 +883,6 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F 'kinesis.us-gov-east-1.amazonaws.com', 'kinesis.us-gov-west-1.amazonaws.com', ], - required: true, info: ( <> The Amazon Kinesis stream endpoint for a region. You can find a list of endpoints{' '} diff --git a/web-console/src/druid-models/timestamp-spec.tsx b/web-console/src/druid-models/timestamp-spec.tsx index f6a8263998fa..6aa0486077c8 100644 --- a/web-console/src/druid-models/timestamp-spec.tsx +++ b/web-console/src/druid-models/timestamp-spec.tsx @@ -107,7 +107,6 @@ export const TIMESTAMP_SPEC_FIELDS: Field[] = [ name: 'column', type: 'string', defaultValue: 'timestamp', - required: true, }, { name: 'format', diff --git a/web-console/src/views/load-data-view/load-data-view.tsx b/web-console/src/views/load-data-view/load-data-view.tsx index 5c3812fc9731..8094d50d9fcb 100644 --- a/web-console/src/views/load-data-view/load-data-view.tsx +++ b/web-console/src/views/load-data-view/load-data-view.tsx @@ -712,7 +712,7 @@ export class LoadDataView extends React.PureComponent { - this.setState({ - selectedComboType: selectedComboType !== comboType ? comboType : undefined, - }); + onClick={e => { + if (e.altKey && e.shiftKey) { + this.updateSpec(updateIngestionType(spec, comboType as any)); + this.updateStep('connect'); + } else { + this.setState({ + selectedComboType: selectedComboType !== comboType ? comboType : undefined, + }); + } }} >