Chore: Update grafana eslint config version and fix rule violations (#109666)

packages/grafana-ui/src/components/Combobox/ValuePill.tsx

@@ -38,6 +38,7 @@ export const ValuePill = forwardRef<HTMLSpanElement, ValuePillProps>(
     );
   }
 );
+ValuePill.displayName = 'ValuePill';
 
 const getValuePillStyles = (theme: GrafanaTheme2, disabled?: boolean) => ({
   wrapper: css({

packages/grafana-ui/src/components/Table/TableNG/Cells/renderers.tsx

@@ -20,6 +20,7 @@ import { SparklineCell, getStyles as getSparklineCellStyles } from './SparklineC
 const AutoCellRenderer = memo((props: TableCellRendererProps) => (
   <AutoCell value={props.value} field={props.field} rowIdx={props.rowIdx} />
 ));
+AutoCellRenderer.displayName = 'AutoCellRenderer';
 
 function isCustomCellOptions(options: TableCellOptions): options is TableCustomCellOptions {
   return options.type === TableCellDisplayMode.Custom;
@@ -56,16 +57,19 @@ const CELL_REGISTRY: Record<TableCellOptions['type'], CellRegistryEntry> = {
     getStyles: mixinAutoCellStyles(getJsonCellStyles),
   },
   [TableCellDisplayMode.Actions]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <ActionsCell field={props.field} rowIdx={props.rowIdx} getActions={props.getActions ?? (() => [])} />
     )),
     getStyles: getActionsCellStyles,
   },
   [TableCellDisplayMode.DataLinks]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => <DataLinksCell field={props.field} rowIdx={props.rowIdx} />),
     getStyles: getDataLinksStyles,
   },
   [TableCellDisplayMode.Gauge]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <BarGaugeCell
         field={props.field}
@@ -78,6 +82,7 @@ const CELL_REGISTRY: Record<TableCellOptions['type'], CellRegistryEntry> = {
     )),
   },
   [TableCellDisplayMode.Sparkline]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <SparklineCell
         value={props.value}
@@ -91,16 +96,19 @@ const CELL_REGISTRY: Record<TableCellOptions['type'], CellRegistryEntry> = {
     getStyles: getSparklineCellStyles,
   },
   [TableCellDisplayMode.Geo]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => <GeoCell value={props.value} height={props.height} />),
     getStyles: getGeoCellStyles,
   },
   [TableCellDisplayMode.Image]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <ImageCell cellOptions={props.cellOptions} field={props.field} value={props.value} rowIdx={props.rowIdx} />
     )),
     getStyles: getImageStyles,
   },
   [TableCellDisplayMode.Pill]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <PillCell rowIdx={props.rowIdx} field={props.field} theme={props.theme} />
     )),
@@ -108,6 +116,7 @@ const CELL_REGISTRY: Record<TableCellOptions['type'], CellRegistryEntry> = {
     testField: (field: Field) => field.type === FieldType.string,
   },
   [TableCellDisplayMode.Markdown]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => (
       <MarkdownCell field={props.field} rowIdx={props.rowIdx} disableSanitizeHtml={props.disableSanitizeHtml} />
     )),
@@ -115,6 +124,7 @@ const CELL_REGISTRY: Record<TableCellOptions['type'], CellRegistryEntry> = {
     testField: (field: Field) => field.type === FieldType.string,
   },
   [TableCellDisplayMode.Custom]: {
+    // eslint-disable-next-line react/display-name
     renderer: memo((props: TableCellRendererProps) => {
       if (!isCustomCellOptions(props.cellOptions) || !props.cellOptions.cellComponent) {
         return null; // nonsensical case, but better to typeguard it than throw.

packages/grafana-ui/src/components/Table/TableNG/MaybeWrapWithLink.tsx

@@ -30,3 +30,4 @@ export const MaybeWrapWithLink = memo(({ field, rowIdx, children }: MaybeWrapWit
   // raw value
   return children;
 });
+MaybeWrapWithLink.displayName = 'MaybeWrapWithLink';

packages/grafana-ui/src/components/Table/TableNG/TableNG.tsx

@@ -787,6 +787,7 @@ export function TableNG(props: TableNGProps) {
  */
 const renderRowFactory =
   (fields: Field[], panelContext: PanelContext, expandedRows: Set<number>, enableSharedCrosshair: boolean) =>
+  // eslint-disable-next-line react/display-name
   (key: React.Key, props: RenderRowProps<TableRow, TableSummaryRow>): React.ReactNode => {
     const { row } = props;
     const rowIdx = row.__index;

packages/grafana-ui/src/components/Table/TableNG/components/TableCellActions.tsx

@@ -81,3 +81,4 @@ export const TableCellActions = memo(
     </div>
   )
 );
+TableCellActions.displayName = 'TableCellActions';

packages/grafana-ui/src/components/Table/TableNG/components/TableCellTooltip.tsx

@@ -157,3 +157,4 @@ export const TableCellTooltip = memo(
     );
   }
 );
+TableCellTooltip.displayName = 'TableCellTooltip';