mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Various 7.0 UI tweaks (#23972)
* Set min height of panel pane to 200px * Disable badge on viz picker when item is in disabled in search results * Fix UserProfile inputs width * Remove select caret in user admin permissions editor * fix 23911
This commit is contained in:
parent
6a1845997b
commit
8de606aa22
@ -61,13 +61,11 @@ export class UserPermissions extends PureComponent<Props, State> {
|
||||
<td className="width-16">Grafana Admin</td>
|
||||
{isEditing ? (
|
||||
<td colSpan={2}>
|
||||
<div className="gf-form-select-wrapper width-8">
|
||||
<RadioButtonGroup
|
||||
options={adminOptions}
|
||||
value={currentAdminOption}
|
||||
onChange={this.onAdminOptionSelect}
|
||||
/>
|
||||
</div>
|
||||
<RadioButtonGroup
|
||||
options={adminOptions}
|
||||
value={currentAdminOption}
|
||||
onChange={this.onAdminOptionSelect}
|
||||
/>
|
||||
</td>
|
||||
) : (
|
||||
<td colSpan={2}>
|
||||
|
@ -272,6 +272,7 @@ export class UserProfileRow extends PureComponent<UserProfileRowProps, UserProfi
|
||||
onBlur={this.onInputBlur}
|
||||
onChange={this.onInputChange}
|
||||
ref={this.setInputElem}
|
||||
width={30}
|
||||
/>
|
||||
) : (
|
||||
<span>{this.props.value}</span>
|
||||
|
@ -187,7 +187,7 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
|
||||
return tabs.length > 0 ? (
|
||||
<SplitPane
|
||||
split="horizontal"
|
||||
minSize={50}
|
||||
minSize={200}
|
||||
primary="first"
|
||||
/* Use persisted state for default size */
|
||||
defaultSize={uiState.topPaneSize}
|
||||
|
@ -60,6 +60,10 @@ export const VizTypePicker: React.FC<Props> = ({ searchQuery, onTypeChange, curr
|
||||
return getAllPanelPluginMeta();
|
||||
}, []);
|
||||
|
||||
const getFilteredPluginList = useCallback((): PanelPluginMeta[] => {
|
||||
return filterPluginList(pluginsList, searchQuery, current);
|
||||
}, [searchQuery]);
|
||||
|
||||
const renderVizPlugin = (plugin: PanelPluginMeta, index: number) => {
|
||||
const isCurrent = plugin.id === current.id;
|
||||
const filteredPluginList = getFilteredPluginList();
|
||||
@ -67,7 +71,7 @@ export const VizTypePicker: React.FC<Props> = ({ searchQuery, onTypeChange, curr
|
||||
const matchesQuery = filteredPluginList.indexOf(plugin) > -1;
|
||||
return (
|
||||
<VizTypePickerPlugin
|
||||
disabled={!matchesQuery}
|
||||
disabled={!matchesQuery && !!searchQuery}
|
||||
key={plugin.id}
|
||||
isCurrent={isCurrent}
|
||||
plugin={plugin}
|
||||
@ -76,10 +80,6 @@ export const VizTypePicker: React.FC<Props> = ({ searchQuery, onTypeChange, curr
|
||||
);
|
||||
};
|
||||
|
||||
const getFilteredPluginList = useCallback((): PanelPluginMeta[] => {
|
||||
return filterPluginList(pluginsList, searchQuery, current);
|
||||
}, [searchQuery]);
|
||||
|
||||
const filteredPluginList = getFilteredPluginList();
|
||||
const hasResults = filteredPluginList.length > 0;
|
||||
const renderList = filteredPluginList.concat(pluginsList.filter(p => filteredPluginList.indexOf(p) === -1));
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import { GrafanaTheme, PanelPluginMeta } from '@grafana/data';
|
||||
import { stylesFactory, useTheme, styleMixins } from '@grafana/ui';
|
||||
import { GrafanaTheme, PanelPluginMeta, PluginState } from '@grafana/data';
|
||||
import { styleMixins, stylesFactory, useTheme } from '@grafana/ui';
|
||||
import { css, cx } from 'emotion';
|
||||
import { selectors } from '@grafana/e2e-selectors';
|
||||
import { PanelPluginBadge } from '../../plugins/PluginSignatureBadge';
|
||||
@ -17,7 +17,7 @@ const VizTypePickerPlugin: React.FC<Props> = ({ isCurrent, plugin, onClick, disa
|
||||
const styles = getStyles(theme);
|
||||
const cssClass = cx({
|
||||
[styles.item]: true,
|
||||
[styles.disabled]: disabled,
|
||||
[styles.disabled]: disabled || plugin.state === PluginState.deprecated,
|
||||
[styles.current]: isCurrent,
|
||||
});
|
||||
|
||||
@ -32,7 +32,7 @@ const VizTypePickerPlugin: React.FC<Props> = ({ isCurrent, plugin, onClick, disa
|
||||
<img className={styles.img} src={plugin.info.logos.small} />
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.badge}>
|
||||
<div className={cx(styles.badge, disabled && styles.disabled)}>
|
||||
<PanelPluginBadge plugin={plugin} />
|
||||
</div>
|
||||
</div>
|
||||
|
@ -14,7 +14,7 @@ export interface Props {
|
||||
}
|
||||
|
||||
export const DashboardSearch: FC<Props> = memo(({ onCloseSearch, folder }) => {
|
||||
const payload = folder ? { query: `folder:${folder}` } : {};
|
||||
const payload = folder ? { query: `folder:${folder} ` } : {};
|
||||
const { query, onQueryChange, onTagFilterChange, onTagAdd, onSortChange, onLayoutChange } = useSearchQuery(payload);
|
||||
const { results, loading, onToggleSection, onKeyDown } = useDashboardSearch(query, onCloseSearch);
|
||||
const theme = useTheme();
|
||||
|
Loading…
Reference in New Issue
Block a user