Chore: Remove Dashboard IconName type assertions (#54573)

* Chore: Remove Dashboard IconName type assertions

* fix lint
This commit is contained in:
Josh Hunt 2022-09-01 13:26:28 +01:00 committed by GitHub
parent caa0c91b1c
commit c3633feea8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 17 additions and 20 deletions

View File

@ -3869,11 +3869,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Do not use any type assertions.", "2"],
[0, 0, 0, "Do not use any type assertions.", "3"]
],
"public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"],
[0, 0, 0, "Do not use any type assertions.", "2"]
],
"public/app/features/dashboard/components/PanelEditor/getFieldOverrideElements.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"],
@ -3986,9 +3981,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Do not use any type assertions.", "2"],
[0, 0, 0, "Unexpected any. Specify a different type.", "3"]
],
"public/app/features/dashboard/components/SubMenu/DashboardLinks.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"public/app/features/dashboard/components/SubMenu/DashboardLinksDashboard.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"]
@ -4076,8 +4068,7 @@ exports[`better eslint`] = {
[0, 0, 0, "Unexpected any. Specify a different type.", "2"]
],
"public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"]
[0, 0, 0, "Unexpected any. Specify a different type.", "0"]
],
"public/app/features/dashboard/dashgrid/SeriesVisibilityConfigFactory.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]

View File

@ -1,7 +1,7 @@
import React, { useState } from 'react';
import { SelectableValue } from '@grafana/data';
import { CollapsableSection, TagsInput, Select, Field, Input, Checkbox, Button } from '@grafana/ui';
import { CollapsableSection, TagsInput, Select, Field, Input, Checkbox, Button, IconName } from '@grafana/ui';
import { DashboardLink, DashboardModel } from '../../state/DashboardModel';
@ -23,7 +23,7 @@ const linkTypeOptions = [
{ value: 'link', label: 'Link' },
];
export const linkIconMap: { [key: string]: string } = {
export const linkIconMap: Record<string, IconName | undefined> = {
'external link': 'external-link-alt',
dashboard: 'apps',
question: 'question-circle',

View File

@ -4,7 +4,7 @@ import { Subscription } from 'rxjs';
import { GrafanaTheme2 } from '@grafana/data';
import { config } from '@grafana/runtime';
import { IconName, Tab, TabContent, TabsBar, useForceUpdate, useStyles2 } from '@grafana/ui';
import { Tab, TabContent, TabsBar, toIconName, useForceUpdate, useStyles2 } from '@grafana/ui';
import AlertTabIndex from 'app/features/alerting/AlertTabIndex';
import { PanelAlertTab } from 'app/features/alerting/unified/PanelAlertTab';
import { PanelQueriesChangedEvent, PanelTransformationsChangedEvent } from 'app/types/events';
@ -52,7 +52,7 @@ export const PanelEditorTabs: FC<PanelEditorTabsProps> = React.memo(({ panel, da
label={tab.text}
active={tab.active}
onChangeTab={() => onChangeTab(tab)}
icon={tab.icon as IconName}
icon={toIconName(tab.icon)}
counter={getCounter(panel, tab)}
/>
);
@ -102,7 +102,7 @@ function renderAlertTab(
label={tab.text}
active={tab.active}
onChangeTab={() => onChangeTab(tab)}
icon={tab.icon as IconName}
icon={toIconName(tab.icon)}
panel={panel}
dashboard={dashboard}
/>
@ -116,7 +116,7 @@ function renderAlertTab(
label={tab.text}
active={tab.active}
onChangeTab={() => onChangeTab(tab)}
icon={tab.icon as IconName}
icon={toIconName(tab.icon)}
counter={getCounter(panel, tab)}
/>
);

View File

@ -4,7 +4,7 @@ import { useEffectOnce } from 'react-use';
import { sanitizeUrl } from '@grafana/data/src/text/sanitize';
import { selectors } from '@grafana/e2e-selectors';
import { TimeRangeUpdatedEvent } from '@grafana/runtime';
import { Icon, IconName, Tooltip, useForceUpdate } from '@grafana/ui';
import { Icon, Tooltip, useForceUpdate } from '@grafana/ui';
import { getLinkSrv } from '../../../panel/panellinks/link_srv';
import { DashboardModel } from '../../state';
@ -40,6 +40,8 @@ export const DashboardLinks: FC<Props> = ({ dashboard, links }) => {
return <DashboardLinksDashboard key={key} link={link} linkInfo={linkInfo} dashboardUID={dashboard.uid} />;
}
const icon = linkIconMap[link.icon];
const linkElement = (
<a
className="gf-form-label gf-form-label--dashlink"
@ -48,7 +50,7 @@ export const DashboardLinks: FC<Props> = ({ dashboard, links }) => {
rel="noreferrer"
data-testid={selectors.components.DashboardLinks.link}
>
<Icon aria-hidden name={linkIconMap[link.icon] as IconName} style={{ marginRight: '4px' }} />
{icon && <Icon aria-hidden name={icon} style={{ marginRight: '4px' }} />}
<span>{linkInfo.title}</span>
</a>
);

View File

@ -3,7 +3,7 @@ import React, { FC, useState } from 'react';
import { PanelMenuItem } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { Icon, IconName, useTheme } from '@grafana/ui';
import { Icon, toIconName, useTheme } from '@grafana/ui';
interface Props {
children?: any;
@ -27,16 +27,20 @@ export const PanelHeaderMenuItem: FC<Props & PanelMenuItem> = (props) => {
color: ${theme.colors.textWeak};
`;
const icon = props.iconClassName ? toIconName(props.iconClassName) : undefined;
return isDivider ? (
<li className="divider" />
) : (
<li className={isSubMenu ? `dropdown-submenu ${getDropdownLocationCssClass(ref)}` : undefined} ref={setRef}>
<a onClick={props.onClick} href={props.href}>
{props.iconClassName && <Icon name={props.iconClassName as IconName} className={menuIconClassName} />}
{icon && <Icon name={icon} className={menuIconClassName} />}
<span className="dropdown-item-text" aria-label={selectors.components.Panels.Panel.headerItems(props.text)}>
{props.text}
{isSubMenu && <Icon name="angle-right" className={shortcutIconClassName} />}
</span>
{props.shortcut && (
<span className="dropdown-menu-item-shortcut">
<Icon name="keyboard" className={menuIconClassName} /> {props.shortcut}