mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Select: Portal menu by default (#48176)
* Remove menuShouldPortal from all <Select /> components * fix unit tests * leave menuShouldPortal as an escape hatch * Fix import order
This commit is contained in:
@@ -309,7 +309,6 @@ export class CloudWatchLogsQueryField extends React.PureComponent<CloudWatchLogs
|
||||
inputEl={
|
||||
<MultiSelect
|
||||
aria-label="Log Groups"
|
||||
menuShouldPortal
|
||||
allowCustomValue={allowCustomValue}
|
||||
options={unionBy(availableLogGroups, selectedLogGroups, 'value')}
|
||||
value={selectedLogGroups}
|
||||
|
||||
@@ -137,8 +137,8 @@ describe('MetricStatEditor', () => {
|
||||
expect(namespaceSelect).toBeInTheDocument();
|
||||
expect(metricsSelect).toBeInTheDocument();
|
||||
|
||||
await selectEvent.select(namespaceSelect, 'n1');
|
||||
await selectEvent.select(metricsSelect, 'm1');
|
||||
await selectEvent.select(namespaceSelect, 'n1', { container: document.body });
|
||||
await selectEvent.select(metricsSelect, 'm1', { container: document.body });
|
||||
|
||||
expect(onChange.mock.calls).toEqual([
|
||||
[{ ...propsNamespaceMetrics.metricStat, namespace: 'n1' }], // First call, namespace select
|
||||
@@ -167,7 +167,7 @@ describe('MetricStatEditor', () => {
|
||||
expect(screen.getByText('n2')).toBeInTheDocument();
|
||||
expect(screen.getByText('oldNamespaceMetric')).toBeInTheDocument();
|
||||
|
||||
await selectEvent.select(namespaceSelect, 'n1');
|
||||
await selectEvent.select(namespaceSelect, 'n1', { container: document.body });
|
||||
|
||||
expect(onChange.mock.calls).toEqual([[{ ...propsNamespaceMetrics.metricStat, metricName: '', namespace: 'n1' }]]);
|
||||
});
|
||||
@@ -183,7 +183,7 @@ describe('MetricStatEditor', () => {
|
||||
expect(screen.getByText('n1')).toBeInTheDocument();
|
||||
expect(screen.getByText('m1')).toBeInTheDocument();
|
||||
|
||||
await selectEvent.select(namespaceSelect, 'n2');
|
||||
await selectEvent.select(namespaceSelect, 'n2', { container: document.body });
|
||||
|
||||
expect(onChange).toHaveBeenCalledTimes(1);
|
||||
expect(onChange.mock.calls).toEqual([
|
||||
|
||||
@@ -82,7 +82,6 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
|
||||
options={namespaceOptions}
|
||||
allowCustomValue
|
||||
onChange={({ value }) => value && onNamespaceChange(setNamespace(query, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
</EditorField>
|
||||
|
||||
@@ -106,7 +105,6 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
|
||||
options={dimensionKeys}
|
||||
allowCustomValue
|
||||
onChange={(item) => item && onQueryChange(setSchemaLabels(query, item))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
</EditorField>
|
||||
)}
|
||||
@@ -120,7 +118,6 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
|
||||
options={metricOptions}
|
||||
allowCustomValue
|
||||
onChange={({ value }) => value && onQueryChange(setMetricName(query, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
</EditorField>
|
||||
|
||||
@@ -130,7 +127,6 @@ const SQLBuilderSelectRow: React.FC<SQLBuilderSelectRowProps> = ({ datasource, q
|
||||
value={aggregation ? toOption(aggregation) : null}
|
||||
options={appendTemplateVariables(datasource, AGGREGATIONS)}
|
||||
onChange={({ value }) => value && onQueryChange(setAggregation(query, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
</EditorField>
|
||||
</EditorFieldGroup>
|
||||
|
||||
@@ -131,7 +131,6 @@ const FilterItem: React.FC<FilterItemProps> = (props) => {
|
||||
options={dimensionKeys}
|
||||
allowCustomValue
|
||||
onChange={({ value }) => value && onChange(setOperatorExpressionProperty(filter, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
|
||||
<Select
|
||||
@@ -139,7 +138,6 @@ const FilterItem: React.FC<FilterItemProps> = (props) => {
|
||||
value={filter.operator?.name && toOption(filter.operator.name)}
|
||||
options={OPERATORS}
|
||||
onChange={({ value }) => value && onChange(setOperatorExpressionName(filter, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
|
||||
<Select
|
||||
@@ -152,7 +150,6 @@ const FilterItem: React.FC<FilterItemProps> = (props) => {
|
||||
allowCustomValue
|
||||
onOpenMenu={loadOptions}
|
||||
onChange={({ value }) => value && onChange(setOperatorExpressionValue(filter, value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
|
||||
<AccessoryButton aria-label="remove" icon="times" variant="secondary" onClick={onDelete} />
|
||||
|
||||
@@ -100,7 +100,6 @@ const GroupByItem: React.FC<GroupByItemProps> = (props) => {
|
||||
options={options}
|
||||
allowCustomValue
|
||||
onChange={({ value }) => value && onChange(setGroupByField(value))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
|
||||
<AccessoryButton aria-label="remove" icon="times" variant="secondary" onClick={onDelete} />
|
||||
|
||||
@@ -36,7 +36,6 @@ const SQLOrderByGroup: React.FC<SQLBuilderSelectRowProps> = ({ query, onQueryCha
|
||||
onChange={({ value }) => value && onQueryChange(setOrderBy(query, value))}
|
||||
options={appendTemplateVariables(datasource, STATISTICS.map(toOption))}
|
||||
value={orderBy ? toOption(orderBy) : null}
|
||||
menuShouldPortal
|
||||
/>
|
||||
{orderBy && (
|
||||
<AccessoryButton
|
||||
@@ -56,7 +55,6 @@ const SQLOrderByGroup: React.FC<SQLBuilderSelectRowProps> = ({ query, onQueryCha
|
||||
value={orderByDirection ? toOption(orderByDirection) : orderByDirections[0]}
|
||||
options={appendTemplateVariables(datasource, orderByDirections)}
|
||||
onChange={(item) => item && onQueryChange(setSql(query, { orderByDirection: item.value }))}
|
||||
menuShouldPortal
|
||||
/>
|
||||
</EditorField>
|
||||
</EditorFieldGroup>
|
||||
|
||||
@@ -29,7 +29,6 @@ export const VariableQueryField = <T extends string | VariableQueryType>({
|
||||
return (
|
||||
<InlineField label={label} labelWidth={LABEL_WIDTH} htmlFor={inputId}>
|
||||
<Select
|
||||
menuShouldPortal
|
||||
aria-label={label}
|
||||
width={25}
|
||||
allowCustomValue={allowCustomValue}
|
||||
|
||||
Reference in New Issue
Block a user