Загрузка данных


import React from 'react';

import { InstrumentSearch } from '@components/InstrumentSearch';

import type { Contract } from '@modules/contracts';
import type { SelectedInstrument } from '@widgets/Chart/types';

interface SymbolSearchModalProps {
  widgetId: number;
  isOpen: boolean;
  setOpen: (isOpen: boolean) => void;
  onSymbolChange: (instrument: SelectedInstrument) => void;
}

export const SymbolSearchModal = ({
  widgetId,
  isOpen,
  setOpen,
  onSymbolChange,
}: SymbolSearchModalProps): React.ReactElement => {
  const handleAddInstruments = (instruments: Contract[]): void => {
    const selectedInstrument = instruments[0];

    if (!selectedInstrument?.issKey) {
      return;
    }

    onSymbolChange({
      issKey: selectedInstrument.issKey,
      symbol: selectedInstrument.symbol,
      displayName: selectedInstrument.displayName,
    });

    setOpen(false);
  };

  return (
    <InstrumentSearch
      widgetId={widgetId}
      variant="single"
      isOpen={isOpen}
      setOpen={setOpen}
      addInstruments={handleAddInstruments}
    />
  );
};



import { CompareMode } from 'moex-chart';
import React, { useEffect, useState } from 'react';

import { InstrumentSearch } from '@components/InstrumentSearch';
import { Contract } from '@modules/contracts';

import type { __CompareManager__ } from 'moex-chart';
import type { MutableRefObject } from 'react';

interface CompareModalProps {
  widgetId: number;
  compareManager: MutableRefObject<__CompareManager__ | null>;
  isOpen: boolean;
  setOpen: (isOpen: boolean) => void;
}

export const CompareModal = ({
  compareManager,
  widgetId,
  isOpen,
  setOpen,
}: CompareModalProps): React.ReactElement => {
  const [isNewScaleDisabled, setIsNewScaleDisabled] = useState(false);

  useEffect(() => {
    const manager = compareManager.current;

    if (!isOpen || !manager) {
      setIsNewScaleDisabled(false);
      return;
    }

    setIsNewScaleDisabled(manager.isNewScaleDisabled());

    const subscription = manager
      .isNewScaleDisabledObservable()
      .subscribe(setIsNewScaleDisabled);

    return () => subscription.unsubscribe();
  }, [compareManager, isOpen]);

  const setCompareMode = (instrument: Contract, mode: CompareMode): void => {
    if (!instrument.issKey) {
      return;
    }

    compareManager.current?.setSymbolMode(
      'Line',
      {
        symbolId: instrument.issKey,
        symbol: instrument.symbol,
        symbolName: instrument.displayName,
      },
      mode,
    );
  };

  const handlePercent = (instrument: Contract): void => {
    setCompareMode(instrument, CompareMode.Percentage);
  };

  const handleNewScale = (instrument: Contract): void => {
    setCompareMode(instrument, CompareMode.NewScale);
  };

  const handleNewPanel = (instrument: Contract): void => {
    setCompareMode(instrument, CompareMode.NewPane);
  };

  return (
    <InstrumentSearch
      setOpen={setOpen}
      isOpen={isOpen}
      variant="single"
      widgetId={widgetId}
      // withNRD={false}
      // Временный костыль, пока не завезем свой поиск интструментов
      addInstruments={() => {
        // nothing
      }}
      isNewScaleDisabled={isNewScaleDisabled}
      customActionsFooterHandlers={{
        handlePercent,
        handleNewScale,
        handleNewPanel,
      }}
    />
  );
};