mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Upgrade Datasources-picker on Explore page #13425
This commit is contained in:
parent
52b329562d
commit
be7ed3ebca
@ -12,7 +12,7 @@ export const PickerOption = (props: ExtendedOptionProps) => {
|
||||
return (
|
||||
<components.Option {...props}>
|
||||
<div className={`description-picker-option__button btn btn-link width-19`}>
|
||||
<img src={data.avatarUrl} alt={data.label} className="user-picker-option__avatar" />
|
||||
{data.avatarUrl && <img src={data.avatarUrl} alt={data.label} className="user-picker-option__avatar" />}
|
||||
{children}
|
||||
</div>
|
||||
</components.Option>
|
||||
|
@ -9,6 +9,10 @@ import store from 'app/core/store';
|
||||
import TimeSeries from 'app/core/time_series2';
|
||||
import { parse as parseDate } from 'app/core/utils/datemath';
|
||||
import { DEFAULT_RANGE } from 'app/core/utils/explore';
|
||||
import ResetStyles from 'app/core/components/Picker/ResetStyles';
|
||||
import PickerOption from 'app/core/components/Picker/PickerOption';
|
||||
import IndicatorsContainer from 'app/core/components/Picker/IndicatorsContainer';
|
||||
import NoOptionsMessage from 'app/core/components/Picker/NoOptionsMessage';
|
||||
|
||||
import ElapsedTime from './ElapsedTime';
|
||||
import QueryRows from './QueryRows';
|
||||
@ -519,7 +523,6 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
|
||||
const logsButtonActive = showingLogs ? 'active' : '';
|
||||
const tableButtonActive = showingBoth || showingTable ? 'active' : '';
|
||||
const exploreClass = split ? 'explore explore-split' : 'explore';
|
||||
const selectedDatasource = datasource ? datasource.name : undefined;
|
||||
|
||||
return (
|
||||
<div className={exploreClass} ref={this.getRef}>
|
||||
@ -541,13 +544,24 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
|
||||
{!datasourceMissing ? (
|
||||
<div className="navbar-buttons">
|
||||
<Select
|
||||
clearable={false}
|
||||
classNamePrefix={`gf-form-select2`}
|
||||
isMulti={false}
|
||||
isLoading={datasourceLoading}
|
||||
isClearable={false}
|
||||
className="gf-form-input gf-form-input--form-dropdown datasource-picker"
|
||||
onChange={this.onChangeDatasource}
|
||||
options={exploreDatasources}
|
||||
isOpen={true}
|
||||
placeholder="Loading datasources..."
|
||||
value={selectedDatasource}
|
||||
styles={ResetStyles}
|
||||
placeholder="Select datasource"
|
||||
loadingMessage={() => 'Loading datasources...'}
|
||||
noOptionsMessage={() => 'No datasources found'}
|
||||
getOptionValue={i => i.value}
|
||||
getOptionLabel={i => i.label}
|
||||
components={{
|
||||
Option: PickerOption,
|
||||
IndicatorsContainer,
|
||||
NoOptionsMessage,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
|
Loading…
Reference in New Issue
Block a user