[react@18] (Part 2) fix useCallback breaking type changes (#191659)

## Summary This is a prep for https://github.com/elastic/kibana/issues/138222 and follow up to https://github.com/elastic/kibana/pull/182344. These are post-merge leftovers and new instances from the previous [run](https://github.com/elastic/kibana/pull/182344) In React@18 useCallback types have changed that introducing breaking changes: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/46691 Found potential issues using: https://github.com/eps1lon/types-react-codemod?tab=readme-ov-file#usecallback-implicit-any I tried to do my best to fix the type where possible, but there are some complicated cases where I kept `any` after some struggling. Please feel free to push improvements directly. --------- Co-authored-by: Jatin Kathuria <jtn.kathuria@gmail.com>
2025-04-24 09:48:58 -04:00 · 2024-09-04 17:00:40 +02:00 · 2024-09-04 17:00:40 +02:00 · 8199dd0407
commit 8199dd0407
parent 243de82cc6
78 changed files with 235 additions and 171 deletions
--- a/packages/kbn-alerts-grouping/src/components/alerts_grouping.tsx
+++ b/packages/kbn-alerts-grouping/src/components/alerts_grouping.tsx
@ -17,7 +17,7 @@ import React, {
  useState,
 } from 'react';
 import type { Filter } from '@kbn/es-query';
-import { isNoneGroup, useGrouping } from '@kbn/grouping';
+import { GroupOption, isNoneGroup, useGrouping } from '@kbn/grouping';
 import { isEqual } from 'lodash/fp';
 import { i18n } from '@kbn/i18n';
 import { useAlertsDataView } from '@kbn/alerts-ui-shared/src/common/hooks/use_alerts_data_view';
@ -89,7 +89,7 @@ const AlertsGroupingInternal = <T extends BaseAlertsGroupAggregations>(
  ) as [number[], Dispatch<SetStateAction<number[]>>, () => void];

  const onOptionsChange = useCallback(
-    (options) => {
+    (options: GroupOption[]) => {
      // useGrouping > useAlertsGroupingState options sync
      // the available grouping options change when the user selects
      // a new field not in the default ones
--- a/packages/kbn-alerts-ui-shared/src/rule_form/rule_actions/rule_actions_alerts_filter_timeframe.tsx
+++ b/packages/kbn-alerts-ui-shared/src/rule_form/rule_actions/rule_actions_alerts_filter_timeframe.tsx
@ -142,7 +142,7 @@ export const RuleActionsAlertsFilterTimeframe: React.FC<RuleActionsAlertsFilterT
  );

  const onChangeTimezone = useCallback(
-    (value) => {
+    (value: Array<{ label: string }>) => {
      setSelectedTimezone(value);
      if (value[0].label) updateTimeframe({ timezone: value[0].label });
    },
--- a/packages/kbn-alerts-ui-shared/src/rule_form/rule_definition/rule_definition.tsx
+++ b/packages/kbn-alerts-ui-shared/src/rule_form/rule_definition/rule_definition.tsx
@ -96,7 +96,7 @@ export const RuleDefinition = () => {
  }, [selectedRuleTypeModel, docLinks]);

  const onChangeMetaData = useCallback(
-    (newMetadata) => {
+    (newMetadata: Record<string, unknown>) => {
      dispatch({
        type: 'setMetadata',
        payload: newMetadata,
--- a/packages/kbn-alerts-ui-shared/src/rule_settings/rule_settings_flapping_inputs.tsx
+++ b/packages/kbn-alerts-ui-shared/src/rule_settings/rule_settings_flapping_inputs.tsx
@ -63,14 +63,18 @@ export const RuleSettingsFlappingInputs = (props: RuleSettingsFlappingInputsProp
    onStatusChangeThresholdChange,
  } = props;

-  const internalOnLookBackWindowChange = useCallback(
+  const internalOnLookBackWindowChange = useCallback<
+    NonNullable<React.ComponentProps<typeof RuleSettingsRangeInput>['onChange']>
+  >(
    (e) => {
      onLookBackWindowChange(parseInt(e.currentTarget.value, 10));
    },
    [onLookBackWindowChange]
  );

-  const internalOnStatusChangeThresholdChange = useCallback(
+  const internalOnStatusChangeThresholdChange = useCallback<
+    NonNullable<React.ComponentProps<typeof RuleSettingsRangeInput>['onChange']>
+  >(
    (e) => {
      onStatusChangeThresholdChange(parseInt(e.currentTarget.value, 10));
    },
--- a/packages/kbn-field-utils/src/components/field_description/field_description.tsx
+++ b/packages/kbn-field-utils/src/components/field_description/field_description.tsx
@ -98,7 +98,7 @@ export const FieldDescriptionContent: React.FC<
  );

  const truncateFieldDescription = useCallback(
-    (nextValue) => {
+    (nextValue: boolean) => {
      setIsTruncated(nextValue);
      setShouldTruncateByDefault(nextValue);
    },
--- a/packages/kbn-management/settings/components/field_input/input/code_editor_input.tsx
+++ b/packages/kbn-management/settings/components/field_input/input/code_editor_input.tsx
@ -53,7 +53,7 @@ export const CodeEditorInput = ({
  const onUpdate = useUpdate({ onInputChange, field });

  const updateValue = useCallback(
-    async (newValue: string, onUpdateFn) => {
+    async (newValue: string, onUpdateFn: typeof onUpdate) => {
      let parsedValue;

      // Validate JSON syntax
--- a/packages/kbn-text-based-editor/src/text_based_languages_editor.tsx
+++ b/packages/kbn-text-based-editor/src/text_based_languages_editor.tsx
@ -245,10 +245,17 @@ export const TextBasedLanguagesEditor = memo(function TextBasedLanguagesEditor({
  const containerRef = useRef<HTMLElement>(null);

  // When the editor is on full size mode, the user can resize the height of the editor.
-  const onMouseDownResizeHandler = useCallback(
+  const onMouseDownResizeHandler = useCallback<
+    React.ComponentProps<typeof ResizableButton>['onMouseDownResizeHandler']
+  >(
    (mouseDownEvent) => {
+      function isMouseEvent(e: React.TouchEvent | React.MouseEvent): e is React.MouseEvent {
+        return e && 'pageY' in e;
+      }
      const startSize = editorHeight;
-      const startPosition = mouseDownEvent.pageY;
+      const startPosition = isMouseEvent(mouseDownEvent)
+        ? mouseDownEvent?.pageY
+        : mouseDownEvent?.touches[0].pageY;

      function onMouseMove(mouseMoveEvent: MouseEvent) {
        const height = startSize - startPosition + mouseMoveEvent.pageY;
@ -265,7 +272,9 @@ export const TextBasedLanguagesEditor = memo(function TextBasedLanguagesEditor({
    [editorHeight]
  );

-  const onKeyDownResizeHandler = useCallback(
+  const onKeyDownResizeHandler = useCallback<
+    React.ComponentProps<typeof ResizableButton>['onKeyDownResizeHandler']
+  >(
    (keyDownEvent) => {
      let height = editorHeight;
      if (
--- a/packages/kbn-unified-data-table/src/hooks/use_selected_docs.ts
+++ b/packages/kbn-unified-data-table/src/hooks/use_selected_docs.ts
@ -82,7 +82,7 @@ export const useSelectedDocs = (docMap: Map<string, DataTableRecord>): UseSelect
  const selectedDocsCount = selectedDocIds.length;

  const getCountOfFilteredSelectedDocs = useCallback(
-    (docIds) => {
+    (docIds: string[]) => {
      if (!selectedDocsCount) {
        return 0;
      }
--- a/src/plugins/controls/public/react_controls/controls/data_controls/options_list_control/components/options_list_popover_suggestions.tsx
+++ b/src/plugins/controls/public/react_controls/controls/data_controls/options_list_control/components/options_list_popover_suggestions.tsx
@ -155,7 +155,7 @@ export const OptionsListPopoverSuggestions = ({
  }, [api.loadMoreSubject, stateManager.requestSize, totalCardinality]);

  const renderOption = useCallback(
-    (option, searchStringValue) => {
+    (option: EuiSelectableOption, searchStringValue: string) => {
      if (!allowExpensiveQueries || searchTechnique === 'exact') return option.label;

      return (
--- a/src/plugins/discover/public/application/doc/components/doc.tsx
+++ b/src/plugins/discover/public/application/doc/components/doc.tsx
@ -14,6 +14,7 @@ import { i18n } from '@kbn/i18n';
 import { ElasticRequestState } from '@kbn/unified-doc-viewer';
 import { useEsDocSearch } from '@kbn/unified-doc-viewer-plugin/public';
 import type { EsDocSearchProps } from '@kbn/unified-doc-viewer-plugin/public/types';
+import type { DataTableRecord } from '@kbn/discover-utils/types';
 import { setBreadcrumbs } from '../../../utils/breadcrumbs';
 import { useDiscoverServices } from '../../../hooks/use_discover_services';
 import { SingleDocViewer } from './single_doc_viewer';
@ -43,7 +44,7 @@ export function Doc(props: DocProps) {
  }, [profilesManager, core, dataView]);

  const onProcessRecord = useCallback(
-    (record) => {
+    (record: DataTableRecord) => {
      return profilesManager.resolveDocumentProfile({ record });
    },
    [profilesManager]
--- a/src/plugins/discover/public/application/main/components/field_stats_table/field_stats_table.tsx
+++ b/src/plugins/discover/public/application/main/components/field_stats_table/field_stats_table.tsx
@ -20,6 +20,7 @@ import {
  SmartFieldFallbackTooltip,
 } from '@kbn/unified-field-list';
 import type { DataVisualizerTableItem } from '@kbn/data-visualizer-plugin/public/application/common/components/stats_table/types';
+import type { DataVisualizerTableState } from '@kbn/data-visualizer-plugin/common/types';
 import { isOfAggregateQueryType } from '@kbn/es-query';
 import { useDiscoverServices } from '../../../../hooks/use_discover_services';
 import { FIELD_STATISTICS_LOADED } from './constants';
@ -146,7 +147,7 @@ export const FieldStatisticsTable = React.memo((props: FieldStatisticsTableProps
  );

  const updateState = useCallback(
-    (changes) => {
+    (changes: Partial<DataVisualizerTableState>) => {
      if (changes.showDistributions !== undefined && stateContainer) {
        stateContainer.appState.update({ hideAggregatedPreview: !changes.showDistributions }, true);
      }
--- a/src/plugins/discover/public/application/main/components/top_nav/esql_dataview_transition/esql_dataview_transition_modal.tsx
+++ b/src/plugins/discover/public/application/main/components/top_nav/esql_dataview_transition/esql_dataview_transition_modal.tsx
@ -34,7 +34,7 @@ export default function ESQLToDataViewTransitionModal({
  onClose,
 }: ESQLToDataViewTransitionModalProps) {
  const [dismissModalChecked, setDismissModalChecked] = useState(false);
-  const onTransitionModalDismiss = useCallback((e) => {
+  const onTransitionModalDismiss = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
    setDismissModalChecked(e.target.checked);
  }, []);

--- a/src/plugins/discover/public/embeddable/get_search_embeddable_factory.tsx
+++ b/src/plugins/discover/public/embeddable/get_search_embeddable_factory.tsx
@ -27,6 +27,7 @@ import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render';
 import { VIEW_MODE } from '@kbn/saved-search-plugin/common';
 import { SearchResponseIncompleteWarning } from '@kbn/search-response-warnings/src/types';

+import type { DocViewFilterFn } from '@kbn/unified-doc-viewer/types';
 import { getValidViewMode } from '../application/main/utils/get_valid_view_mode';
 import { DiscoverServices } from '../build_services';
 import { SearchEmbeddablFieldStatsTableComponent } from './components/search_embeddable_field_stats_table_component';
@ -242,9 +243,9 @@ export const getSearchEmbeddableFactory = ({
            return dataViews![0];
          }, [dataViews]);

-          const onAddFilter = useCallback(
+          const onAddFilter = useCallback<DocViewFilterFn>(
            async (field, value, operator) => {
-              if (!dataView) return;
+              if (!dataView || !field) return;

              let newFilters = generateFilters(
                discoverServices.filterManager,
--- a/src/plugins/esql_datagrid/public/data_grid.tsx
+++ b/src/plugins/esql_datagrid/public/data_grid.tsx
@ -13,6 +13,7 @@ import {
  DataLoadingState,
  type SortOrder,
  renderCustomToolbar,
+  UnifiedDataTableRenderCustomToolbarProps,
 } from '@kbn/unified-data-table';
 import { i18n } from '@kbn/i18n';
 import { EuiLink, EuiText, EuiIcon } from '@elastic/eui';
@ -67,7 +68,7 @@ const DataGrid: React.FC<ESQLDataGridProps> = (props) => {
  );
  const [rowsPerPage, setRowsPerPage] = useState(DEFAULT_ROWS_PER_PAGE);

-  const onSetColumns = useCallback((columns) => {
+  const onSetColumns = useCallback((columns: string[]) => {
    setActiveColumns(columns);
  }, []);

@ -146,7 +147,7 @@ const DataGrid: React.FC<ESQLDataGridProps> = (props) => {
  }, [props.share?.url.locators]);

  const renderToolbar = useCallback(
-    (customToolbarProps) => {
+    (customToolbarProps: UnifiedDataTableRenderCustomToolbarProps) => {
      const discoverLink = discoverLocator?.getRedirectUrl({
        dataViewSpec: props.dataView.toSpec(),
        timeRange: props.data.query.timefilter.timefilter.getTime(),
--- a/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/table.tsx
+++ b/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/table.tsx
@ -24,6 +24,7 @@ import {
  useResizeObserver,
  EuiSwitch,
  useEuiTheme,
+  EuiSwitchEvent,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { css } from '@emotion/react';
@ -367,7 +368,7 @@ export const DocViewerTable = ({
  );

  const onHideNullValuesChange = useCallback(
-    (e) => {
+    (e: EuiSwitchEvent) => {
      setAreNullValuesHidden(e.target.checked);
    },
    [setAreNullValuesHidden]
--- a/src/plugins/vis_types/timelion/public/components/timelion_vis_component.tsx
+++ b/src/plugins/vis_types/timelion/public/components/timelion_vis_component.tsx
@ -19,6 +19,7 @@ import {
  Placement,
  Tooltip,
  LegendValue,
+  BrushEndListener,
 } from '@elastic/charts';
 import { EuiTitle } from '@elastic/eui';
 import { RangeFilterParams } from '@kbn/es-query';
@ -120,7 +121,7 @@ export const TimelionVisComponent = ({
    isDateHistogram: true,
  });

-  const brushEndListener = useCallback(
+  const brushEndListener = useCallback<BrushEndListener>(
    ({ x }) => {
      if (!x) {
        return;
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/assistant_header/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/assistant_header/index.tsx
@ -110,7 +110,7 @@ export const AssistantHeader: React.FC<Props> = ({
  const showDestroyModal = useCallback(() => setIsResetConversationModalVisible(true), []);

  const onConversationChange = useCallback(
-    (updatedConversation) => {
+    (updatedConversation: Conversation) => {
      onConversationSelected({
        cId: updatedConversation.id,
        cTitle: updatedConversation.title,
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/common/components/assistant_settings_management/pagination/use_session_pagination.ts
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/common/components/assistant_settings_management/pagination/use_session_pagination.ts
@ -48,7 +48,11 @@ export const useSessionPagination = ({
  );

  const onTableChange = useCallback(
-    ({ page, sort }) => {
+    ({
+      page,
+      sort,
+    }: // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    any) => {
      setSessionStorageTableOptions({
        page,
        sort,
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_selector_settings/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_selector_settings/index.tsx
@ -100,7 +100,8 @@ export const ConversationSelectorSettings: React.FC<Props> = React.memo(

    // Callback for when user types to create a new conversation
    const onCreateOption = useCallback(
-      (searchValue, flattenedOptions = []) => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (searchValue: any, flattenedOptions: any = []) => {
        if (!searchValue || !searchValue.trim().toLowerCase()) {
          return;
        }
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings/conversation_settings_editor.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings/conversation_settings_editor.tsx
@ -18,7 +18,7 @@ import { Conversation } from '../../../..';
 import * as i18n from './translations';
 import * as i18nModel from '../../../connectorland/models/model_selector/translations';

-import { ConnectorSelector } from '../../../connectorland/connector_selector';
+import { AIConnector, ConnectorSelector } from '../../../connectorland/connector_selector';
 import { SelectSystemPrompt } from '../../prompt_editor/system_prompt/select_system_prompt';
 import { ModelSelector } from '../../../connectorland/models/model_selector/model_selector';
 import { useLoadConnectors } from '../../../connectorland/use_load_connectors';
@ -140,7 +140,7 @@ export const ConversationSettingsEditor: React.FC<ConversationSettingsEditorProp
      [selectedConversation]
    );
    const handleOnConnectorSelectionChange = useCallback(
-      (connector) => {
+      (connector: AIConnector) => {
        if (selectedConversation != null) {
          const config = getGenAiConfig(connector);
          const updatedConversation = {
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings_management/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings_management/index.tsx
@ -121,7 +121,8 @@ const ConversationSettingsManagementComponent: React.FC<Props> = ({
  );

  const setAssistantStreamingEnabled = useCallback(
-    (value) => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (value: any) => {
      setHasPendingChanges(true);
      setUpdatedAssistantStreamingEnabled(value);
    },
@ -259,11 +260,10 @@ const ConversationSettingsManagementComponent: React.FC<Props> = ({
  const columns = useMemo(
    () =>
      getColumns({
-        conversations: conversationSettings,
        onDeleteActionClicked,
        onEditActionClicked,
      }),
-    [conversationSettings, getColumns, onDeleteActionClicked, onEditActionClicked]
+    [getColumns, onDeleteActionClicked, onEditActionClicked]
  );

  const confirmationTitle = useMemo(
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings_management/use_conversations_table.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/conversations/conversation_settings_management/use_conversations_table.tsx
@ -40,6 +40,9 @@ export const useConversationsTable = () => {
    ({
      onDeleteActionClicked,
      onEditActionClicked,
+    }: {
+      onDeleteActionClicked: (conversation: ConversationTableItem) => void;
+      onEditActionClicked: (conversation: ConversationTableItem) => void;
    }): Array<EuiBasicTableColumn<ConversationTableItem>> => {
      return [
        {
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/select_system_prompt/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/select_system_prompt/index.tsx
@ -128,7 +128,7 @@ const SelectSystemPromptComponent: React.FC<Props> = ({
  );

  const onChange = useCallback(
-    async (selectedSystemPromptId) => {
+    async (selectedSystemPromptId: string) => {
      if (selectedSystemPromptId === ADD_NEW_SYSTEM_PROMPT) {
        setIsSettingsModalVisible(true);
        setSelectedSettingsTab(SYSTEM_PROMPTS_TAB);
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_modal/system_prompt_editor.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_modal/system_prompt_editor.tsx
@ -292,7 +292,7 @@ export const SystemPromptEditorComponent: React.FC<Props> = ({
  );

  const handleNewConversationDefaultChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      const isChecked = e.target.checked;
      const defaultNewSystemPrompts = systemPromptSettings.filter(
        (p) => p.isNewConversationDefault
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_modal/system_prompt_selector/system_prompt_selector.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_modal/system_prompt_selector/system_prompt_selector.tsx
@ -95,7 +95,8 @@ export const SystemPromptSelector: React.FC<Props> = React.memo(

    // Callback for when user types to create a new system prompt
    const onCreateOption = useCallback(
-      (searchValue, flattenedOptions = []) => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (searchValue: any, flattenedOptions: any[] = []) => {
        if (!searchValue || !searchValue.trim().toLowerCase()) {
          return;
        }
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_settings_management/default_conversations_column.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_editor/system_prompt/system_prompt_settings_management/default_conversations_column.tsx
@ -24,9 +24,9 @@ export const DefaultConversationsColumn: React.FC<Props> = React.memo(
      : Math.min(maxConversationsToShow, defaultConversations.length);
    const itemsToDisplay = defaultConversations.slice(0, currentDisplaying - 1);

-    const toggleContent = useCallback((prev) => {
-      setIsExpanded(!prev);
-    }, []);
+    const toggleContent = useCallback(() => {
+      setIsExpanded(!isExpanded);
+    }, [isExpanded]);

    if (!defaultConversations || defaultConversations?.length === 0) {
      return null;
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_textarea/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/prompt_textarea/index.tsx
@ -28,13 +28,13 @@ export const PromptTextArea = forwardRef<HTMLTextAreaElement, Props>(
    );

    const onKeyDown = useCallback(
-      (event) => {
+      (event: React.KeyboardEvent<HTMLTextAreaElement>) => {
        // keyCode 13 is needed in case of IME input
        if (event.keyCode === 13 && !event.shiftKey) {
          event.preventDefault();

          if (value.trim().length) {
-            onPromptSubmit(event.target.value?.trim());
+            onPromptSubmit(event.currentTarget.value?.trim());
            setUserPrompt('');
          } else {
            event.stopPropagation();
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/quick_prompts/quick_prompt_selector/quick_prompt_selector.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/quick_prompts/quick_prompt_selector/quick_prompt_selector.tsx
@ -94,7 +94,8 @@ export const QuickPromptSelector: React.FC<Props> = React.memo(

    // Callback for when user types to create a new quick prompt
    const onCreateOption = useCallback(
-      (searchValue, flattenedOptions = []) => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (searchValue: any, flattenedOptions: any[] = []) => {
        if (!searchValue || !searchValue.trim().toLowerCase()) {
          return;
        }
--- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/settings/evaluation_settings/evaluation_settings.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/settings/evaluation_settings/evaluation_settings.tsx
@ -55,9 +55,9 @@ export const EvaluationSettings: React.FC = React.memo(() => {

  // Run Details
  // Run Name
-  const [runName, setRunName] = useState();
+  const [runName, setRunName] = useState<string | undefined>();
  const onRunNameChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setRunName(e.target.value);
    },
    [setRunName]
@ -65,19 +65,19 @@ export const EvaluationSettings: React.FC = React.memo(() => {
  /** Trace Options **/
  const [showTraceOptions, setShowTraceOptions] = useState(false);
  const onApmUrlChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setTraceOptions({ ...traceOptions, apmUrl: e.target.value });
    },
    [setTraceOptions, traceOptions]
  );
  const onLangSmithProjectChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setTraceOptions({ ...traceOptions, langSmithProject: e.target.value });
    },
    [setTraceOptions, traceOptions]
  );
  const onLangSmithApiKeyChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setTraceOptions({ ...traceOptions, langSmithApiKey: e.target.value });
    },
    [setTraceOptions, traceOptions]
--- a/x-pack/packages/kbn-elastic-assistant/impl/data_anonymization/settings/anonymization_settings/use_anonymization_list_update.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/data_anonymization/settings/anonymization_settings/use_anonymization_list_update.tsx
@ -11,7 +11,7 @@ import { PerformAnonymizationFieldsBulkActionRequestBody } from '@kbn/elastic-as

 import { BatchUpdateListItem } from '../../../data_anonymization_editor/context_editor/types';

-interface Props {
+export interface UseAnonymizationListUpdateProps {
  anonymizationFields: FindAnonymizationFieldsResponse;
  anonymizationFieldsBulkActions: PerformAnonymizationFieldsBulkActionRequestBody;
  setAnonymizationFieldsBulkActions: React.Dispatch<
@ -27,7 +27,7 @@ export const useAnonymizationListUpdate = ({
  anonymizationFieldsBulkActions,
  setAnonymizationFieldsBulkActions,
  setUpdatedAnonymizationData,
-}: Props) => {
+}: UseAnonymizationListUpdateProps) => {
  const onListUpdated = useCallback(
    async (updates: BatchUpdateListItem[]) => {
      const updatedFieldsKeys = updates.map((u) => u.field);
--- a/x-pack/packages/kbn-elastic-assistant/impl/data_anonymization/settings/anonymization_settings_management/index.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/data_anonymization/settings/anonymization_settings_management/index.tsx
@ -12,7 +12,10 @@ import { euiThemeVars } from '@kbn/ui-theme';
 import { Stats } from '../../../data_anonymization_editor/stats';
 import { ContextEditor } from '../../../data_anonymization_editor/context_editor';
 import * as i18n from '../anonymization_settings/translations';
-import { useAnonymizationListUpdate } from '../anonymization_settings/use_anonymization_list_update';
+import {
+  useAnonymizationListUpdate,
+  UseAnonymizationListUpdateProps,
+} from '../anonymization_settings/use_anonymization_list_update';
 import {
  DEFAULT_ANONYMIZATION_FIELDS,
  DEFAULT_CONVERSATIONS,
@ -70,7 +73,9 @@ const AnonymizationSettingsManagementComponent: React.FC<Props> = ({ defaultPage
    handleSave();
  }, [handleSave]);

-  const handleAnonymizationFieldsBulkActions = useCallback(
+  const handleAnonymizationFieldsBulkActions = useCallback<
+    UseAnonymizationListUpdateProps['setAnonymizationFieldsBulkActions']
+  >(
    (value) => {
      setHasPendingChanges(true);
      setAnonymizationFieldsBulkActions(value);
@ -78,7 +83,9 @@ const AnonymizationSettingsManagementComponent: React.FC<Props> = ({ defaultPage
    [setAnonymizationFieldsBulkActions]
  );

-  const handleUpdatedAnonymizationData = useCallback(
+  const handleUpdatedAnonymizationData = useCallback<
+    UseAnonymizationListUpdateProps['setUpdatedAnonymizationData']
+  >(
    (value) => {
      setHasPendingChanges(true);
      setUpdatedAnonymizationData(value);
--- a/x-pack/packages/kbn-elastic-assistant/impl/knowledge_base/knowledge_base_settings_management.tsx
+++ b/x-pack/packages/kbn-elastic-assistant/impl/knowledge_base/knowledge_base_settings_management.tsx
@ -68,7 +68,8 @@ export const KnowledgeBaseSettingsManagement: React.FC = React.memo(() => {
  );

  const handleUpdateKnowledgeBaseSettings = useCallback(
-    (updatedKnowledgebase) => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (updatedKnowledgebase: any) => {
      setHasPendingChanges(true);
      setUpdatedKnowledgeBaseSettings(updatedKnowledgebase);
    },
--- a/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/index.tsx
+++ b/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/index.tsx
@ -115,7 +115,7 @@ const PatternComponent: React.FC<Props> = ({
  }, []);

  const handleFlyoutIndexExpandAction = useCallback(
-    (indexName) => {
+    (indexName: string) => {
      checkIndex({
        abortController: flyoutIndexExpandActionAbortControllerRef.current,
        indexName,
@ -130,7 +130,7 @@ const PatternComponent: React.FC<Props> = ({
  );

  const handleTableRowIndexCheckNowAction = useCallback(
-    (indexName) => {
+    (indexName: string) => {
      checkIndex({
        abortController: tableRowIndexCheckNowActionAbortControllerRef.current,
        indexName,
--- a/x-pack/plugins/cases/public/components/case_form_fields/assignees.tsx
+++ b/x-pack/plugins/cases/public/components/case_form_fields/assignees.tsx
@ -113,45 +113,48 @@ const AssigneesFieldComponent: React.FC<FieldProps> = React.memo(
      setValue([...selectedAssignees, { uid: currentUserProfile.uid }]);
    }, [currentUserProfile, selectedAssignees, setValue]);

-    const renderOption = useCallback((option, searchValue: string, contentClassName: string) => {
-      const { user, data } = option as UserProfileComboBoxOption;
+    const renderOption = useCallback(
+      (option: EuiComboBoxOptionOption<string>, searchValue: string, contentClassName: string) => {
+        const { user, data } = option as UserProfileComboBoxOption;

-      const displayName = getUserDisplayName(user);
+        const displayName = getUserDisplayName(user);

-      return (
-        <EuiFlexGroup
-          alignItems="center"
-          justifyContent="flexStart"
-          gutterSize="s"
-          responsive={false}
-        >
-          <EuiFlexItem grow={false}>
-            <UserAvatar user={user} avatar={data.avatar} size="s" />
-          </EuiFlexItem>
+        return (
          <EuiFlexGroup
            alignItems="center"
-            justifyContent="spaceBetween"
-            gutterSize="none"
+            justifyContent="flexStart"
+            gutterSize="s"
            responsive={false}
          >
-            <EuiFlexItem>
-              <EuiHighlight search={searchValue} className={contentClassName}>
-                {displayName}
-              </EuiHighlight>
+            <EuiFlexItem grow={false}>
+              <UserAvatar user={user} avatar={data.avatar} size="s" />
            </EuiFlexItem>
-            {user.email && user.email !== displayName ? (
-              <EuiFlexItem grow={false}>
-                <EuiTextColor color={'subdued'}>
-                  <EuiHighlight search={searchValue} className={contentClassName}>
-                    {user.email}
-                  </EuiHighlight>
-                </EuiTextColor>
+            <EuiFlexGroup
+              alignItems="center"
+              justifyContent="spaceBetween"
+              gutterSize="none"
+              responsive={false}
+            >
+              <EuiFlexItem>
+                <EuiHighlight search={searchValue} className={contentClassName}>
+                  {displayName}
+                </EuiHighlight>
              </EuiFlexItem>
-            ) : null}
+              {user.email && user.email !== displayName ? (
+                <EuiFlexItem grow={false}>
+                  <EuiTextColor color={'subdued'}>
+                    <EuiHighlight search={searchValue} className={contentClassName}>
+                      {user.email}
+                    </EuiHighlight>
+                  </EuiTextColor>
+                </EuiFlexItem>
+              ) : null}
+            </EuiFlexGroup>
          </EuiFlexGroup>
-        </EuiFlexGroup>
-      );
-    }, []);
+        );
+      },
+      []
+    );

    const isCurrentUserSelected = Boolean(
      selectedAssignees?.find((assignee) => assignee.uid === currentUserProfile?.uid)
--- a/x-pack/plugins/cases/public/components/configure_cases/index.tsx
+++ b/x-pack/plugins/cases/public/components/configure_cases/index.tsx
@ -28,6 +28,7 @@ import type {
  CustomFieldConfiguration,
  TemplateConfiguration,
  CustomFieldTypes,
+  ActionConnector,
 } from '../../../common/types/domain';
 import { useKibana } from '../../common/lib/kibana';
 import { useGetActionTypes } from '../../containers/configure/use_action_types';
@ -159,8 +160,8 @@ export const ConfigureCases: React.FC = React.memo(() => {
  } = useGetActionTypes();

  const onConnectorUpdated = useCallback(
-    async (updatedConnector) => {
-      setEditedConnectorItem(updatedConnector);
+    async (updatedConnector: ActionConnector) => {
+      setEditedConnectorItem(updatedConnector as ActionConnectorTableItem);
      refetchConnectors();
      refetchActionTypes();
      refetchCaseConfigure();
@ -169,7 +170,7 @@ export const ConfigureCases: React.FC = React.memo(() => {
  );

  const onConnectorCreated = useCallback(
-    async (createdConnector) => {
+    async (createdConnector: ActionConnector) => {
      const caseConnector = normalizeActionConnector(createdConnector);

      await persistCaseConfigureAsync({
--- a/x-pack/plugins/cases/public/components/create/form_context.tsx
+++ b/x-pack/plugins/cases/public/components/create/form_context.tsx
@ -52,7 +52,7 @@ export const FormContext: React.FC<Props> = ({
  const { startTransaction } = useCreateCaseWithAttachmentsTransaction();

  const submitCase = useCallback(
-    async (data: CasePostRequest, isValid) => {
+    async (data: CasePostRequest, isValid: boolean) => {
      if (isValid) {
        startTransaction({ appId, attachments });

--- a/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/plugin.tsx
+++ b/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/plugin.tsx
@ -26,9 +26,11 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import { useLocation } from 'react-router-dom';
 import { css } from '@emotion/react';

-import type { TypedLensByValueInput } from '@kbn/lens-plugin/public';
+import type { TypedLensByValueInput, LensSavedObjectAttributes } from '@kbn/lens-plugin/public';
 import type { EmbeddablePackageState } from '@kbn/embeddable-plugin/public';
 import { SavedObjectFinder } from '@kbn/saved-objects-finder-plugin/public';
+import type { SavedObjectCommon } from '@kbn/saved-objects-finder-plugin/common';
+import type { TimeRange } from '@kbn/data-plugin/common';
 import { useKibana } from '../../../../common/lib/kibana';
 import { DRAFT_COMMENT_STORAGE_ID, ID } from './constants';
 import { CommentEditorContext } from '../../context';
@ -37,7 +39,7 @@ import { VISUALIZATION } from './translations';
 import { useIsMainApplication } from '../../../../common/hooks';
 import { convertToAbsoluteTimeRange } from '../../../visualizations/actions/convert_to_absolute_time_range';

-const DEFAULT_TIMERANGE = {
+const DEFAULT_TIMERANGE: TimeRange = {
  from: 'now-7d',
  to: 'now',
  mode: 'relative',
@ -87,7 +89,7 @@ const LensEditorComponent: LensEuiMarkdownEditorUiPlugin['editor'] = ({
  }, [clearDraftComment, currentAppId, embeddable, onCancel]);

  const handleAdd = useCallback(
-    (attributes, timeRange) => {
+    (attributes: Record<string, unknown>, timeRange?: TimeRange) => {
      onSave(
        `!{${ID}${JSON.stringify({
          timeRange: convertToAbsoluteTimeRange(timeRange),
@ -104,7 +106,11 @@ const LensEditorComponent: LensEuiMarkdownEditorUiPlugin['editor'] = ({
  );

  const handleUpdate = useCallback(
-    (attributes, timeRange, position) => {
+    (
+      attributes: Record<string, unknown>,
+      timeRange: TimeRange | undefined,
+      position: EuiMarkdownAstNodePosition
+    ) => {
      markdownContext.replaceNode(
        position,
        `!{${ID}${JSON.stringify({
@ -152,7 +158,7 @@ const LensEditorComponent: LensEuiMarkdownEditorUiPlugin['editor'] = ({
  ]);

  const handleEditInLensClick = useCallback(
-    (lensAttributes?, timeRange = DEFAULT_TIMERANGE) => {
+    (lensAttributes?: Record<string, unknown>, timeRange: TimeRange = DEFAULT_TIMERANGE) => {
      storage.set(DRAFT_COMMENT_STORAGE_ID, {
        commentId: commentEditorContext?.editorId,
        comment: commentEditorContext?.value,
@ -166,7 +172,7 @@ const LensEditorComponent: LensEuiMarkdownEditorUiPlugin['editor'] = ({
          ? {
              id: '',
              timeRange,
-              attributes: lensAttributes || node?.attributes,
+              attributes: (lensAttributes || node?.attributes) as LensSavedObjectAttributes,
            }
          : undefined,
        {
@ -190,7 +196,12 @@ const LensEditorComponent: LensEuiMarkdownEditorUiPlugin['editor'] = ({
  );

  const handleChooseLensSO = useCallback(
-    (savedObjectId, savedObjectType, fullName, savedObject) => {
+    (
+      savedObjectId: string,
+      savedObjectType: string,
+      fullName: string,
+      savedObject: SavedObjectCommon
+    ) => {
      handleEditInLensClick({
        ...savedObject.attributes,
        title: '',
--- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/embeddables/field_stats/field_stats_esql_editor.tsx
+++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/embeddables/field_stats/field_stats_esql_editor.tsx
@ -13,7 +13,7 @@ interface FieldStatsESQLEditorProps {
  canEditTextBasedQuery?: boolean;
  query: AggregateQuery;
  setQuery: (query: AggregateQuery) => void;
-  onQuerySubmit: (query: AggregateQuery, abortController: AbortController) => Promise<void>;
+  onQuerySubmit: (query: AggregateQuery, abortController?: AbortController) => Promise<void>;
 }
 export const FieldStatsESQLEditor = ({
  canEditTextBasedQuery = true,
@ -25,7 +25,7 @@ export const FieldStatsESQLEditor = ({
  const [isVisualizationLoading, setIsVisualizationLoading] = useState(false);

  const onTextLangQuerySubmit = useCallback(
-    async (q, abortController) => {
+    async (q?: AggregateQuery, abortController?: AbortController) => {
      if (q && onQuerySubmit) {
        setIsVisualizationLoading(true);
        await onQuerySubmit(q, abortController);
--- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/embeddables/field_stats/field_stats_initializer.tsx
+++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/embeddables/field_stats/field_stats_initializer.tsx
@ -95,7 +95,7 @@ export const FieldStatisticsInitializer: FC<FieldStatsInitializerProps> = ({
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [dataViewId, viewType, esqlQuery.esql, isEsqlMode]);
  const onESQLQuerySubmit = useCallback(
-    async (query: AggregateQuery, abortController: AbortController) => {
+    async (query: AggregateQuery, abortController?: AbortController) => {
      const adhocDataView = await getESQLAdHocDataview(query.esql, dataViews);
      if (adhocDataView && adhocDataView.id) {
        setDataViewId(adhocDataView.id);
--- a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/components/agent_policy_advanced_fields/custom_fields/global_data_tags_table.test.tsx
+++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/components/agent_policy_advanced_fields/custom_fields/global_data_tags_table.test.tsx
@ -44,8 +44,11 @@ describe('GlobalDataTagsTable', () => {
        global_data_tags: tags,
      });

-      const updateAgentPolicy = React.useCallback((policy) => {
+      const updateAgentPolicy = React.useCallback<
+        React.ComponentProps<typeof GlobalDataTagsTable>['updateAgentPolicy']
+      >((policy) => {
        mockUpdateAgentPolicy(policy);
+        // @ts-expect-error - TODO: fix this, types do not match
        _updateAgentPolicy(policy);
      }, []);

--- a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/edit_package_policy_page/hooks/use_package_policy_steps.tsx
+++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/edit_package_policy_page/hooks/use_package_policy_steps.tsx
@ -84,7 +84,7 @@ export function usePackagePolicySteps({
  );

  const updateSelectedPolicyTab = useCallback(
-    (currentTab) => {
+    (currentTab: SelectedPolicyTab) => {
      setSelectedPolicyTab(currentTab);
      setPolicyValidation(currentTab, newAgentPolicy);
    },
--- a/x-pack/plugins/index_management/public/application/sections/home/index_list/details_page/details_page_filter_fields.tsx
+++ b/x-pack/plugins/index_management/public/application/sections/home/index_list/details_page/details_page_filter_fields.tsx
@ -39,7 +39,7 @@ export const MappingsFilter: React.FC<Props> = ({
  const [isFilterByPopoverVisible, setIsFilterPopoverVisible] = useState<boolean>(false);
  const dispatch = useDispatch();
  const setSelectedOptions = useCallback(
-    (options) => {
+    (options: EuiSelectableOption[]) => {
      dispatch({
        type: 'filter:update',
        value: {
--- a/x-pack/plugins/integration_assistant/public/components/create_integration_card_button/create_integration_card_button.tsx
+++ b/x-pack/plugins/integration_assistant/public/components/create_integration_card_button/create_integration_card_button.tsx
@ -51,7 +51,7 @@ export const CreateIntegrationCardButton = React.memo<CreateIntegrationCardButto

    const href = useMemo(() => getUrlForApp('integrations', { path: '/create' }), [getUrlForApp]);
    const navigate = useCallback(
-      (ev) => {
+      (ev: React.MouseEvent<HTMLAnchorElement>) => {
        ev.preventDefault();
        navigateToUrl(href);
      },
--- a/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx
@ -321,7 +321,7 @@ export function LensEditConfigurationFlyout({
  });

  const runQuery = useCallback(
-    async (q, abortController) => {
+    async (q: AggregateQuery, abortController?: AbortController) => {
      const attrs = await getSuggestions(
        q,
        startDependencies,
--- a/x-pack/plugins/lens/public/visualizations/partition/dimension_editor.tsx
+++ b/x-pack/plugins/lens/public/visualizations/partition/dimension_editor.tsx
@ -51,7 +51,7 @@ export function DimensionEditor(props: DimensionEditorProps) {
  const [useNewColorMapping, setUseNewColorMapping] = useState(canUseColorMapping);

  const setConfig = useCallback(
-    ({ color }) => {
+    ({ color }: { color?: string }) => {
      if (!currentLayer) {
        return;
      }
--- a/x-pack/plugins/lens/public/visualizations/partition/toolbar.tsx
+++ b/x-pack/plugins/lens/public/visualizations/partition/toolbar.tsx
@ -95,36 +95,36 @@ export function PieToolbar(props: VisualizationToolbarProps<PieVisualizationStat
  );

  const onCategoryDisplayChange = useCallback(
-    (option) => onStateChange({ categoryDisplay: option }),
+    (option: unknown) => onStateChange({ categoryDisplay: option }),
    [onStateChange]
  );

  const onNumberDisplayChange = useCallback(
-    (option) => onStateChange({ numberDisplay: option }),
+    (option: unknown) => onStateChange({ numberDisplay: option }),
    [onStateChange]
  );

  const onPercentDecimalsChange = useCallback(
-    (option) => {
+    (option: unknown) => {
      onStateChange({ percentDecimals: option });
    },
    [onStateChange]
  );

  const onLegendDisplayChange = useCallback(
-    (optionId) => {
+    (optionId: unknown) => {
      onStateChange({ legendDisplay: legendOptions.find(({ id }) => id === optionId)!.value });
    },
    [onStateChange]
  );

  const onLegendPositionChange = useCallback(
-    (id) => onStateChange({ legendPosition: id as Position }),
+    (id: unknown) => onStateChange({ legendPosition: id as Position }),
    [onStateChange]
  );

  const onNestedLegendChange = useCallback(
-    (id) => onStateChange({ nestedLegend: !layer.nestedLegend }),
+    (id: unknown) => onStateChange({ nestedLegend: !layer.nestedLegend }),
    [layer, onStateChange]
  );

@ -134,24 +134,24 @@ export function PieToolbar(props: VisualizationToolbarProps<PieVisualizationStat
  }, [layer, onStateChange]);

  const onLegendMaxLinesChange = useCallback(
-    (val) => onStateChange({ legendMaxLines: val }),
+    (val: unknown) => onStateChange({ legendMaxLines: val }),
    [onStateChange]
  );

  const onLegendSizeChange = useCallback(
-    (val) => onStateChange({ legendSize: val }),
+    (val: unknown) => onStateChange({ legendSize: val }),
    [onStateChange]
  );

  const onLegendStatsChange = useCallback(
-    (legendStats) => {
+    (legendStats: unknown) => {
      onStateChange({ legendStats });
    },
    [onStateChange]
  );

  const onEmptySizeRatioChange = useCallback(
-    (sizeId) => {
+    (sizeId: unknown) => {
      const emptySizeRatio = emptySizeRatioOptions?.find(({ id }) => id === sizeId)?.value;
      onStateChange({ emptySizeRatio });
    },
--- a/x-pack/plugins/observability_solution/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/context/waterfall_context.tsx
+++ b/x-pack/plugins/observability_solution/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/context/waterfall_context.tsx
@ -63,7 +63,7 @@ export function WaterfallContextProvider({
  }, [tree]);

  const getErrorCount = useCallback(
-    (waterfallItemId) => waterfall.getErrorCount(waterfallItemId),
+    (waterfallItemId: string) => waterfall.getErrorCount(waterfallItemId),
    [waterfall]
  );

--- a/x-pack/plugins/observability_solution/infra/public/alerting/inventory/components/metric.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/alerting/inventory/components/metric.tsx
@ -126,7 +126,7 @@ export const MetricExpression = ({
  }, [customMetricTabOpen, metric, customMetric, firstFieldOption]);

  const onChangeTab = useCallback(
-    (id) => {
+    (id: string) => {
      if (id === 'metric-popover-custom') {
        setCustomMetricTabOpen(true);
        onChange('custom');
@ -139,7 +139,7 @@ export const MetricExpression = ({
  );

  const onAggregationChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLSelectElement>) => {
      const value = e.target.value;
      const aggValue: SnapshotCustomAggregation = SnapshotCustomAggregationRT.is(value)
        ? value
@ -166,7 +166,7 @@ export const MetricExpression = ({

  const debouncedOnChangeCustom = debounce(onChangeCustom, 500);
  const onLabelChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setFieldDisplayedCustomLabel(e.target.value);
      const newCustomMetric = {
        ...customMetric,
--- a/x-pack/plugins/observability_solution/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_indices_form.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_indices_form.tsx
@ -11,7 +11,7 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import React, { useCallback, useMemo } from 'react';
 import { ApplicationStart } from '@kbn/core-application-browser';
 import { useKibanaContextForPlugin } from '../../../../hooks/use_kibana';
-import { QualityWarning } from '../../../../../common/log_analysis';
+import { DatasetFilter, QualityWarning } from '../../../../../common/log_analysis';
 import { LoadingOverlayWrapper } from '../../../loading_overlay_wrapper';
 import { IndexSetupRow } from './index_setup_row';
 import { AvailableIndex, ValidationIndicesError } from './validation';
@ -58,7 +58,7 @@ export const AnalysisSetupIndicesForm: React.FunctionComponent<{
  );

  const changeDatasetFilter = useCallback(
-    (indexName: string, datasetFilter) => {
+    (indexName: string, datasetFilter: DatasetFilter) => {
      onChangeSelectedIndices(
        indices.map((index) => {
          return index.name === indexName ? { ...index, datasetFilter } : index;
--- a/x-pack/plugins/observability_solution/infra/public/components/logging/log_highlights_menu.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/components/logging/log_highlights_menu.tsx
@ -68,7 +68,7 @@ export const LogHighlightsMenu: React.FC<LogHighlightsMenuProps> = ({
    [debouncedOnChange]
  );
  const changeHighlightTerm = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      const value = e.target.value;
      setHighlightTerm(value);
    },
--- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/inventory_view/components/waffle/metric_control/custom_metric_form.tsx
+++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/inventory_view/components/waffle/metric_control/custom_metric_form.tsx
@ -87,7 +87,7 @@ export const CustomMetricForm = withTheme(({ theme, onCancel, onChange, metric }
  }, [metric, aggregation, field, onChange, label]);

  const handleLabelChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLInputElement>) => {
      setLabel(e.target.value);
    },
    [setLabel]
@ -101,7 +101,7 @@ export const CustomMetricForm = withTheme(({ theme, onCancel, onChange, metric }
  );

  const handleAggregationChange = useCallback(
-    (e) => {
+    (e: React.ChangeEvent<HTMLSelectElement>) => {
      const value = e.target.value;
      const aggValue: SnapshotCustomAggregation = SnapshotCustomAggregationRT.is(value)
        ? value
--- a/x-pack/plugins/observability_solution/logs_shared/public/components/log_stream/log_stream.tsx
+++ b/x-pack/plugins/observability_solution/logs_shared/public/components/log_stream/log_stream.tsx
@ -24,7 +24,7 @@ import { LogViewsClient } from '../../services/log_views';
 import { LogColumnRenderConfiguration } from '../../utils/log_column_render_configuration';
 import { useKibanaQuerySettings } from '../../utils/use_kibana_query_settings';
 import { useLogEntryFlyout } from '../logging/log_entry_flyout';
-import { ScrollableLogTextStreamView } from '../logging/log_text_stream';
+import { ScrollableLogTextStreamView, VisibleInterval } from '../logging/log_text_stream';
 import { LogStreamErrorBoundary } from './log_stream_error_boundary';

 interface LogStreamPluginDeps {
@ -251,7 +251,7 @@ Read more at https://github.com/elastic/kibana/blob/main/src/plugins/kibana_reac

  // Pagination handler
  const handlePagination = useCallback(
-    ({ fromScroll, pagesBeforeStart, pagesAfterEnd }) => {
+    ({ fromScroll, pagesBeforeStart, pagesAfterEnd }: VisibleInterval) => {
      if (!fromScroll) {
        return;
      }
--- a/x-pack/plugins/search_inference_endpoints/public/components/all_inference_endpoints/search/table_search.tsx
+++ b/x-pack/plugins/search_inference_endpoints/public/components/all_inference_endpoints/search/table_search.tsx
@ -15,7 +15,7 @@ interface TableSearchComponentProps {

 export const TableSearch: React.FC<TableSearchComponentProps> = ({ searchKey, setSearchKey }) => {
  const onSearch = useCallback(
-    (newSearch) => {
+    (newSearch: string) => {
      const trimSearch = newSearch.trim();
      setSearchKey(trimSearch);
    },
--- a/x-pack/plugins/search_inference_endpoints/public/components/all_inference_endpoints/tabular_page.tsx
+++ b/x-pack/plugins/search_inference_endpoints/public/components/all_inference_endpoints/tabular_page.tsx
@ -121,7 +121,7 @@ export const TabularPage: React.FC<TabularPageProps> = ({ inferenceEndpoints })
  ];

  const handleTableChange = useCallback(
-    ({ page, sort }) => {
+    ({ page, sort }: any) => {
      const newQueryParams = {
        ...queryParams,
        ...(sort && {
--- a/x-pack/plugins/security_solution/public/assistant/use_assistant_telemetry/index.tsx
+++ b/x-pack/plugins/security_solution/public/assistant/use_assistant_telemetry/index.tsx
@ -29,7 +29,8 @@ export const useAssistantTelemetry = (): AssistantTelemetry => {
    async ({
      fn,
      params: { conversationId, ...rest },
-    }): Promise<{
+    }: // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    any): Promise<{
      fn: keyof AssistantTelemetry;
      params: AssistantTelemetry[keyof AssistantTelemetry];
    }> =>
--- a/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx
@ -12,6 +12,7 @@ import type {
  DraggableProvided,
  DraggableStateSnapshot,
  DraggingStyle,
+  DroppableProvided,
  NotDraggingStyle,
 } from '@hello-pangea/dnd';
 import { Draggable, Droppable } from '@hello-pangea/dnd';
@ -89,7 +90,7 @@ export const ProviderContentWrapper = styled.span`
  }
 `;

-type RenderFunctionProp = (
+export type RenderFunctionProp = (
  props: DataProvider,
  provided: DraggableProvided | null,
  state: DraggableStateSnapshot
@ -156,7 +157,7 @@ const DraggableOnWrapper: React.FC<DraggableWrapperProps> = React.memo(
    );

    const RenderClone = useCallback(
-      (provided, snapshot) => (
+      (provided: DraggableProvided, snapshot: DraggableStateSnapshot) => (
        <ConditionalPortal registerProvider={registerProvider}>
          <div
            {...provided.draggableProps}
@ -178,7 +179,7 @@ const DraggableOnWrapper: React.FC<DraggableWrapperProps> = React.memo(
    );

    const DraggableContent = useCallback(
-      (provided, snapshot) => (
+      (provided: DraggableProvided, snapshot: DraggableStateSnapshot) => (
        <ProviderContainer
          {...provided.draggableProps}
          {...provided.dragHandleProps}
@ -215,7 +216,7 @@ const DraggableOnWrapper: React.FC<DraggableWrapperProps> = React.memo(
    );

    const DroppableContent = useCallback(
-      (droppableProvided) => (
+      (droppableProvided: DroppableProvided) => (
        <div ref={droppableProvided.innerRef} {...droppableProvided.droppableProps}>
          <div
            className={DRAGGABLE_KEYBOARD_WRAPPER_CLASS_NAME}
--- a/x-pack/plugins/security_solution/public/common/components/guided_onboarding_tour/tour_step.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/guided_onboarding_tour/tour_step.tsx
@ -57,7 +57,7 @@ export const SecurityTourStep = React.memo(
    );

    // EUI bug, will remove once bug resolve. will link issue here as soon as i have it
-    const onKeyDown = useCallback((e) => {
+    const onKeyDown = useCallback((e: React.KeyboardEvent<HTMLButtonElement>) => {
      if (e.key === 'Enter') {
        e.stopPropagation();
      }
--- a/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/timeline/plugin.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/timeline/plugin.tsx
@ -45,7 +45,7 @@ const TimelineEditorComponent: React.FC<TimelineEditorProps> = ({ onClosePopover
  );

  const handleTimelineChange = useCallback(
-    (timelineTitle, timelineId, graphEventId) => {
+    (timelineTitle: string, timelineId: string | null, graphEventId?: string) => {
      const url = formatUrl(getTimelineUrl(timelineId ?? '', graphEventId), {
        absolute: true,
        skipSearch: true,
--- a/x-pack/plugins/security_solution/public/detection_engine/rule_details_ui/pages/rule_details/execution_log_table/execution_log_table.tsx
+++ b/x-pack/plugins/security_solution/public/detection_engine/rule_details_ui/pages/rule_details/execution_log_table/execution_log_table.tsx
@ -14,6 +14,7 @@ import type {
  OnRefreshProps,
  OnRefreshChangeProps,
  EuiSwitchEvent,
+  CriteriaWithPagination,
 } from '@elastic/eui';
 import {
  EuiTextColor,
@ -240,14 +241,15 @@ const ExecutionLogTableComponent: React.FC<ExecutionLogTableProps> = ({

  // Callbacks
  const onTableChangeCallback = useCallback(
-    ({ page = {}, sort = {} }) => {
+    ({ page, sort }: CriteriaWithPagination<RuleExecutionResult>) => {
      const { index, size } = page;
-      const { field, direction } = sort;
-
      setPageIndex(index + 1);
      setPageSize(size);
-      setSortField(field);
-      setSortDirection(direction);
+      if (sort) {
+        const { field, direction } = sort;
+        setSortField(field);
+        setSortDirection(direction);
+      }
    },
    [setPageIndex, setPageSize, setSortDirection, setSortField]
  );
--- a/x-pack/plugins/security_solution/public/detection_engine/rule_management/components/rule_details/three_way_diff/versions_picker/versions_picker.tsx
+++ b/x-pack/plugins/security_solution/public/detection_engine/rule_management/components/rule_details/three_way_diff/versions_picker/versions_picker.tsx
@ -28,7 +28,7 @@ export function VersionsPicker({
  );

  const handleChange = useCallback(
-    (changeEvent) => {
+    (changeEvent: React.ChangeEvent<HTMLSelectElement>) => {
      onChange(changeEvent.target.value as SelectedVersions);
    },
    [onChange]
--- a/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/helpers.test.ts
+++ b/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/helpers.test.ts
@ -20,7 +20,7 @@ describe('helpers', () => {
    it('returns checked options when present', () => {
      const payload = [
        ...ruleActivityFilterDefaultOptions,
-        { ...ruleActivityFilterDefaultOptions[0], checked: 'on' },
+        { ...ruleActivityFilterDefaultOptions[0], checked: 'on' as const },
      ];
      expect(extractSelected(payload)).toEqual([ruleActivityFilterDefaultOptions[0].label]);
    });
--- a/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/helpers.ts
+++ b/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/helpers.ts
@ -23,9 +23,9 @@ export const getCardBackgroundColor = (value: number) => {
 export const extractSelected = <
  T extends CoverageOverviewRuleSource | CoverageOverviewRuleActivity
 >(
-  options: Array<{ checked?: string; label: T }>
+  options: EuiSelectableOption[]
 ): T[] => {
-  return options.filter((option) => option.checked === 'on').map((option) => option.label);
+  return options.filter((option) => option.checked === 'on').map((option) => option.label as T);
 };

 export const populateSelected = <
--- a/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/rule_source_filter.tsx
+++ b/x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/pages/coverage_overview/rule_source_filter.tsx
@ -54,7 +54,7 @@ const RuleSourceFilterComponent = ({
  ) as EuiSelectableOption[];

  const handleSelectableOnChange = useCallback(
-    (newOptions) => {
+    (newOptions: EuiSelectableOption[]) => {
      const formattedOptions = extractSelected<CoverageOverviewRuleSource>(newOptions);
      onChange(formattedOptions);
    },
--- a/x-pack/plugins/security_solution/public/explore/hosts/components/uncommon_process_table/index.tsx
+++ b/x-pack/plugins/security_solution/public/explore/hosts/components/uncommon_process_table/index.tsx
@ -64,7 +64,7 @@ const UncommonProcessTableComponent = React.memo<UncommonProcessTableProps>(
    );

    const updateLimitPagination = useCallback(
-      (newLimit) =>
+      (newLimit: number) =>
        dispatch(
          hostsActions.updateTableLimit({
            hostsType: type,
@ -76,7 +76,7 @@ const UncommonProcessTableComponent = React.memo<UncommonProcessTableProps>(
    );

    const updateActivePage = useCallback(
-      (newPage) =>
+      (newPage: number) =>
        dispatch(
          hostsActions.updateTableActivePage({
            activePage: newPage,
--- a/x-pack/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/document_details/left/components/host_details.tsx
@ -59,6 +59,7 @@ import { HostPreviewPanelKey } from '../../../entity_details/host_right';
 import { HOST_PREVIEW_BANNER } from '../../right/components/host_entity_overview';
 import { UserPreviewPanelKey } from '../../../entity_details/user_right';
 import { USER_PREVIEW_BANNER } from '../../right/components/user_entity_overview';
+import type { NarrowDateRange } from '../../../../common/components/ml/types';

 const HOST_DETAILS_ID = 'entities-hosts-details';
 const RELATED_USERS_ID = 'entities-hosts-related-users';
@ -99,7 +100,7 @@ export const HostDetails: React.FC<HostDetailsProps> = ({ hostName, timestamp, s
  const { openPreviewPanel } = useExpandableFlyoutApi();
  const isPreviewEnabled = !useIsExperimentalFeatureEnabled('entityAlertPreviewDisabled');

-  const narrowDateRange = useCallback(
+  const narrowDateRange = useCallback<NarrowDateRange>(
    (score, interval) => {
      const fromTo = scoreIntervalToDateTime(score, interval);
      dispatch(
--- a/x-pack/plugins/security_solution/public/flyout/document_details/left/components/notes_list.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/document_details/left/components/notes_list.tsx
@ -113,7 +113,7 @@ export const NotesList = memo(({ eventId }: NotesListProps) => {

  const queryTimelineById = useQueryTimelineById();
  const openTimeline = useCallback(
-    ({ timelineId }) =>
+    ({ timelineId }: { timelineId: string }) =>
      queryTimelineById({
        duplicate: false,
        onOpenTimeline: undefined,
--- a/x-pack/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/document_details/left/components/user_details.tsx
@ -59,6 +59,7 @@ import { HostPreviewPanelKey } from '../../../entity_details/host_right';
 import { HOST_PREVIEW_BANNER } from '../../right/components/host_entity_overview';
 import { UserPreviewPanelKey } from '../../../entity_details/user_right';
 import { USER_PREVIEW_BANNER } from '../../right/components/user_entity_overview';
+import type { NarrowDateRange } from '../../../../common/components/ml/types';

 const USER_DETAILS_ID = 'entities-users-details';
 const RELATED_HOSTS_ID = 'entities-users-related-hosts';
@ -100,7 +101,7 @@ export const UserDetails: React.FC<UserDetailsProps> = ({ userName, timestamp, s
  const { openPreviewPanel } = useExpandableFlyoutApi();
  const isPreviewEnabled = !useIsExperimentalFeatureEnabled('entityAlertPreviewDisabled');

-  const narrowDateRange = useCallback(
+  const narrowDateRange = useCallback<NarrowDateRange>(
    (score, interval) => {
      const fromTo = scoreIntervalToDateTime(score, interval);
      dispatch(
--- a/x-pack/plugins/security_solution/public/flyout/network_details/components/network_details.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/network_details/components/network_details.tsx
@ -26,6 +26,7 @@ import { networkModel } from '../../../explore/network/store';
 import { useAnomaliesTableData } from '../../../common/components/ml/anomaly/use_anomalies_table_data';
 import { useInstalledSecurityJobNameById } from '../../../common/components/ml/hooks/use_installed_security_jobs';
 import { EmptyPrompt } from '../../../common/components/empty_prompt';
+import type { NarrowDateRange } from '../../../common/components/ml/types';

 export interface NetworkDetailsProps {
  /**
@ -58,7 +59,7 @@ export const NetworkDetails = ({
  const filters = useDeepEqualSelector(getGlobalFiltersQuerySelector);

  const type = networkModel.NetworkType.details;
-  const narrowDateRange = useCallback(
+  const narrowDateRange = useCallback<NarrowDateRange>(
    (score, interval) => {
      const fromTo = scoreIntervalToDateTime(score, interval);
      dispatch(
--- a/x-pack/plugins/security_solution/public/notes/components/search_row.tsx
+++ b/x-pack/plugins/security_solution/public/notes/components/search_row.tsx
@ -37,7 +37,7 @@ export const SearchRow = React.memo(() => {
  );

  const onQueryChange = useCallback(
-    ({ queryText }) => {
+    ({ queryText }: { queryText: string }) => {
      dispatch(userSearchedNotes(queryText.trim()));
    },
    [dispatch]
--- a/x-pack/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/formatted_ip/index.tsx
@ -6,6 +6,7 @@
 */

 import { isArray, isEmpty, isString, uniq } from 'lodash/fp';
+import type { ComponentProps } from 'react';
 import React, { useCallback, useMemo, useContext } from 'react';
 import deepEqual from 'fast-deep-equal';

@ -114,8 +115,8 @@ const NonDecoratedIpComponent: React.FC<{
    [value]
  );

-  const render = useCallback(
-    (dataProvider, _, snapshot) =>
+  const render: ComponentProps<typeof DraggableWrapper>['render'] = useCallback(
+    (dataProvider: DataProvider, _, snapshot) =>
      snapshot.isDragging ? (
        <DragEffects>
          <Provider dataProvider={dataProvider} />
@ -182,7 +183,7 @@ const AddressLinksItemComponent: React.FC<AddressLinksItemProps> = ({
    address && eventContext?.enableIpDetailsFlyout && eventContext?.timelineID;

  const openNetworkDetailsSidePanel = useCallback(
-    (e) => {
+    (e: React.SyntheticEvent) => {
      e.preventDefault();
      if (onClick) {
        onClick();
@ -239,7 +240,7 @@ const AddressLinksItemComponent: React.FC<AddressLinksItemProps> = ({
    ]
  );

-  const render = useCallback(
+  const render: ComponentProps<typeof DraggableWrapper>['render'] = useCallback(
    (_props, _provided, snapshot) =>
      snapshot.isDragging ? (
        <DragEffects>
--- a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.tsx
@ -56,7 +56,7 @@ export const useTimelineTypes = ({
  }, [formatUrl, urlSearch]);

  const goToTimeline = useCallback(
-    (ev) => {
+    (ev: React.SyntheticEvent) => {
      ev.preventDefault();
      navigateToUrl(timelineUrl);
    },
@ -64,7 +64,7 @@ export const useTimelineTypes = ({
  );

  const goToTemplateTimeline = useCallback(
-    (ev) => {
+    (ev: React.SyntheticEvent) => {
      ev.preventDefault();
      navigateToUrl(templateUrl);
    },
@ -72,7 +72,7 @@ export const useTimelineTypes = ({
  );

  const goToNotes = useCallback(
-    (ev) => {
+    (ev: React.SyntheticEvent) => {
      ev.preventDefault();
      navigateToUrl(notesUrl);
    },
@ -102,7 +102,7 @@ export const useTimelineTypes = ({
  );

  const onFilterClicked = useCallback(
-    (tabId, tabStyle: TimelineTabsStyle) => {
+    (tabId: TimelineType, tabStyle: TimelineTabsStyle) => {
      setTimelineTypes((prevTimelineTypes) => {
        if (prevTimelineTypes !== tabId) {
          setTimelineTypes(tabId);
--- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx
+++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/renderers/host_name.tsx
@ -51,7 +51,7 @@ const HostNameComponent: React.FC<Props> = ({
    hostName && eventContext?.enableHostDetailsFlyout && eventContext?.timelineID;

  const openHostDetailsSidePanel = useCallback(
-    (e) => {
+    (e: React.SyntheticEvent<Element, Event>) => {
      e.preventDefault();

      if (onClick) {
--- a/x-pack/plugins/stack_alerts/public/rule_types/es_query/expression/es_query_expression.tsx
+++ b/x-pack/plugins/stack_alerts/public/rule_types/es_query/expression/es_query_expression.tsx
@ -29,7 +29,7 @@ import { Comparator } from '../../../../common/comparator_types';
 import { getComparatorScript } from '../../../../common';
 import { hasExpressionValidationErrors } from '../validation';
 import { buildSortedEventsQuery } from '../../../../common/build_sorted_events_query';
-import { EsQueryRuleParams, EsQueryRuleMetaData, SearchType } from '../types';
+import { EsQueryRuleParams, EsQueryRuleMetaData, SearchType, SourceField } from '../types';
 import { IndexSelectPopover } from '../../components/index_select_popover';
 import { DEFAULT_VALUES, SERVERLESS_DEFAULT_VALUES } from '../constants';
 import { RuleCommonExpressions } from '../rule_common_expressions';
@ -310,11 +310,12 @@ export const EsQueryExpression: React.FC<
          [setParam]
        )}
        onChangeSelectedGroupBy={useCallback(
-          (selectedGroupBy) => setParam('groupBy', selectedGroupBy),
+          (selectedGroupBy: string | undefined) => setParam('groupBy', selectedGroupBy),
          [setParam]
        )}
        onChangeSelectedTermField={useCallback(
-          (selectedTermField) => setParam('termField', selectedTermField),
+          (selectedTermField: string | string[] | undefined) =>
+            setParam('termField', selectedTermField),
          [setParam]
        )}
        onChangeSelectedTermSize={useCallback(
@ -322,11 +323,11 @@ export const EsQueryExpression: React.FC<
          [setParam]
        )}
        onChangeThreshold={useCallback(
-          (selectedThresholds) => setParam('threshold', selectedThresholds),
+          (selectedThresholds: number[] | undefined) => setParam('threshold', selectedThresholds),
          [setParam]
        )}
        onChangeThresholdComparator={useCallback(
-          (selectedThresholdComparator) =>
+          (selectedThresholdComparator: string | undefined) =>
            setParam('thresholdComparator', selectedThresholdComparator),
          [setParam]
        )}
@ -340,7 +341,7 @@ export const EsQueryExpression: React.FC<
          [setParam]
        )}
        onChangeSizeValue={useCallback(
-          (updatedValue) => setParam('size', updatedValue),
+          (updatedValue: number) => setParam('size', updatedValue),
          [setParam]
        )}
        errors={errors}
@ -350,12 +351,12 @@ export const EsQueryExpression: React.FC<
          excludeHitsFromPreviousRun ?? DEFAULT_VALUES.EXCLUDE_PREVIOUS_HITS
        }
        onChangeExcludeHitsFromPreviousRun={useCallback(
-          (exclude) => setParam('excludeHitsFromPreviousRun', exclude),
+          (exclude: boolean) => setParam('excludeHitsFromPreviousRun', exclude),
          [setParam]
        )}
        canSelectMultiTerms={DEFAULT_VALUES.CAN_SELECT_MULTI_TERMS}
        onChangeSourceFields={useCallback(
-          (selectedSourceFields) => setParam('sourceFields', selectedSourceFields),
+          (selectedSourceFields: SourceField[]) => setParam('sourceFields', selectedSourceFields),
          [setParam]
        )}
        sourceFields={sourceFields}
--- a/x-pack/plugins/stack_connectors/public/connector_types/gemini/dashboard_link.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/gemini/dashboard_link.tsx
@ -29,7 +29,7 @@ export const DashboardLink: React.FC<Props> = ({
    },
  } = useKibana();
  const onClick = useCallback(
-    (e) => {
+    (e: React.MouseEvent<HTMLAnchorElement>) => {
      e.preventDefault();
      if (dashboardUrl) {
        navigateToUrl(dashboardUrl);
--- a/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm_params.tsx
@ -262,7 +262,7 @@ const ServiceNowParamsFields: React.FunctionComponent<
  }, [actionConnector, isTestResolveAction, isTestTriggerAction]);

  const additionalFieldsOnChange = useCallback(
-    (value) => editSubActionProperty('additional_fields', value),
+    (value: string | null) => editSubActionProperty('additional_fields', value),
    [editSubActionProperty]
  );

--- a/x-pack/plugins/stack_connectors/public/connector_types/servicenow_sir/servicenow_sir_params.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/servicenow_sir/servicenow_sir_params.tsx
@ -150,7 +150,7 @@ const ServiceNowSIRParamsFields: React.FunctionComponent<
  }, [actionParams]);

  const additionalFieldsOnChange = useCallback(
-    (value) => editSubActionProperty('additional_fields', value),
+    (value: string | null) => editSubActionProperty('additional_fields', value),
    [editSubActionProperty]
  );

--- a/x-pack/plugins/stack_connectors/public/connector_types/thehive/params_case.tsx
+++ b/x-pack/plugins/stack_connectors/public/connector_types/thehive/params_case.tsx
@ -58,7 +58,7 @@ export const TheHiveParamsCaseFields: React.FC<ActionParamsProps<ExecutorParams>
  );

  const editComment = useCallback(
-    (key, value) => {
+    (key: string, value: any) => {
      editSubActionProperty(key, [{ commentId: '1', comment: value }]);
    },
    [editSubActionProperty]
--- a/x-pack/plugins/transform/public/app/sections/transform_management/components/transform_list/transform_list.tsx
+++ b/x-pack/plugins/transform/public/app/sections/transform_management/components/transform_list/transform_list.tsx
@ -110,7 +110,7 @@ export const TransformList: FC<TransformListProps> = ({

  const searchQueryText = pageState.queryText ?? '';
  const setSearchQueryText = useCallback(
-    (value) => {
+    (value: string) => {
      updatePageState({ queryText: value });
    },
    [updatePageState]