From c3633feea877e8a8b49c6413680a01e2fab5a5f4 Mon Sep 17 00:00:00 2001 From: Josh Hunt Date: Thu, 1 Sep 2022 13:26:28 +0100 Subject: [PATCH] Chore: Remove Dashboard IconName type assertions (#54573) * Chore: Remove Dashboard IconName type assertions * fix lint --- .betterer.results | 11 +---------- .../components/LinksSettings/LinkSettingsEdit.tsx | 4 ++-- .../components/PanelEditor/PanelEditorTabs.tsx | 8 ++++---- .../dashboard/components/SubMenu/DashboardLinks.tsx | 6 ++++-- .../dashgrid/PanelHeader/PanelHeaderMenuItem.tsx | 8 ++++++-- 5 files changed, 17 insertions(+), 20 deletions(-) diff --git a/.betterer.results b/.betterer.results index d61a8a05710..4cf22bb8bcc 100644 --- a/.betterer.results +++ b/.betterer.results @@ -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"] diff --git a/public/app/features/dashboard/components/LinksSettings/LinkSettingsEdit.tsx b/public/app/features/dashboard/components/LinksSettings/LinkSettingsEdit.tsx index 8e6df111c6a..d4277bc8b01 100644 --- a/public/app/features/dashboard/components/LinksSettings/LinkSettingsEdit.tsx +++ b/public/app/features/dashboard/components/LinksSettings/LinkSettingsEdit.tsx @@ -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 = { 'external link': 'external-link-alt', dashboard: 'apps', question: 'question-circle', diff --git a/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx b/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx index 3d8be41e1c4..6ad2716f83d 100644 --- a/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx +++ b/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx @@ -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 = 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)} /> ); diff --git a/public/app/features/dashboard/components/SubMenu/DashboardLinks.tsx b/public/app/features/dashboard/components/SubMenu/DashboardLinks.tsx index 2e3186aeb37..3bad7086fda 100644 --- a/public/app/features/dashboard/components/SubMenu/DashboardLinks.tsx +++ b/public/app/features/dashboard/components/SubMenu/DashboardLinks.tsx @@ -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 = ({ dashboard, links }) => { return ; } + const icon = linkIconMap[link.icon]; + const linkElement = ( = ({ dashboard, links }) => { rel="noreferrer" data-testid={selectors.components.DashboardLinks.link} > - + {icon && } {linkInfo.title} ); diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx index 2e25ccab6e9..aa8d593aa32 100644 --- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx @@ -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) => { color: ${theme.colors.textWeak}; `; + const icon = props.iconClassName ? toIconName(props.iconClassName) : undefined; + return isDivider ? (
  • ) : (
  • - {props.iconClassName && } + {icon && } + {props.text} {isSubMenu && } + {props.shortcut && ( {props.shortcut}