watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2025-12-08 05:12:36 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Refactored website ordering feature.

Browse source
This commit is contained in:
Mike Cao 2022-08-04 03:56:30 -07:00
parent 62dce0a8d1
commit 1d4aa7c535
96 changed files with 518 additions and 174 deletions
Download patch file Download diff file Expand all files Collapse all files

26
components/pages/Dashboard.js
View file

@ -1,5 +1,5 @@
import { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { defineMessages, useIntl } from 'react-intl';
import { useRouter } from 'next/router';
import Page from 'components/layout/Page';
import PageHeader from 'components/layout/PageHeader';
@ -7,19 +7,24 @@ import WebsiteList from 'components/pages/WebsiteList';
import Button from 'components/common/Button';
import DashboardSettingsButton from 'components/settings/DashboardSettingsButton';
import useFetch from 'hooks/useFetch';
import useStore from 'store/app';
import useDashboard from 'store/dashboard';
import DashboardEdit from './DashboardEdit';
import styles from './WebsiteList.module.css';
const selector = state => state.dashboard;
const messages = defineMessages({
dashboard: { id: 'label.dashboard', defaultMessage: 'Dashboard' },
more: { id: 'label.more', defaultMessage: 'More' },
});
export default function Dashboard() {
const router = useRouter();
const { id } = router.query;
const userId = id?.[0];
const store = useStore(selector);
const { showCharts, limit } = store;
const dashboard = useDashboard();
const { showCharts, limit, editing } = dashboard;
const [max, setMax] = useState(limit);
const { data } = useFetch('/websites', { params: { user_id: userId } });
const { formatMessage } = useIntl();
function handleMore() {
setMax(max + limit);
@ -32,15 +37,14 @@ export default function Dashboard() {
return (
<Page>
<PageHeader>
<div>
<FormattedMessage id="label.dashboard" defaultMessage="Dashboard" />
</div>
<DashboardSettingsButton />
<div>{formatMessage(messages.dashboard)}</div>
{!editing && <DashboardSettingsButton />}
</PageHeader>
<WebsiteList websites={data} showCharts={showCharts} limit={max} />
{editing && <DashboardEdit data={data} />}
{!editing && <WebsiteList data={data} showCharts={showCharts} limit={max} />}
{max < data.length && (
<Button className={styles.button} onClick={handleMore}>
<FormattedMessage id="label.more" defaultMessage="More" />
{formatMessage(messages.more)}
</Button>
)}
</Page>