Metrics components refactoring. New event data page.

This commit is contained in:
Mike Cao 2023-07-10 04:35:19 -07:00
parent 4e6d24e932
commit c865f43b11
47 changed files with 756 additions and 672 deletions

View file

@ -1,11 +1,19 @@
import { Button, Text, Icon } from 'react-basics';
import { useMemo } from 'react';
import { firstBy } from 'thenby';
import WebsiteChart from 'components/metrics/WebsiteChart';
import Link from 'next/link';
import WebsiteChart from 'components/pages/websites/WebsiteChart';
import useDashboard from 'store/dashboard';
import styles from './WebsiteList.module.css';
import WebsiteHeader from './WebsiteHeader';
import { WebsiteMetricsBar } from './WebsiteMetricsBar';
import { useMessages, useLocale } from 'hooks';
import Icons from 'components/icons';
export default function WebsiteChartList({ websites, showCharts, limit }) {
const { formatMessage, labels } = useMessages();
const { websiteOrder } = useDashboard();
const { dir } = useLocale();
const ordered = useMemo(
() =>
@ -17,16 +25,23 @@ export default function WebsiteChartList({ websites, showCharts, limit }) {
return (
<div>
{ordered.map(({ id, name, domain }, index) => {
{ordered.map(({ id }, index) => {
return index < limit ? (
<div key={id} className={styles.website}>
<WebsiteChart
websiteId={id}
name={name}
domain={domain}
showChart={showCharts}
showDetailsButton={true}
/>
<WebsiteHeader websiteId={id} showLinks={false}>
<Link href={`/websites/${id}`}>
<Button variant="primary">
<Text>{formatMessage(labels.viewDetails)}</Text>
<Icon>
<Icon rotate={dir === 'rtl' ? 180 : 0}>
<Icons.ArrowRight />
</Icon>
</Icon>
</Button>
</Link>
</WebsiteHeader>
<WebsiteMetricsBar websiteId={id} />
<WebsiteChart websiteId={id} showChart={showCharts} />
</div>
) : null;
})}