Website compare fix. Updated date functions.

This commit is contained in:
Mike Cao 2025-06-19 00:40:21 -07:00
parent 5a85433e63
commit da173779e0
7 changed files with 91 additions and 94 deletions

View file

@ -4,7 +4,7 @@ import { BarChart, BarChartProps } from '@/components/charts/BarChart';
import { useLocale, useMessages } from '@/components/hooks';
import { renderDateLabels } from '@/lib/charts';
import { getThemeColors } from '@/lib/colors';
import { formatDateByUnit } from '@/lib/date';
import { generateTimeSeries } from '@/lib/date';
export interface PageviewsChartProps extends BarChartProps {
data: {
@ -18,7 +18,7 @@ export interface PageviewsChartProps extends BarChartProps {
unit: string;
}
export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
export function PageviewsChart({ data, unit, minDate, maxDate, ...props }: PageviewsChartProps) {
const { formatMessage, labels } = useMessages();
const { theme } = useTheme();
const { locale, dateLocale } = useLocale();
@ -32,7 +32,7 @@ export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
datasets: [
{
label: formatMessage(labels.visitors),
data: convertDataset(data.sessions, unit, dateLocale),
data: generateTimeSeries(data.sessions, minDate, maxDate, unit, dateLocale),
borderWidth: 1,
barPercentage: 0.9,
categoryPercentage: 0.9,
@ -41,7 +41,7 @@ export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
},
{
label: formatMessage(labels.views),
data: convertDataset(data.pageviews, unit, dateLocale),
data: generateTimeSeries(data.pageviews, minDate, maxDate, unit, dateLocale),
barPercentage: 0.9,
categoryPercentage: 0.9,
borderWidth: 1,
@ -53,7 +53,13 @@ export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
{
type: 'line',
label: `${formatMessage(labels.views)} (${formatMessage(labels.previous)})`,
data: data.compare.pageviews,
data: generateTimeSeries(
data.compare.pageviews,
minDate,
maxDate,
unit,
dateLocale,
),
borderWidth: 2,
backgroundColor: '#8601B0',
borderColor: '#8601B0',
@ -62,7 +68,7 @@ export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
{
type: 'line',
label: `${formatMessage(labels.visitors)} (${formatMessage(labels.previous)})`,
data: data.compare.sessions,
data: generateTimeSeries(data.compare.sessions, minDate, maxDate, unit, dateLocale),
borderWidth: 2,
backgroundColor: '#f15bb5',
borderColor: '#f15bb5',
@ -81,12 +87,10 @@ export function PageviewsChart({ data, unit, ...props }: PageviewsChartProps) {
{...props}
chartData={chartData}
unit={unit}
minDate={minDate}
maxDate={maxDate}
renderXLabel={renderXLabel}
height="400px"
/>
);
}
function convertDataset(data: { x: string; y: number }[], unit: string, locale?: any) {
return data.map(d => ({ ...d, d: d.x, x: formatDateByUnit(d.x, unit, locale) }));
}