refactor: encapsulate instrument chart data

src/features/instrument-details/ui/InstrumentChart/InstrumentChart.vm.ts

@@ -1,16 +1,27 @@
 import { useTranslation } from "react-i18next";
 
-import { formatChartValue, formatDecimal, formatMoney } from "@/shared/lib";
+import { formatDate, formatDecimal, formatMoney } from "@/shared/lib";
 
-import type { InstrumentChartVm } from "../../model/types";
-
-type InstrumentChartProps = { priceUnit?: "percent"; vm: InstrumentChartVm };
+import type { InstrumentChartProps } from "../../model/types";
 
 function useInstrumentChartVm(props: InstrumentChartProps) {
 	const { vm } = props;
 	const { t } = useTranslation();
 
-	const priceRows = vm.priceRows.map((candle) => {
+	const chartData = vm.candles?.candles.map(candle => ({
+		...candle,
+		date: formatDate(candle.time),
+		price: Number(candle.close),
+	})) ?? [];
+
+	const average = vm.position?.averagePurchasePrice;
+
+	const averageLine = average && props.priceUnit !== "percent"
+		&& average.currency === vm.candles?.currency
+		? Number(average.value)
+		: null;
+
+	const priceRows = chartData.toReversed().map((candle) => {
 		const currency = vm.candles?.currency;
 		const value = candle.close;
 
@@ -39,20 +50,21 @@ function useInstrumentChartVm(props: InstrumentChartProps) {
 	);
 
 	const referenceLines
-		= vm.averageLine === null
+		= averageLine === null || !Number.isFinite(averageLine)
 			? []
 			: [
 					{
 						color: "orange.7",
 						ifOverflow: "extendDomain" as const,
 						label: t("stock.averageLine"),
-						y: vm.averageLine,
+						y: averageLine,
 					},
 				];
 
 	return {
+		chartData,
 		chartLabel,
-		formatChartValue,
+		hasIncompleteCandle: chartData.some(candle => !candle.isComplete),
 		periodOptions,
 		priceRows,
 		referenceLines,