Chore: some minor type fixes (#68402)

* some minor type fixes

* undo card change

packages/grafana-ui/src/components/Cascader/Cascader.tsx

@@ -49,7 +49,7 @@ export interface CascaderOption {
   /**
    *  The value used under the hood
    */
-  value: any;
+  value: string;
   /**
    *  The label to display in the UI
    */

packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.story.tsx

@@ -3,12 +3,11 @@ import { useArgs } from '@storybook/client-api';
 import { Meta, StoryFn } from '@storybook/react';
 import React from 'react';
 
-import { DataSourceSettings } from '@grafana/data';
-
 import { DataSourceHttpSettings } from './DataSourceHttpSettings';
 import mdx from './DataSourceHttpSettings.mdx';
+import { HttpSettingsProps } from './types';
 
-const settingsMock: DataSourceSettings<any, any> = {
+const settingsMock: HttpSettingsProps['dataSourceConfig'] = {
   id: 4,
   orgId: 1,
   uid: 'x',

packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx

@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 import React, { useState, useCallback } from 'react';
 
-import { DataSourceSettings, SelectableValue } from '@grafana/data';
+import { SelectableValue } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
 
 import { useTheme2 } from '../../themes';
@@ -82,7 +82,7 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => {
   let urlTooltip;
 
   const onSettingsChange = useCallback(
-    (change: Partial<DataSourceSettings<any, any>>) => {
+    (change: Partial<typeof dataSourceConfig>) => {
       onChange({
         ...dataSourceConfig,
         ...change,

packages/grafana-ui/src/components/Graph/Graph.tsx

@@ -135,7 +135,7 @@ export class Graph extends PureComponent<GraphProps, GraphState> {
   renderTooltip = () => {
     const { children, series, timeZone } = this.props;
     const { pos, activeItem, isTooltipVisible } = this.state;
-    let tooltipElement: React.ReactElement<VizTooltipProps> | null = null;
+    let tooltipElement: React.ReactElement<VizTooltipProps> | undefined;
 
     if (!isTooltipVisible || !pos || series.length === 0) {
       return null;
@@ -147,18 +147,17 @@ export class Graph extends PureComponent<GraphProps, GraphState> {
       if (tooltipElement) {
         return;
       }
-      // @ts-ignore
       const childType = c && c.type && (c.type.displayName || c.type.name);
 
       if (childType === VizTooltip.displayName) {
-        tooltipElement = c as React.ReactElement<VizTooltipProps>;
+        tooltipElement = c;
       }
     });
     // If no tooltip provided, skip rendering
     if (!tooltipElement) {
       return null;
     }
-    const tooltipElementProps = (tooltipElement as React.ReactElement<VizTooltipProps>).props;
+    const tooltipElementProps = tooltipElement.props;
 
     const tooltipMode = tooltipElementProps.mode || 'single';
 
@@ -203,7 +202,7 @@ export class Graph extends PureComponent<GraphProps, GraphState> {
 
     const tooltipContent = React.createElement(tooltipContentRenderer, { ...tooltipContentProps });
 
-    return React.cloneElement<VizTooltipProps>(tooltipElement as React.ReactElement<VizTooltipProps>, {
+    return React.cloneElement(tooltipElement, {
       content: tooltipContent,
       position: { x: pos.pageX, y: pos.pageY },
       offset: { x: 10, y: 10 },

packages/grafana-ui/src/components/PluginSignatureBadge/PluginSignatureBadge.tsx

@@ -14,16 +14,10 @@ export interface PluginSignatureBadgeProps extends HTMLAttributes<HTMLDivElement
 /**
  * @public
  */
-export const PluginSignatureBadge = ({ status, ...otherProps }: PluginSignatureBadgeProps) => {
+export const PluginSignatureBadge = ({ status, color, ...otherProps }: PluginSignatureBadgeProps) => {
   const display = getSignatureDisplayModel(status);
   return (
-    <Badge
-      text={display.text}
-      color={display.color as any}
-      icon={display.icon}
-      tooltip={display.tooltip}
-      {...otherProps}
-    />
+    <Badge text={display.text} color={display.color} icon={display.icon} tooltip={display.tooltip} {...otherProps} />
   );
 };