From 2e7eef4771dd7649faeba730119f3439f3fcf217 Mon Sep 17 00:00:00 2001 From: Dario Gieselaar Date: Sat, 8 Jun 2024 09:59:25 +0200 Subject: [PATCH] Consolidate react-hooks/exhaustive-deps lint rules for O11y (#184865) Use one react-hooks/exhaustive-deps across our Obs plugins, for consistency reasons. --------- Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Carlos Crespo --- .eslintrc.js | 27 +++++----- .../components/asset_details/charts/chart.tsx | 29 ++++++---- .../asset_details/charts/docker_charts.tsx | 3 +- .../asset_details/charts/host_charts.tsx | 5 +- .../charts/kubernetes_charts.tsx | 8 +-- .../components/kpis/container_kpi_charts.tsx | 14 +---- .../components/kpis/host_kpi_charts.tsx | 12 ++--- .../asset_details/components/kpis/kpi.tsx | 2 +- .../hooks/use_container_metrics_charts.ts | 32 +++++------ .../asset_details/hooks/use_data_views.ts | 2 +- .../hooks/use_host_metrics_charts.test.ts | 6 +-- .../hooks/use_host_metrics_charts.ts | 54 ++++++++----------- .../public/components/lens/lens_chart.tsx | 9 ++-- .../infra/public/hooks/use_lens_attributes.ts | 2 +- .../public/hooks/use_log_view_reference.ts | 2 +- .../hosts/components/kpis/kpi_charts.tsx | 2 +- .../hosts/components/tabs/metrics/chart.tsx | 3 +- .../metrics/hosts/hooks/use_metrics_charts.ts | 3 +- .../public/components/nav_control/index.tsx | 2 +- .../public/functions/lens.tsx | 2 +- .../public/functions/visualize_esql.tsx | 3 +- .../public/hooks/use_conversation.ts | 2 +- .../public/hooks/use_knowledge_base.tsx | 13 +++-- .../custom_logs/install_elastic_agent.tsx | 12 ++++- .../system_logs/install_elastic_agent.tsx | 6 ++- .../public/hooks/use_es_search.ts | 1 + .../components/alerts/query_bar.tsx | 2 +- .../common/components/monitor_inspect.tsx | 3 ++ .../common/components/stderr_logs.tsx | 2 +- .../result_details_successful.tsx | 18 +++++-- .../monitor_add_edit/form/run_test_btn.tsx | 2 +- .../hooks/use_monitor_save.tsx | 3 ++ .../monitor_add_edit/monitor_edit_page.tsx | 3 ++ .../use_recently_viewed_monitors.ts | 3 ++ .../overview/monitor_detail_flyout.tsx | 8 ++- .../components/settings/policy_link.tsx | 5 +- .../hooks/use_locations_api.ts | 6 +++ .../project_api_keys/project_api_keys.tsx | 3 ++ .../last_successful_screenshot.tsx | 3 ++ .../hooks/use_browser_run_once_monitors.ts | 3 ++ .../hooks/use_test_flyout_open.ts | 10 ++-- .../test_now_mode_flyout_container.tsx | 47 ++++++++-------- .../contexts/synthetics_data_view_context.tsx | 2 +- .../public/hooks/use_capabilities.ts | 2 +- .../ping_timestamp/use_in_progress_image.ts | 3 ++ .../alerts/alerts_containers/use_snap_shot.ts | 3 ++ .../integration_deprecation/index.tsx | 3 ++ .../overview/snapshot/use_snap_shot.ts | 3 ++ .../synthetics/check_steps/stderr_logs.tsx | 3 ++ .../step_expanded_row/step_screenshots.tsx | 3 ++ .../synthetics/step_screenshot_display.tsx | 3 ++ .../contexts/uptime_data_view_context.tsx | 3 ++ 52 files changed, 238 insertions(+), 167 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index d7956c15906882..4e6c367970c02b 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -908,10 +908,6 @@ module.exports = { }, ], 'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks - 'react-hooks/exhaustive-deps': [ - 'error', - { additionalHooks: '^(useFetcher|useProgressiveFetcher|useBreadcrumb)$' }, - ], }, }, { @@ -931,6 +927,18 @@ module.exports = { ], }, }, + { + files: ['x-pack/plugins/observability_solution/**/*.{ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': [ + 'error', + { + additionalHooks: + '^(useAbortableAsync|useMemoWithAbortSignal|useFetcher|useProgressiveFetcher|useBreadcrumb|useAsync|useTimeRangeAsync|useAutoAbortedHttpClient)$', + }, + ], + }, + }, { files: [ 'x-pack/plugins/aiops/**/*.tsx', @@ -964,17 +972,6 @@ module.exports = { ], }, }, - // Profiling - { - files: ['x-pack/plugins/observability_solution/profiling/**/*.{js,mjs,ts,tsx}'], - rules: { - 'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks - 'react-hooks/exhaustive-deps': [ - 'error', - { additionalHooks: '^(useAsync|useTimeRangeAsync|useAutoAbortedHttpClient)$' }, - ], - }, - }, { // disable imports from legacy uptime plugin files: [ diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/chart.tsx b/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/chart.tsx index e356eb009a1c48..89d47e598de801 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/chart.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/chart.tsx @@ -17,15 +17,22 @@ import { useDatePickerContext } from '../hooks/use_date_picker'; import { extractRangeFromChartFilterEvent } from './chart_utils'; import { useLoadingStateContext } from '../hooks/use_loading_state'; -export type ChartProps = LensConfig & - Pick & { - id: string; - queryField: string; - dateRange: TimeRange; - assetId: string; - }; +export type ChartProps = Pick & { + id: string; + queryField: string; + dateRange: TimeRange; + assetId: string; + lensAttributes: LensConfig; +}; -export const Chart = ({ id, queryField, overrides, dateRange, assetId, ...props }: ChartProps) => { +export const Chart = ({ + id, + queryField, + overrides, + dateRange, + assetId, + lensAttributes, +}: ChartProps) => { const { setDateRange } = useDatePickerContext(); const { searchSessionId } = useLoadingStateContext(); const { @@ -34,7 +41,7 @@ export const Chart = ({ id, queryField, overrides, dateRange, assetId, ...props const { value: filters = [] } = useAsync(async () => { const resolvedDataView = await resolveDataView({ - dataViewId: (props.dataset as LensDataviewDataset)?.index, + dataViewId: (lensAttributes.dataset as LensDataviewDataset)?.index, dataViewsService: dataViews, }); @@ -45,7 +52,7 @@ export const Chart = ({ id, queryField, overrides, dateRange, assetId, ...props dataView: resolvedDataView.dataViewReference, }), ]; - }, [assetId, dataViews, props.dataset, queryField]); + }, [assetId, dataViews, lensAttributes.dataset, queryField]); const handleBrushEnd = useCallback( ({ range, preventDefault }: BrushEndArgs) => { @@ -75,13 +82,13 @@ export const Chart = ({ id, queryField, overrides, dateRange, assetId, ...props return ( ( {charts.map((chart) => ( ( const { charts } = useHostCharts({ metric, dataViewId: dataView?.id, - options: { overview }, + overview, }); return ( @@ -91,10 +91,11 @@ export const HostCharts = React.forwardRef( {charts.map((chart) => ( ))} diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/kubernetes_charts.tsx b/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/kubernetes_charts.tsx index b386b1e9d8cbca..55771a47d09b2f 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/kubernetes_charts.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/charts/kubernetes_charts.tsx @@ -27,7 +27,7 @@ export const KubernetesNodeCharts = React.forwardRef { const { charts } = useKubernetesCharts({ dataViewId: dataView?.id, - options: { overview }, + overview, }); const hasIntegration = useIntegrationCheck({ dependsOn: INTEGRATIONS.kubernetesNode }); @@ -63,10 +63,11 @@ export const KubernetesNodeCharts = React.forwardRef {charts.map((chart) => ( ))} @@ -127,8 +128,9 @@ export const KubernetesContainerCharts = React.forwardRef< {charts.map((chart) => ( string; - }; + getSubtitle?: (formulaValue: string) => string; loading?: boolean; } @@ -28,7 +26,7 @@ export const HostKpiCharts = ({ dateRange, dataView, filters, - options, + getSubtitle, query, searchSessionId, loading = false, @@ -36,10 +34,8 @@ export const HostKpiCharts = ({ const { euiTheme } = useEuiTheme(); const charts = useHostKpiCharts({ dataViewId: dataView?.id, - options: { - getSubtitle: options?.getSubtitle, - seriesColor: euiTheme.colors.lightestShade, - }, + getSubtitle, + seriesColor: euiTheme.colors.lightestShade, }); return ( diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/components/kpis/kpi.tsx b/x-pack/plugins/observability_solution/infra/public/components/asset_details/components/kpis/kpi.tsx index 6652bd2b12b99f..3545a54d813db3 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/components/kpis/kpi.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/components/kpis/kpi.tsx @@ -36,11 +36,11 @@ export const Kpi = ({ return ( { export const useDockerContainerKpiCharts = ({ dataViewId, - options, + seriesColor, }: { dataViewId?: string; - options?: { seriesColor: string; getSubtitle?: (formulaValue: string) => string }; + seriesColor?: string; }) => { const { value: charts = [] } = useAsync(async () => { const model = findInventoryModel('container'); @@ -113,9 +113,8 @@ export const useDockerContainerKpiCharts = ({ return [cpu.metric.dockerContainerCpuUsage, memory.metric.dockerContainerMemoryUsage].map( (chart) => ({ ...chart, - seriesColor: options?.seriesColor, + seriesColor, decimals: 1, - subtitle: getSubtitle(options, chart), ...(dataViewId && { dataset: { index: dataViewId, @@ -123,17 +122,17 @@ export const useDockerContainerKpiCharts = ({ }), }) ); - }, [dataViewId, options?.seriesColor, options?.getSubtitle]); + }, [dataViewId, seriesColor]); return charts; }; export const useK8sContainerKpiCharts = ({ dataViewId, - options, + seriesColor, }: { dataViewId?: string; - options?: { seriesColor: string; getSubtitle?: (formulaValue: string) => string }; + seriesColor?: string; }) => { const { value: charts = [] } = useAsync(async () => { const model = findInventoryModel('container'); @@ -142,9 +141,9 @@ export const useK8sContainerKpiCharts = ({ return [cpu.metric.k8sContainerCpuUsage, memory.metric.k8sContainerMemoryUsage].map( (chart) => ({ ...chart, - seriesColor: options?.seriesColor, + seriesColor, decimals: 1, - subtitle: getSubtitle(options, chart), + subtitle: getSubtitle(chart), ...(dataViewId && { dataset: { index: dataViewId, @@ -152,16 +151,11 @@ export const useK8sContainerKpiCharts = ({ }), }) ); - }, [dataViewId, options?.seriesColor, options?.getSubtitle]); + }, [dataViewId, seriesColor]); return charts; }; -function getSubtitle( - options: { getSubtitle?: ((formulaValue: string) => string) | undefined } | undefined, - chart: { value: string } -) { - return options?.getSubtitle - ? options?.getSubtitle(chart.value) - : getSubtitleFromFormula(chart.value); +function getSubtitle(chart: { value: string }) { + return getSubtitleFromFormula(chart.value); } diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_data_views.ts b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_data_views.ts index 6ef5ab61f517d7..7740b968e74db9 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_data_views.ts +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_data_views.ts @@ -34,7 +34,7 @@ const useDataViews = () => { const { value: logsDataView, loading: logsDataViewLoading } = useAsync( () => getLogsDataView(logViewReference), - [logViewReference] + [logViewReference, getLogsDataView] ); return { diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.test.ts b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.test.ts index c4e3815f5e0f83..006fae9bec753e 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.test.ts +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.test.ts @@ -61,7 +61,7 @@ describe('useHostCharts', () => { const expectedOrder = getHostChartsExpectedOrder(metric, true); const { result, waitForNextUpdate } = renderHook(() => - useHostCharts({ dataViewId, metric, options: { overview: true } }) + useHostCharts({ dataViewId, metric, overview: true }) ); await waitForNextUpdate(); @@ -81,7 +81,7 @@ describe('useHostCharts', () => { describe('useKubernetesCharts', () => { it('should return an array of charts with correct order - overview', async () => { const { result, waitForNextUpdate } = renderHook(() => - useKubernetesCharts({ dataViewId, options: { overview: true } }) + useKubernetesCharts({ dataViewId, overview: true }) ); await waitForNextUpdate(); @@ -141,7 +141,7 @@ describe('useHostKpiCharts', () => { }; const { result, waitForNextUpdate } = renderHook(() => - useHostKpiCharts({ dataViewId, options }) + useHostKpiCharts({ dataViewId, ...options }) ); await waitForNextUpdate(); diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.ts b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.ts index 6d5381caf6187d..57c9a5a0d7d427 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.ts +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_host_metrics_charts.ts @@ -7,24 +7,21 @@ import { i18n } from '@kbn/i18n'; import { findInventoryModel } from '@kbn/metrics-data-access-plugin/common'; +import { useMemo } from 'react'; import useAsync from 'react-use/lib/useAsync'; import { HostMetricTypes } from '../charts/types'; -interface UseChartsOptions { - overview?: boolean; -} - export const useHostCharts = ({ metric, dataViewId, - options, + overview, }: { metric: HostMetricTypes; dataViewId?: string; - options?: UseChartsOptions; + overview?: boolean; }) => { const { value: charts = [], error } = useAsync(async () => { - const hostCharts = await getHostsCharts({ metric, options }); + const hostCharts = await getHostsCharts({ metric, overview }); return hostCharts.map((chart) => ({ ...chart, ...(dataViewId && { @@ -33,24 +30,24 @@ export const useHostCharts = ({ }, }), })); - }, [dataViewId]); + }, [dataViewId, metric, overview]); return { charts, error }; }; export const useKubernetesCharts = ({ dataViewId, - options, + overview, }: { dataViewId?: string; - options?: UseChartsOptions; + overview?: boolean; }) => { - const model = findInventoryModel('host'); + const model = useMemo(() => findInventoryModel('host'), []); const { value: charts = [], error } = useAsync(async () => { const { kibernetesNode } = await model.metrics.getCharts(); - const items = options?.overview + const items = overview ? [kibernetesNode.xy.nodeCpuCapacity, kibernetesNode.xy.nodeMemoryCapacity] : [ kibernetesNode.xy.nodeCpuCapacity, @@ -69,7 +66,7 @@ export const useKubernetesCharts = ({ }), }; }); - }, [dataViewId, options?.overview]); + }, [dataViewId, overview, model.metrics]); return { charts, error }; }; @@ -83,10 +80,12 @@ const getSubtitleFromFormula = (value: string) => export const useHostKpiCharts = ({ dataViewId, - options, + seriesColor, + getSubtitle, }: { dataViewId?: string; - options?: { seriesColor: string; getSubtitle?: (formulaValue: string) => string }; + seriesColor?: string; + getSubtitle?: (formulaValue: string) => string; }) => { const { value: charts = [] } = useAsync(async () => { const model = findInventoryModel('host'); @@ -99,33 +98,33 @@ export const useHostKpiCharts = ({ disk.metric.diskUsage, ].map((chart) => ({ ...chart, - seriesColor: options?.seriesColor, + seriesColor, decimals: 1, - subtitle: getSubtitle(options, chart), + subtitle: getSubtitle ? getSubtitle(chart.value) : getSubtitleFromFormula(chart.value), ...(dataViewId && { dataset: { index: dataViewId, }, }), })); - }, [dataViewId, options?.seriesColor, options?.getSubtitle]); + }, [dataViewId, seriesColor, getSubtitle]); return charts; }; const getHostsCharts = async ({ metric, - options, + overview, }: { metric: HostMetricTypes; - options?: UseChartsOptions; + overview?: boolean; }) => { const model = findInventoryModel('host'); const { cpu, memory, network, disk, logs } = await model.metrics.getCharts(); switch (metric) { case 'cpu': - return options?.overview + return overview ? [cpu.xy.cpuUsage, cpu.xy.normalizedLoad1m] : [ cpu.xy.cpuUsage, @@ -134,13 +133,13 @@ const getHostsCharts = async ({ cpu.xy.loadBreakdown, ]; case 'memory': - return options?.overview + return overview ? [memory.xy.memoryUsage] : [memory.xy.memoryUsage, memory.xy.memoryUsageBreakdown]; case 'network': return [network.xy.rxTx]; case 'disk': - return options?.overview + return overview ? [disk.xy.diskUsageByMountPoint, disk.xy.diskIOReadWrite] : [disk.xy.diskUsageByMountPoint, disk.xy.diskIOReadWrite, disk.xy.diskThroughputReadWrite]; case 'log': @@ -149,12 +148,3 @@ const getHostsCharts = async ({ return []; } }; - -function getSubtitle( - options: { getSubtitle?: ((formulaValue: string) => string) | undefined } | undefined, - chart: { value: string } -) { - return options?.getSubtitle - ? options?.getSubtitle(chart.value) - : getSubtitleFromFormula(chart.value); -} diff --git a/x-pack/plugins/observability_solution/infra/public/components/lens/lens_chart.tsx b/x-pack/plugins/observability_solution/infra/public/components/lens/lens_chart.tsx index e9cd4407fb5b2d..c69b3b8bc34ce6 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/lens/lens_chart.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/lens/lens_chart.tsx @@ -16,12 +16,13 @@ import { ChartLoadError } from './chart_load_error'; const MIN_HEIGHT = 300; -export type LensChartProps = UseLensAttributesParams & - BaseChartProps & +export type LensChartProps = BaseChartProps & Pick & { toolTip?: React.ReactElement; searchSessionId?: string; description?: string; + } & { + lensAttributes: UseLensAttributesParams; }; export const LensChart = React.memo( @@ -41,9 +42,9 @@ export const LensChart = React.memo( disableTriggers = false, height = MIN_HEIGHT, loading = false, - ...lensAttributesParams + lensAttributes, }: LensChartProps) => { - const { formula, attributes, getExtraActions, error } = useLensAttributes(lensAttributesParams); + const { formula, attributes, getExtraActions, error } = useLensAttributes(lensAttributes); const isLoading = loading || !attributes; diff --git a/x-pack/plugins/observability_solution/infra/public/hooks/use_lens_attributes.ts b/x-pack/plugins/observability_solution/infra/public/hooks/use_lens_attributes.ts index 96082871c51417..9e0f9071eb079f 100644 --- a/x-pack/plugins/observability_solution/infra/public/hooks/use_lens_attributes.ts +++ b/x-pack/plugins/observability_solution/infra/public/hooks/use_lens_attributes.ts @@ -34,7 +34,7 @@ export const useLensAttributes = (params: UseLensAttributesParams) => { const builder = new LensConfigBuilder(dataViews, formulaAPI); return builder.build(params) as Promise; - }, [params.chartType, params.dataset, dataViews]); + }, [params, dataViews, lens]); const injectFilters = useCallback( ({ filters, query }: { filters: Filter[]; query: Query }): LensAttributes | null => { diff --git a/x-pack/plugins/observability_solution/infra/public/hooks/use_log_view_reference.ts b/x-pack/plugins/observability_solution/infra/public/hooks/use_log_view_reference.ts index 56ba82b6973385..da68b881155846 100644 --- a/x-pack/plugins/observability_solution/infra/public/hooks/use_log_view_reference.ts +++ b/x-pack/plugins/observability_solution/infra/public/hooks/use_log_view_reference.ts @@ -28,7 +28,7 @@ export const useLogViewReference = ({ id, name, extraFields = [] }: Props) => { const { loading, value: defaultLogView } = useAsync( () => logsShared.logViews.client.getLogView(DEFAULT_LOG_VIEW), - [] + [logsShared.logViews.client] ); const logViewReference = useLazyRef(() => { diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/kpis/kpi_charts.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/kpis/kpi_charts.tsx index 9b349441c58764..d0ff61c66abc68 100644 --- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/kpis/kpi_charts.tsx +++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/kpis/kpi_charts.tsx @@ -76,7 +76,7 @@ export const KpiCharts = () => { filters={afterLoadedState.filters} query={afterLoadedState.query} searchSessionId={afterLoadedState.searchSessionId} - options={{ getSubtitle: afterLoadedState.getSubtitle }} + getSubtitle={afterLoadedState.getSubtitle} loading={loading} /> ); diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/tabs/metrics/chart.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/tabs/metrics/chart.tsx index ac6c370a7ce6cf..77f45445f00236 100644 --- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/tabs/metrics/chart.tsx +++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/hosts/components/tabs/metrics/chart.tsx @@ -62,11 +62,12 @@ export const Chart = ({ id, ...chartProps }: ChartProps) => { chartProps.dataset, searchCriteria.filters, searchCriteria.panelFilters, + shouldUseSearchCriteria, ]); return ( { - const model = findInventoryModel('host'); - const { value: charts = [] } = useAsync(async () => { + const model = findInventoryModel('host'); const { cpu, disk, memory, network } = await model.metrics.getCharts(); return [ diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/components/nav_control/index.tsx b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/components/nav_control/index.tsx index 8757b9f8235bf4..4bb7f1404117c9 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/components/nav_control/index.tsx +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/components/nav_control/index.tsx @@ -56,7 +56,7 @@ export function NavControl({}: {}) { }) : undefined; }, - [service, hasBeenOpened] + [service, hasBeenOpened, notifications.toasts] ); const [isOpen, setIsOpen] = useState(false); diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/lens.tsx b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/lens.tsx index cd2a522755f65b..ec51efb85efceb 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/lens.tsx +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/lens.tsx @@ -57,7 +57,7 @@ function Lens({ title: indexPattern, timeFieldName: timeField, }); - }, [indexPattern]); + }, [indexPattern, dataViews, timeField]); const [isSaveModalOpen, setIsSaveModalOpen] = useState(false); diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/visualize_esql.tsx b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/visualize_esql.tsx index fe39a51d353b98..97c46a6a2d7592 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/visualize_esql.tsx +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/functions/visualize_esql.tsx @@ -130,7 +130,8 @@ export function VisualizeESQL({ } return dataView; }); - }, [indexPattern]); + }, [indexPattern, dataViews]); + const chatFlyoutSecondSlotHandler = useContext(ObservabilityAIAssistantMultipaneFlyoutContext); const [isSaveModalOpen, setIsSaveModalOpen] = useState(false); diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.ts b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.ts index 122d1d93addff0..0616e9dbaca324 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.ts +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.ts @@ -152,7 +152,7 @@ export function useConversation({ throw error; }); }, - [displayedConversationId, initialTitle], + [displayedConversationId, initialTitle, service, setMessages], { defaultValue: () => { if (!displayedConversationId) { diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_knowledge_base.tsx b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_knowledge_base.tsx index 0df3ab16c421fc..bca9b384856958 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_knowledge_base.tsx +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_knowledge_base.tsx @@ -39,11 +39,14 @@ export function useKnowledgeBase(): UseKnowledgeBaseResult { } = useKibana().services; const service = useObservabilityAIAssistantAppService(); - const status = useAbortableAsync(({ signal }) => { - return service.callApi('GET /internal/observability_ai_assistant/kb/status', { - signal, - }); - }, []); + const status = useAbortableAsync( + ({ signal }) => { + return service.callApi('GET /internal/observability_ai_assistant/kb/status', { + signal, + }); + }, + [service] + ); const [isInstalling, setIsInstalling] = useState(false); diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/custom_logs/install_elastic_agent.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/custom_logs/install_elastic_agent.tsx index 2b209d8e98709f..18fdc833483fec 100644 --- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/custom_logs/install_elastic_agent.tsx +++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/custom_logs/install_elastic_agent.tsx @@ -70,6 +70,8 @@ export function InstallElasticAgent() { if (!hasAlreadySavedFlow(getState())) { return callApi('GET /internal/observability_onboarding/logs/setup/privileges'); } + // FIXME: Dario could not find a reasonable fix for getState() + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const { data: setup } = useFetcher((callApi) => { @@ -102,6 +104,8 @@ export function InstallElasticAgent() { }); } }, + // FIXME: Dario could not find a reasonable fix for getState() + // eslint-disable-next-line react-hooks/exhaustive-deps [monitoringRole?.hasPrivileges] ); @@ -130,10 +134,14 @@ export function InstallElasticAgent() { }, }); } + // FIXME: Dario could not find a reasonable fix for getState() + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const { apiKeyEncoded, onboardingId } = installShipperSetup ?? getState(); + const succesfullySavedOnboardingState = saveOnboardingStateDataStatus === FETCH_STATUS.SUCCESS; + const { data: yamlConfig = '', status: yamlConfigStatus } = useFetcher( (callApi) => { if (apiKeyEncoded && onboardingId) { @@ -143,7 +151,9 @@ export function InstallElasticAgent() { }); } }, - [apiKeyEncoded, onboardingId, saveOnboardingStateDataStatus === FETCH_STATUS.SUCCESS] + // FIXME: Dario could not find a reasonable fix for succesfullySavedOnboardingState + // eslint-disable-next-line react-hooks/exhaustive-deps + [apiKeyEncoded, onboardingId, succesfullySavedOnboardingState] ); useEffect(() => { diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/system_logs/install_elastic_agent.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/system_logs/install_elastic_agent.tsx index a46a7c6627662f..ea25181243571b 100644 --- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/system_logs/install_elastic_agent.tsx +++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/quickstart_flows/system_logs/install_elastic_agent.tsx @@ -109,6 +109,8 @@ export function InstallElasticAgent() { const { apiKeyEncoded, onboardingId } = installShipperSetup ?? getState(); + const successfullyInstalledShipperSetup = installShipperSetupStatus === FETCH_STATUS.SUCCESS; + const { data: yamlConfig = '', status: yamlConfigStatus } = useFetcher( (callApi) => { if (apiKeyEncoded && onboardingId) { @@ -118,7 +120,9 @@ export function InstallElasticAgent() { }); } }, - [apiKeyEncoded, onboardingId, installShipperSetupStatus === FETCH_STATUS.SUCCESS] + // FIXME: Dario could not find a reasonable fix for successfullyInstalledShipperSetup + // eslint-disable-next-line react-hooks/exhaustive-deps + [apiKeyEncoded, onboardingId, successfullyInstalledShipperSetup] ); useEffect(() => { diff --git a/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_es_search.ts b/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_es_search.ts index e51fdb8964bf51..ef38cf13a8c2aa 100644 --- a/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_es_search.ts +++ b/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_es_search.ts @@ -110,6 +110,7 @@ export const useEsSearch = { const { data: dataView } = useFetcher(async () => { return await dataViews.create({ title: SYNTHETICS_INDEX_PATTERN }); - }, []); + }, [dataViews]); useEffect(() => { onChange(query); diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/monitor_inspect.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/monitor_inspect.tsx index f7fff9c9ce3320..90d30606b860dc 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/monitor_inspect.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/monitor_inspect.tsx @@ -70,6 +70,9 @@ const MonitorInspect = ({ isValid, monitorFields }: InspectorProps) => { monitor: monitorFields, }); } + // FIXME: Dario couldn't find a solution for monitorFields + // which is not memoized downstream + // eslint-disable-next-line react-hooks/exhaustive-deps }, [isInspecting, hideParams]); let flyout; diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/stderr_logs.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/stderr_logs.tsx index b4a28335ce132c..2b332ec78671f1 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/stderr_logs.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/stderr_logs.tsx @@ -86,7 +86,7 @@ export const StdErrorLogs = ({ } : undefined, }); - }, [checkGroup, timestamp]); + }, [checkGroup, timestamp, discover, exploratoryView]); const search = { box: { diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details_successful.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details_successful.tsx index 08194c3b77f26d..25f0ed08434725 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details_successful.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details_successful.tsx @@ -25,14 +25,22 @@ export const ResultDetailsSuccessful = ({ }) => { const { euiTheme } = useEuiTheme(); + const timestamp = step['@timestamp']; + const monitorId = step.monitor.id; + const stepIndex = Number(step.synthetics.step?.index); + const location = step.observer?.geo?.name; + const { data, loading } = useFetcher(() => { return fetchLastSuccessfulCheck({ - timestamp: step['@timestamp'], - monitorId: step.monitor.id, - stepIndex: Number(step.synthetics.step?.index), - location: step.observer?.geo?.name, + timestamp, + monitorId, + stepIndex, + location, }); - }, [step._id, step['@timestamp']]); + // FIXME: Dario is not sure what step._id is being used for, + // so he'll leave it in place + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [timestamp, monitorId, stepIndex, location, step._id]); const { currentStep } = useJourneySteps( data?.monitor.check_group, diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/form/run_test_btn.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/form/run_test_btn.tsx index 579cf526c1b3ad..00ddc5b4a7ef3d 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/form/run_test_btn.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/form/run_test_btn.tsx @@ -52,7 +52,7 @@ export const RunTestButton = ({ id: testRun.id, }); } - }, [testRun?.id]); + }, [testRun?.id, testRun?.monitor]); const { tooltipContent, isDisabled } = useTooltipContent(formState.isValid, inProgress); diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/hooks/use_monitor_save.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/hooks/use_monitor_save.tsx index 4fa482eb63bbd1..1ba3cec8858896 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/hooks/use_monitor_save.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/hooks/use_monitor_save.tsx @@ -39,6 +39,9 @@ export const useMonitorSave = ({ monitorData }: { monitorData?: SyntheticsMonito }); } } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [monitorData]); useEffect(() => { diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx index 772a4bc36022b4..f339c69610672a 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx @@ -45,6 +45,9 @@ export const MonitorEditPage: React.FC = () => { const { data, loading, error } = useFetcher(() => { return getDecryptedMonitorAPI({ id: monitorId }); + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const monitorNotFoundError = useMonitorNotFound( diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_details/monitor_selector/use_recently_viewed_monitors.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_details/monitor_selector/use_recently_viewed_monitors.ts index 74efd982c3d173..0988e6c2aefc53 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_details/monitor_selector/use_recently_viewed_monitors.ts +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitor_details/monitor_selector/use_recently_viewed_monitors.ts @@ -92,6 +92,9 @@ export const useRecentlyViewedMonitors = () => { updateRecentlyViewed(); } } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [monitorQueryId]); return useMemo( diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/monitor_detail_flyout.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/monitor_detail_flyout.tsx index cb8da8a64cad64..78ac9dd2f663f4 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/monitor_detail_flyout.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/monitors_page/overview/overview/monitor_detail_flyout.tsx @@ -255,7 +255,13 @@ export function MonitorDetailFlyout(props: Props) { error, status, loading, - } = useFetcher(() => fetchSyntheticsMonitor({ monitorId: configId }), [configId, upsertSuccess]); + } = useFetcher( + () => fetchSyntheticsMonitor({ monitorId: configId }), + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps + [configId, upsertSuccess] + ); const [isActionsPopoverOpen, setIsActionsPopoverOpen] = useState(false); diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/policy_link.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/policy_link.tsx index c36296b1ff42c5..0c9cb465c127ff 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/policy_link.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/policy_link.tsx @@ -24,6 +24,9 @@ export const PolicyLink = ({ name }: { name: string }) => { const { data } = useFetcher(async () => { return ilmLocator?.getLocation({ page: 'policy_edit', policyName: name }); + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [name]); if (!data) { @@ -31,7 +34,7 @@ export const PolicyLink = ({ name }: { name: string }) => { } if (!name) { - return <>--; + return <>{i18n.translate('xpack.synthetics.policyLink.Label', { defaultMessage: '--' })}; } if (!canManageILM) { diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/private_locations/hooks/use_locations_api.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/private_locations/hooks/use_locations_api.ts index 6ee8acd4a93e7b..6b3899a5b44c8b 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/private_locations/hooks/use_locations_api.ts +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/private_locations/hooks/use_locations_api.ts @@ -44,6 +44,9 @@ export const usePrivateLocationsAPI = () => { dispatch(getPrivateLocationsAction.get()); return result; } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [formData]); const onSubmit = (data: NewLocation) => { @@ -62,6 +65,9 @@ export const usePrivateLocationsAPI = () => { dispatch(getPrivateLocationsAction.get()); return result; } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [deleteId]); return { diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/project_api_keys/project_api_keys.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/project_api_keys/project_api_keys.tsx index 5ea801dea4ed36..4a8752e8b9926f 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/project_api_keys/project_api_keys.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/settings/project_api_keys/project_api_keys.tsx @@ -38,6 +38,9 @@ export const ProjectAPIKeys = () => { return fetchProjectAPIKey(accessToElasticManagedLocations && Boolean(canUsePublicLocations)); } return null; + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [loadAPIKey, canUsePublicLocations]); useEffect(() => { diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/step_details_page/step_screenshot/last_successful_screenshot.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/step_details_page/step_screenshot/last_successful_screenshot.tsx index 45052a38a21fd0..cde0cb93fed114 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/step_details_page/step_screenshot/last_successful_screenshot.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/step_details_page/step_screenshot/last_successful_screenshot.tsx @@ -35,6 +35,9 @@ export const LastSuccessfulScreenshot = ({ stepIndex: Number(stepIndex ?? stepInd), location: step.observer?.geo?.name, }); + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [step._id, step['@timestamp']]); return ( diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_browser_run_once_monitors.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_browser_run_once_monitors.ts index 2ad18149f26dc5..c5b11dc2722339 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_browser_run_once_monitors.ts +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_browser_run_once_monitors.ts @@ -187,6 +187,9 @@ export const useBrowserRunOnceMonitors = ({ } return Promise.resolve(null); + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Synthetics folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [checkGroupCheckSum, setCheckGroupResults, lastRefresh]); // Whenever a new found document is fetched, update lastUpdated diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_test_flyout_open.ts b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_test_flyout_open.ts index ed3bf648cfe57a..082a7ffc84c7ef 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_test_flyout_open.ts +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/hooks/use_test_flyout_open.ts @@ -7,7 +7,7 @@ import { useDispatch, useSelector } from 'react-redux'; import { useRouteMatch } from 'react-router-dom'; -import { useEffect } from 'react'; +import { useEffect, useMemo } from 'react'; import { MONITOR_ROUTE, OVERVIEW_ROUTE } from '../../../../../../common/constants'; import { hideTestNowFlyoutAction, testNowRunsSelector } from '../../../state/manual_test_runs'; @@ -24,9 +24,11 @@ export const useTestFlyoutOpen = () => { const dispatch = useDispatch(); - const flyoutTestOpen = Object.values(testNowRuns).find((value) => { - return value.isTestNowFlyoutOpen; - }); + const flyoutTestOpen = useMemo(() => { + return Object.values(testNowRuns).find((value) => { + return value.isTestNowFlyoutOpen; + }); + }, [testNowRuns]); const isSameMonitor = flyoutTestOpen?.configId === isMonitorDetails?.params.monitorId; diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/test_now_mode_flyout_container.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/test_now_mode_flyout_container.tsx index ff3114c98f845e..b550cdbd2745e6 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/test_now_mode_flyout_container.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/test_now_mode/test_now_mode_flyout_container.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback } from 'react'; +import React, { useCallback, useMemo } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { useTestFlyoutOpen } from './hooks/use_test_flyout_open'; @@ -50,27 +50,30 @@ export function TestNowModeFlyoutContainer() { [dispatch] ); - const flyout = flyoutOpenTestRun ? ( - handleFlyoutClose(flyoutOpenTestRun.testRunId)} - onDone={onDone} - isPushing={flyoutOpenTestRun.status === 'loading'} - errors={flyoutOpenTestRun.errors ?? []} - /> - ) : null; + const testRun = useMemo(() => { + return flyoutOpenTestRun?.testRunId && flyoutOpenTestRun?.monitor + ? { + id: flyoutOpenTestRun.testRunId, + monitor: flyoutOpenTestRun.monitor, + name: flyoutOpenTestRun.name, + } + : undefined; + }, [flyoutOpenTestRun]); + + const flyout = + flyoutOpenTestRun && testRun ? ( + handleFlyoutClose(flyoutOpenTestRun.testRunId)} + onDone={onDone} + isPushing={flyoutOpenTestRun.status === 'loading'} + errors={flyoutOpenTestRun.errors ?? []} + /> + ) : null; return ( <> diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_data_view_context.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_data_view_context.tsx index b7a7c8f25602b2..04c502e3f181f4 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_data_view_context.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_data_view_context.tsx @@ -19,7 +19,7 @@ export const SyntheticsDataViewContextProvider: FC< > = ({ children, dataViews }) => { const { data } = useFetcher>(async () => { return dataViews.create({ title: SYNTHETICS_INDEX_PATTERN }); - }, []); + }, [dataViews]); return ; }; diff --git a/x-pack/plugins/observability_solution/synthetics/public/hooks/use_capabilities.ts b/x-pack/plugins/observability_solution/synthetics/public/hooks/use_capabilities.ts index 1f9d7f1538b95d..6e09a9bfe59354 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/hooks/use_capabilities.ts +++ b/x-pack/plugins/observability_solution/synthetics/public/hooks/use_capabilities.ts @@ -62,7 +62,7 @@ export const useCanReadSyntheticsIndex = () => { }, }); }); - }, []); + }, [dataPublicPluginStart.search]); return { canRead: data?.canRead, diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/ping_list/columns/ping_timestamp/use_in_progress_image.ts b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/ping_list/columns/ping_timestamp/use_in_progress_image.ts index 0a252651c9ed47..bc85b45857c23d 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/ping_list/columns/ping_timestamp/use_in_progress_image.ts +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/monitor/ping_list/columns/ping_timestamp/use_in_progress_image.ts @@ -43,6 +43,9 @@ export const useInProgressImage = ({ } if (hasIntersected && !hasImage) return getJourneyScreenshot(imgPath); + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [hasIntersected, imgPath, skippedStep, retryLoading]); useEffect(() => { diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/alerts/alerts_containers/use_snap_shot.ts b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/alerts/alerts_containers/use_snap_shot.ts index 30445a5441ccac..b6d250a2cb70f4 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/alerts/alerts_containers/use_snap_shot.ts +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/alerts/alerts_containers/use_snap_shot.ts @@ -24,6 +24,9 @@ export const useSnapShotCount = ({ query, filters }: { query: string; filters?: dateRangeEnd: 'now', filters: error ? undefined : esKuery, }), + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps [esKuery, query] ); diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/integration_deprecation/index.tsx b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/integration_deprecation/index.tsx index afff54bb69f268..ac7e20db41b179 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/integration_deprecation/index.tsx +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/integration_deprecation/index.tsx @@ -26,6 +26,9 @@ export const IntegrationDeprecation = () => { return getHasIntegrationMonitors(); } return undefined; + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [monitorList.isLoaded]); const hasIntegrationMonitors = !loading && data && data.hasIntegrationMonitors; const [shouldShowNotice, setShouldShowNotice] = useState( diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/snapshot/use_snap_shot.ts b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/snapshot/use_snap_shot.ts index 8932d5755e7000..15ffd98c739c33 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/snapshot/use_snap_shot.ts +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/overview/snapshot/use_snap_shot.ts @@ -22,6 +22,9 @@ export const useSnapShotCount = () => { const { data, loading } = useFetcher( () => fetchSnapshotCount({ query, dateRangeStart, dateRangeEnd, filters: esKuery }), + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps [dateRangeStart, dateRangeEnd, esKuery, lastRefresh, query] ); diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/stderr_logs.tsx b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/stderr_logs.tsx index 1b17bb5f1702b5..7eab37d2b9afe4 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/stderr_logs.tsx +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/stderr_logs.tsx @@ -90,6 +90,9 @@ export const StdErrorLogs = ({ }); } return ''; + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [checkGroup, timestamp]); const search = { diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/step_expanded_row/step_screenshots.tsx b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/step_expanded_row/step_screenshots.tsx index 8a4f101fdc4dab..606019c99429da 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/step_expanded_row/step_screenshots.tsx +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/check_steps/step_expanded_row/step_screenshots.tsx @@ -40,6 +40,9 @@ export const StepScreenshots = ({ step }: Props) => { location: step.observer?.geo?.name, }); } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [step._id, step['@timestamp']]); const lastSuccessfulCheck: Ping | undefined = data; diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/step_screenshot_display.tsx b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/step_screenshot_display.tsx index 7afb544fdeac8b..b7d2f6d85fe2b5 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/step_screenshot_display.tsx +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/components/synthetics/step_screenshot_display.tsx @@ -135,6 +135,9 @@ export const StepScreenshotDisplay: FC = ({ if (isScreenshotRef) { return getJourneyScreenshot(imgSrc); } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [basePath, checkGroup, imgSrc, stepIndex, isScreenshotRef, lastRefresh]); const refDimensions = useMemo(() => { diff --git a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/contexts/uptime_data_view_context.tsx b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/contexts/uptime_data_view_context.tsx index edcf638b4414fe..7abbdf3fde8c86 100644 --- a/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/contexts/uptime_data_view_context.tsx +++ b/x-pack/plugins/observability_solution/uptime/public/legacy_uptime/contexts/uptime_data_view_context.tsx @@ -26,6 +26,9 @@ export const UptimeDataViewContextProvider: FC< // this only creates an dateView in memory, not as saved object return dataViews.create({ title: heartbeatIndices }); } + // FIXME: Dario thinks there is a better way to do this but + // he's getting tired and maybe the Uptime folks can fix it + // eslint-disable-next-line react-hooks/exhaustive-deps }, [heartbeatIndices, indexStatus?.indexExists]); return ;