mirror of https://github.com/apache/druid.git
Add intent for web console IntervalInput (#10447)
When using the web console to load data by reindexing from Druid, the `Datasource` and `Interval` inputs are required during the `Connect` step. Unlike the `Datasource` input, the `Interval` input did not have a blue outline to indicate that it was required as the `IntervalInput` component did not support an `intent` property.
This commit is contained in:
parent
5356d8821b
commit
d16c78ba98
|
@ -308,6 +308,11 @@ export class AutoForm<T extends Record<string, any>> extends React.PureComponent
|
|||
this.fieldChange(field, v);
|
||||
}}
|
||||
placeholder={AutoForm.evaluateFunctor(field.placeholder, model, '')}
|
||||
intent={
|
||||
AutoForm.evaluateFunctor(field.required, model, false) && modelValue == null
|
||||
? AutoForm.REQUIRED_INTENT
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
exports[`interval calendar component matches snapshot 1`] = `
|
||||
<div
|
||||
class="bp3-input-group"
|
||||
class="bp3-input-group bp3-intent-primary"
|
||||
>
|
||||
<input
|
||||
class="bp3-input"
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import { render } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
|
||||
|
@ -28,6 +29,7 @@ describe('interval calendar component', () => {
|
|||
interval={'2010-01-01/2020-01-01'}
|
||||
placeholder={'2010-01-01/2020-01-01'}
|
||||
onValueChange={() => {}}
|
||||
intent={Intent.PRIMARY}
|
||||
/>
|
||||
);
|
||||
const { container } = render(intervalInput);
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Button, InputGroup, Popover, Position } from '@blueprintjs/core';
|
||||
import { Button, InputGroup, Intent, Popover, Position } from '@blueprintjs/core';
|
||||
import { DateRange, DateRangePicker } from '@blueprintjs/datetime';
|
||||
import { IconNames } from '@blueprintjs/icons';
|
||||
import React from 'react';
|
||||
|
@ -66,10 +66,11 @@ export interface IntervalInputProps {
|
|||
interval: string;
|
||||
placeholder: string | undefined;
|
||||
onValueChange: (interval: string) => void;
|
||||
intent?: Intent;
|
||||
}
|
||||
|
||||
export const IntervalInput = React.memo(function IntervalInput(props: IntervalInputProps) {
|
||||
const { interval, placeholder, onValueChange } = props;
|
||||
const { interval, placeholder, onValueChange, intent } = props;
|
||||
|
||||
return (
|
||||
<InputGroup
|
||||
|
@ -99,6 +100,7 @@ export const IntervalInput = React.memo(function IntervalInput(props: IntervalIn
|
|||
const value = e.target.value.replace(/[^\-0-9T:/]/g, '').substring(0, 39);
|
||||
onValueChange(value);
|
||||
}}
|
||||
intent={intent}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue