github/umami
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Merge branch 'dev' into jajaja

Browse Source 
# Conflicts:
#	package.json
#	src/components/hooks/useTimezone.ts
#	yarn.lock
This commit is contained in:
Mike Cao
2025-02-19 22:55:40 -08:00
parent 1c5ef97f84 7bb89b28be
commit edb7022c55
13 changed files with 117 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/app/(main)/websites/[websiteId]/sessions/SessionsWeekly.tsx
View File

@@ -10,6 +10,10 @@ export function SessionsWeekly({ websiteId }: { websiteId: string }) {
const { data, ...props } = useWebsiteSessionsWeekly(websiteId);
const { dateLocale } = useLocale();
const { labels, formatMessage } = useMessages();
const { weekStartsOn } = dateLocale.options;
const daysOfWeek = Array(7)
.fill(weekStartsOn)
.map((d, i) => (d + i) % 7);
const [, max] = data
? data.reduce((arr: number[], hours: number[], index: number) => {
@@ -40,7 +44,9 @@ export function SessionsWeekly({ websiteId }: { websiteId: string }) {
{Array(24)
.fill(null)
.map((_, i) => {
const label = format(addHours(startOfDay(new Date()), i), 'haaa');
const label = format(addHours(startOfDay(new Date()), i), 'p', { locale: dateLocale })
.replace(/\D00 ?/, '')
.toLowerCase();
return (
<div key={i} className={styles.hour}>
{label}
@@ -48,33 +54,35 @@ export function SessionsWeekly({ websiteId }: { websiteId: string }) {
);
})}
</div>
{data?.map((day: number[], index: number) => {
return (
<div key={index} className={styles.day}>
<div className={styles.header}>
{format(getDayOfWeekAsDate(index), 'EEE', { locale: dateLocale })}
{data &&
daysOfWeek.map((index: number) => {
const day = data[index];
return (
<div key={index} className={styles.day}>
<div className={styles.header}>
{format(getDayOfWeekAsDate(index), 'EEE', { locale: dateLocale })}
</div>
{day?.map((hour: number) => {
const pct = hour / max;
return (
<div key={hour} className={classNames(styles.cell)}>
{hour > 0 && (
<TooltipPopup
label={`${formatMessage(labels.visitors)}: ${hour}`}
position="right"
>
<div
className={styles.block}
style={{ opacity: pct, transform: `scale(${pct})` }}
/>
</TooltipPopup>
)}
</div>
);
})}
</div>
{day?.map((hour: number, n) => {
const pct = hour / max;
return (
<div key={n} className={classNames(styles.cell)}>
{hour > 0 && (
<TooltipPopup
label={`${formatMessage(labels.visitors)}: ${hour}`}
position="right"
>
<div
className={styles.block}
style={{ opacity: pct, transform: `scale(${pct})` }}
/>
</TooltipPopup>
)}
</div>
);
})}
</div>
);
})}
);
})}
</div>
</LoadingPanel>
);