---

import { MoexChart, Timeframes } from 'moex-chart';

// eslint-disable-next-line import/no-unresolved -- MOEX_CHART
import { CompareManager } from 'moex-chart/dist/types/core/CompareManager';
import { useEffect, useRef, useState } from 'react';

import { useChangeProperties, useSelectProperties } from '@modules/widgetProperties';
import { ChartIndicativeData, ChartProps } from '@widgets/Chart/types';

import { MOEX_CHART_CONFIG } from '../constants';
import { dataSourceProvider, DataSourceProvider } from '../dataSourceProvide';

type TUseMoexChartProps = {
  symbol: string;
  indicativeData: ChartIndicativeData | undefined;
};

export const useMoexChart = ({ symbol, indicativeData }: TUseMoexChartProps) => {
  const moexChartTimeFrame = useSelectProperties((wProps: Partial<ChartProps>) => wProps.moexChartState?.tf);

  const { updateProperties } = useChangeProperties<ChartProps>();

  const handleUpdateTimeFrame = (tf: Timeframes) => {
    if (moexChartTimeFrame === tf) {
      return;
    }

    updateProperties((state) => {
      if (state.moexChartState) {
        state.moexChartState.tf = tf;
      } else {
        state.moexChartState = {
          tf,
        };
      }
    });
  };

  const [isCompareOpen, setIsCompareOpen] = useState(false);

  const containerRef = useRef<HTMLDivElement | null>(null);
  const compareManagerRef = useRef<null | CompareManager>(null);

  useEffect(() => {
    const container = containerRef.current;

    if (!container) {
      return;
    }

    const chart = new MoexChart({
      container,
      openCompareModal: () => setIsCompareOpen(true),
      initialSymbol: symbol,
      getDataSource: DataSourceProvider.getDataSource(indicativeData, handleUpdateTimeFrame),
      initialTimeframe: moexChartTimeFrame || Timeframes['1m'],
      ...MOEX_CHART_CONFIG,
    });

    const { getSymbols, getTimeframe, update } = chart.getRealtimeApi();
    const stopRealtime = dataSourceProvider.startRealtime({ getSymbols, getTimeframe, update });
    const compareManager = chart.getCompareManager();
    compareManagerRef.current = compareManager;
    return () => {
      stopRealtime();
      chart.destroy();
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps -- Должно тригереться только на это.
  }, [symbol, indicativeData]);

  return {
    containerRef,
    isCompareOpen,
    compareManagerRef,
    setIsCompareOpen,
  };
};