Skip to content

Commit 4d2a51c

Browse files
mikecaomikecao
authored
Merge pull request #186 from mikecao/dev
v0.42.0
2 parents b03b579 + 4bb95cd commit 4d2a51c

35 files changed

Lines changed: 236 additions & 88 deletions

‎assets/external-link.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎components/common/LanguageButton.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import Head from 'next/head';
33
import Menu from './Menu';
44
import Button from './Button';
55
import { menuOptions } from 'lib/lang';
6-
import { setItem } from 'lib/web';
76
import useLocale from 'hooks/useLocale';
87
import useDocumentClick from 'hooks/useDocumentClick';
98
import Globe from 'assets/globe.svg';
@@ -17,7 +16,6 @@ export default function LanguageButton({ menuPosition = 'bottom', menuAlign = 'l
1716

1817
function handleSelect(value) {
1918
setLocale(value);
20-
setItem('umami.locale', value);
2119
setShowMenu(false);
2220
}
2321

‎components/common/RefreshButton.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { getDateRange } from '../../lib/date';
1010

1111
export default function RefreshButton({ websiteId }) {
1212
const dispatch = useDispatch();
13-
const dateRange = useDateRange(websiteId);
13+
const [dateRange] = useDateRange(websiteId);
1414
const [loading, setLoading] = useState(false);
1515
const completed = useSelector(state => state.queries[`/api/website/${websiteId}/metrics`]);
1616

‎components/metrics/EventsChart.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React, { useMemo } from 'react';
22
import tinycolor from 'tinycolor2';
33
import BarChart from './BarChart';
4-
import { getTimezone, getDateArray, getDateLength } from 'lib/date';
4+
import { getDateArray, getDateLength } from 'lib/date';
55
import useFetch from 'hooks/useFetch';
66
import useDateRange from 'hooks/useDateRange';
7+
import useTimezone from 'hooks/useTimezone';
78

89
const COLORS = [
910
'#2680eb',
@@ -17,15 +18,17 @@ const COLORS = [
1718
];
1819

1920
export default function EventsChart({ websiteId, token }) {
20-
const dateRange = useDateRange(websiteId);
21+
const [dateRange] = useDateRange(websiteId);
2122
const { startDate, endDate, unit, modified } = dateRange;
23+
const [timezone] = useTimezone();
24+
2225
const { data } = useFetch(
2326
`/api/website/${websiteId}/events`,
2427
{
2528
start_at: +startDate,
2629
end_at: +endDate,
2730
unit,
28-
tz: getTimezone(),
31+
tz: timezone,
2932
token,
3033
},
3134
{ update: [modified] },

‎components/metrics/MetricsBar.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import MetricCard from './MetricCard';
99
import styles from './MetricsBar.module.css';
1010

1111
export default function MetricsBar({ websiteId, token, className }) {
12-
const dateRange = useDateRange(websiteId);
12+
const [dateRange] = useDateRange(websiteId);
1313
const { startDate, endDate, modified } = dateRange;
1414
const { data } = useFetch(
1515
`/api/website/${websiteId}/metrics`,

‎components/metrics/MetricsTable.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export default function MetricsTable({
2929
onDataLoad = () => {},
3030
onExpand = () => {},
3131
}) {
32-
const dateRange = useDateRange(websiteId);
32+
const [dateRange] = useDateRange(websiteId);
3333
const { startDate, endDate, modified } = dateRange;
3434
const { data } = useFetch(
3535
`/api/website/${websiteId}/rankings`,

‎components/metrics/WebsiteChart.js‎

Lines changed: 6 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, { useMemo } from 'react';
2-
import { useDispatch } from 'react-redux';
32
import classNames from 'classnames';
43
import PageviewsChart from './PageviewsChart';
54
import MetricsBar from './MetricsBar';
@@ -8,8 +7,8 @@ import DateFilter from 'components/common/DateFilter';
87
import StickyHeader from 'components/helpers/StickyHeader';
98
import useFetch from 'hooks/useFetch';
109
import useDateRange from 'hooks/useDateRange';
11-
import { getDateArray, getDateLength, getTimezone } from 'lib/date';
12-
import { setDateRange } from 'redux/actions/websites';
10+
import useTimezone from 'hooks/useTimezone';
11+
import { getDateArray, getDateLength } from 'lib/date';
1312
import styles from './WebsiteChart.module.css';
1413

1514
export default function WebsiteChart({
@@ -20,17 +19,17 @@ export default function WebsiteChart({
2019
showLink = false,
2120
onDataLoad = () => {},
2221
}) {
23-
const dispatch = useDispatch();
24-
const dateRange = useDateRange(websiteId);
22+
const [dateRange, setDateRange] = useDateRange(websiteId);
2523
const { startDate, endDate, unit, value, modified } = dateRange;
24+
const [timezone] = useTimezone();
2625

2726
const { data } = useFetch(
2827
`/api/website/${websiteId}/pageviews`,
2928
{
3029
start_at: +startDate,
3130
end_at: +endDate,
3231
unit,
33-
tz: getTimezone(),
32+
tz: timezone,
3433
token,
3534
},
3635
{ onDataLoad, update: [modified] },
@@ -46,10 +45,6 @@ export default function WebsiteChart({
4645
return [[], []];
4746
}, [data]);
4847

49-
function handleDateChange(values) {
50-
dispatch(setDateRange(websiteId, values));
51-
}
52-
5348
return (
5449
<>
5550
<WebsiteHeader websiteId={websiteId} token={token} title={title} showLink={showLink} />
@@ -67,7 +62,7 @@ export default function WebsiteChart({
6762
value={value}
6863
startDate={startDate}
6964
endDate={endDate}
70-
onChange={handleDateChange}
65+
onChange={setDateRange}
7166
/>
7267
</div>
7368
</StickyHeader>

‎components/settings/AccountSettings.js‎

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { useState } from 'react';
22
import { FormattedMessage } from 'react-intl';
3-
import { useRouter } from 'next/router';
3+
import Link from 'next/link';
44
import classNames from 'classnames';
55
import PageHeader from 'components/layout/PageHeader';
66
import Button from 'components/common/Button';
@@ -16,11 +16,10 @@ import Pen from 'assets/pen.svg';
1616
import Plus from 'assets/plus.svg';
1717
import Trash from 'assets/trash.svg';
1818
import Check from 'assets/check.svg';
19-
import List from 'assets/list-ul.svg';
19+
import LinkIcon from 'assets/external-link.svg';
2020
import styles from './AccountSettings.module.css';
2121

2222
export default function AccountSettings() {
23-
const router = useRouter();
2423
const [addAccount, setAddAccount] = useState();
2524
const [editAccount, setEditAccount] = useState();
2625
const [deleteAccount, setDeleteAccount] = useState();
@@ -30,16 +29,18 @@ export default function AccountSettings() {
3029

3130
const Checkmark = ({ is_admin }) => (is_admin ? <Icon icon={<Check />} size="medium" /> : null);
3231

32+
const DashboardLink = row =>
33+
row.is_admin ? null : (
34+
<Link href={`/dashboard/${row.user_id}/${row.username}`}>
35+
<a>
36+
<Icon icon={<LinkIcon />} />
37+
</a>
38+
</Link>
39+
);
40+
3341
const Buttons = row =>
3442
row.username !== 'admin' ? (
3543
<ButtonLayout>
36-
<Button
37-
icon={<List />}
38-
size="small"
39-
tooltip={<FormattedMessage id="button.websites" defaultMessage="Websites" />}
40-
tooltipId={`button-websites-${row.username}`}
41-
onClick={() => router.push(`/dashboard/${row.user_id}/${row.username}`)}
42-
/>
4344
<Button icon={<Pen />} size="small" onClick={() => setEditAccount(row)}>
4445
<div>
4546
<FormattedMessage id="button.edit" defaultMessage="Edit" />
@@ -57,17 +58,23 @@ export default function AccountSettings() {
5758
{
5859
key: 'username',
5960
label: <FormattedMessage id="label.username" defaultMessage="Username" />,
60-
className: 'col-6 col-md-4',
61+
className: 'col-4 col-md-3',
6162
},
6263
{
6364
key: 'is_admin',
6465
label: <FormattedMessage id="label.administrator" defaultMessage="Administrator" />,
65-
className: 'col-6 col-md-4',
66+
className: 'col-4 col-md-3',
6667
render: Checkmark,
6768
},
69+
{
70+
key: 'dashboard',
71+
label: <FormattedMessage id="label.dashboard" defaultMessage="Dashboard" />,
72+
className: 'col-4 col-md-3',
73+
render: DashboardLink,
74+
},
6875
{
6976
key: 'actions',
70-
className: classNames(styles.buttons, 'col-12 col-md-4 pt-2 pt-md-0'),
77+
className: classNames(styles.buttons, 'col-12 col-md-3 pt-2 pt-md-0'),
7178
render: Buttons,
7279
},
7380
];

‎components/settings/AccountSettings.module.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
.buttons {
22
display: flex;
33
justify-content: flex-end;
4+
flex: 1;
45
}

‎components/settings/DateRangeSetting.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import React from 'react';
2+
import { FormattedMessage } from 'react-intl';
3+
import DateFilter from 'components/common/DateFilter';
4+
import Button from 'components/common/Button';
5+
import useDateRange from 'hooks/useDateRange';
6+
import { DEFAULT_DATE_RANGE } from 'lib/constants';
7+
import { getDateRange } from 'lib/date';
8+
import styles from './DateRangeSetting.module.css';
9+
10+
export default function DateRangeSetting() {
11+
const [dateRange, setDateRange] = useDateRange();
12+
const { startDate, endDate, value } = dateRange;
13+
14+
function handleReset() {
15+
setDateRange(getDateRange(DEFAULT_DATE_RANGE));
16+
}
17+
18+
return (
19+
<>
20+
<DateFilter value={value} startDate={startDate} endDate={endDate} onChange={setDateRange} />
21+
<Button className={styles.button} size="small" onClick={handleReset}>
22+
<FormattedMessage id="button.reset" defaultMessage="Reset" />
23+
</Button>
24+
</>
25+
);
26+
}

0 commit comments

Comments
 (0)