@grafana/ui: Replace various icons using Icon component (#23442)

* Replace icons in dashboard and settings

* Replace icons in alerting

* Update batch of icons

* Implement icons accross various files

* Style updates

* Search: Fix recent and starred icons

* Update styling and details

* Replace new icon created by unicons

* Fix e2e test, styling

* Minor styling updates

Co-authored-by: Clarity-89 <homes89@ukr.net>
This commit is contained in:
Ivana Huckova
2020-04-12 22:20:02 +02:00
committed by GitHub
parent 0aa95d97c8
commit 1c58202b26
193 changed files with 1256 additions and 824 deletions

View File

@@ -1,5 +1,6 @@
import React from 'react';
import classNames from 'classnames';
import { Icon } from '@grafana/ui';
import { PanelModel } from '../../state/PanelModel';
import { DashboardModel } from '../../state/DashboardModel';
import templateSrv from 'app/features/templating/template_srv';
@@ -74,11 +75,6 @@ export class DashboardRow extends React.Component<DashboardRowProps, any> {
'dashboard-row': true,
'dashboard-row--collapsed': this.state.collapsed,
});
const chevronClass = classNames({
fa: true,
'fa-chevron-down': !this.state.collapsed,
'fa-chevron-right': this.state.collapsed,
});
const title = templateSrv.replaceWithText(this.props.panel.title, this.props.panel.scopedVars);
const count = this.props.panel.panels ? this.props.panel.panels.length : 0;
@@ -88,7 +84,7 @@ export class DashboardRow extends React.Component<DashboardRowProps, any> {
return (
<div className={classes}>
<a className="dashboard-row__title pointer" onClick={this.onToggle}>
<i className={chevronClass} />
<Icon name={this.state.collapsed ? 'angle-right' : 'angle-down'} />
{title}
<span className="dashboard-row__panel_count">
({count} {panels})
@@ -97,10 +93,10 @@ export class DashboardRow extends React.Component<DashboardRowProps, any> {
{canEdit && (
<div className="dashboard-row__actions">
<a className="pointer" onClick={this.onOpenSettings}>
<i className="gicon gicon-cog" />
<Icon name="cog" />
</a>
<a className="pointer" onClick={this.onDelete}>
<i className="fa fa-trash" />
<Icon name="trash-alt" />
</a>
</div>
)}