fix(analysis): use last business day of previous month for 'Vs. mes anterior' card
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import { Link, useNavigate } from "@tanstack/react-router";
|
import { Link, useNavigate } from "@tanstack/react-router";
|
||||||
import { subDays } from "date-fns";
|
import { subDays, subMonths } from "date-fns";
|
||||||
import { ArrowLeft } from "lucide-react";
|
import { ArrowLeft } from "lucide-react";
|
||||||
import { useMemo, useState } from "react";
|
import { useMemo, useState } from "react";
|
||||||
import {
|
import {
|
||||||
@@ -13,7 +13,12 @@ import {
|
|||||||
YAxis,
|
YAxis,
|
||||||
} from "recharts";
|
} from "recharts";
|
||||||
import { DatePicker } from "@/components/ui/date-picker";
|
import { DatePicker } from "@/components/ui/date-picker";
|
||||||
import { useDailyQuotes, useHistoricalMinMax, useQuotes } from "@/lib/queries";
|
import {
|
||||||
|
useDailyQuotes,
|
||||||
|
useHistoricalMinMax,
|
||||||
|
useMonthlyLast,
|
||||||
|
useQuotes,
|
||||||
|
} from "@/lib/queries";
|
||||||
import { MonthlyVariationTable } from "./components/MonthlyVariationTable";
|
import { MonthlyVariationTable } from "./components/MonthlyVariationTable";
|
||||||
|
|
||||||
const CURRENCIES = ["BELO", "BLUE", "BNA"] as const;
|
const CURRENCIES = ["BELO", "BLUE", "BNA"] as const;
|
||||||
@@ -86,19 +91,13 @@ export function AnalysisPage({ currency }: { currency: string }) {
|
|||||||
|
|
||||||
const yesterday = subDays(today, 1);
|
const yesterday = subDays(today, 1);
|
||||||
const yesterdayStr = formatDate(yesterday);
|
const yesterdayStr = formatDate(yesterday);
|
||||||
const firstOfMonth = new Date(today.getFullYear(), today.getMonth(), 1);
|
|
||||||
const firstOfMonthStr = formatDate(firstOfMonth);
|
|
||||||
|
|
||||||
const { data: yesterdayQuote } = useDailyQuotes(
|
const { data: yesterdayQuote } = useDailyQuotes(
|
||||||
currency,
|
currency,
|
||||||
yesterdayStr,
|
yesterdayStr,
|
||||||
yesterdayStr,
|
yesterdayStr,
|
||||||
);
|
);
|
||||||
const { data: firstDayQuote } = useDailyQuotes(
|
const { data: monthlyLastData } = useMonthlyLast();
|
||||||
currency,
|
|
||||||
firstOfMonthStr,
|
|
||||||
firstOfMonthStr,
|
|
||||||
);
|
|
||||||
|
|
||||||
const chartData = useMemo(() => {
|
const chartData = useMemo(() => {
|
||||||
if (!daily) return [];
|
if (!daily) return [];
|
||||||
@@ -184,11 +183,21 @@ export function AnalysisPage({ currency }: { currency: string }) {
|
|||||||
? (prevDayDiff / yesterdayBuy) * 100
|
? (prevDayDiff / yesterdayBuy) * 100
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const firstMonthBuy = firstDayQuote?.[0]?.buy ?? null;
|
const previousMonthBuy = useMemo(() => {
|
||||||
const monthDiff = firstMonthBuy !== null ? currentBuy - firstMonthBuy : null;
|
if (!monthlyLastData || monthlyLastData.length === 0) return null;
|
||||||
|
const prevMonth = subMonths(today, 1);
|
||||||
|
const prevMonthKey = `${prevMonth.getFullYear()}-${String(prevMonth.getMonth() + 1).padStart(2, "0")}`;
|
||||||
|
const entry = monthlyLastData.find(
|
||||||
|
(e) => e.month === prevMonthKey && e.type === currency,
|
||||||
|
);
|
||||||
|
return entry?.buy ?? null;
|
||||||
|
}, [monthlyLastData, currency, today]);
|
||||||
|
|
||||||
|
const monthDiff =
|
||||||
|
previousMonthBuy !== null ? currentBuy - previousMonthBuy : null;
|
||||||
const monthPct =
|
const monthPct =
|
||||||
monthDiff !== null && firstMonthBuy !== null && firstMonthBuy !== 0
|
monthDiff !== null && previousMonthBuy !== null && previousMonthBuy !== 0
|
||||||
? (monthDiff / firstMonthBuy) * 100
|
? (monthDiff / previousMonthBuy) * 100
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const backTo = currency === "BELO" ? "/quotes/belo" : "/quotes";
|
const backTo = currency === "BELO" ? "/quotes/belo" : "/quotes";
|
||||||
@@ -305,9 +314,7 @@ export function AnalysisPage({ currency }: { currency: string }) {
|
|||||||
<VariationValue value={prevDayDiff} pct={prevDayPct} />
|
<VariationValue value={prevDayDiff} pct={prevDayPct} />
|
||||||
</div>
|
</div>
|
||||||
<div className="rounded-lg border p-4">
|
<div className="rounded-lg border p-4">
|
||||||
<p className="text-sm text-muted-foreground mb-2">
|
<p className="text-sm text-muted-foreground mb-2">Vs. mes anterior</p>
|
||||||
Vs. primer día del mes
|
|
||||||
</p>
|
|
||||||
<VariationValue value={monthDiff} pct={monthPct} />
|
<VariationValue value={monthDiff} pct={monthPct} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user