watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-04 04:37:11 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

MySQL query optimization. Added loading component.

Browse source
This commit is contained in:
Mike Cao 2020-08-27 23:45:37 -07:00
parent a7e7469d22
commit ccb98f836f
13 changed files with 158 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

55
components/metrics/MetricsTable.js
View file

@ -8,6 +8,7 @@ import { get } from 'lib/web';
import { percentFilter } from 'lib/filters';
import { formatNumber, formatLongNumber } from 'lib/format';
import styles from './MetricsTable.module.css';
import Loading from '../common/Loading';
export default function MetricsTable({
title,
@ -79,35 +80,37 @@ export default function MetricsTable({
}
}, [websiteId, startDate, endDate, type]);
if (!data) {
return null;
}
return (
<div className={classNames(styles.container, className)}>
<div className={styles.header}>
<div className={styles.title}>{title}</div>
{headerComponent}
<div className={styles.metric} onClick={handleSetFormat}>
{metric}
</div>
</div>
<div className={styles.body}>
{limit
? rankings.map(row => getRow(row))
: data?.length > 0 && (
<FixedSizeList height={500} itemCount={rankings.length} itemSize={30}>
{Row}
</FixedSizeList>
{data ? (
<>
<div className={styles.header}>
<div className={styles.title}>{title}</div>
{headerComponent}
<div className={styles.metric} onClick={handleSetFormat}>
{metric}
</div>
</div>
<div className={styles.body}>
{limit
? rankings.map(row => getRow(row))
: data?.length > 0 && (
<FixedSizeList height={500} itemCount={rankings.length} itemSize={30}>
{Row}
</FixedSizeList>
)}
</div>
<div className={styles.footer}>
{limit && data.length > limit && (
<Button icon={<Arrow />} size="xsmall" onClick={() => onExpand(type)}>
<div>More</div>
</Button>
)}
</div>
<div className={styles.footer}>
{limit && data.length > limit && (
<Button icon={<Arrow />} size="xsmall" onClick={() => onExpand(type)}>
<div>More</div>
</Button>
)}
</div>
</div>
</>
) : (
<Loading />
)}
</div>
);
}