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,
}}
/>
);
};