m/umami
1
0
Fork 0
mirror of https://github.com/kremalicious/umami.git synced 2024-11-15 17:55:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix refresh button. Closes #994, #985.

Browse Source
This commit is contained in:
Mike Cao 2022-03-01 21:13:15 -08:00
parent f547f2b0ec
commit 69b81880cb
7 changed files with 38 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/common/RefreshButton.js
View File

@ -11,13 +11,17 @@ import useDateRange from 'hooks/useDateRange';
function RefreshButton({ websiteId }) { function RefreshButton({ websiteId }) {
const [dateRange] = useDateRange(websiteId); const [dateRange] = useDateRange(websiteId);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const selector = useCallback(state => state[`/api/website/${websiteId}/stats`], [websiteId]); const selector = useCallback(state => state[`/website/${websiteId}/stats`], [websiteId]);
const completed = useStore(selector); const completed = useStore(selector);
function handleClick() { function handleClick() {
if (dateRange) { if (!loading && dateRange) {
setLoading(true); setLoading(true);
setDateRange(websiteId, dateRange); if (/^[\d]+/.test(dateRange.value)) {
setDateRange(websiteId, dateRange.value);
} else {
setDateRange(websiteId, dateRange);
}
} }
} }

3
components/metrics/MetricsTable.js
View File

@ -26,8 +26,7 @@ export default function MetricsTable({
...props ...props
}) { }) {
const shareToken = useShareToken(); const shareToken = useShareToken();
const [dateRange] = useDateRange(websiteId); const [{ startDate, endDate, modified }] = useDateRange(websiteId);
const { startDate, endDate, modified } = dateRange;
const { const {
resolve, resolve,
router, router,

13
components/metrics/WebsiteChart.js
View File

@ -1,6 +1,5 @@
import React, { useMemo } from 'react'; import React, { useMemo } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import { useRouter } from 'next/router';
import PageviewsChart from './PageviewsChart'; import PageviewsChart from './PageviewsChart';
import MetricsBar from './MetricsBar'; import MetricsBar from './MetricsBar';
import WebsiteHeader from './WebsiteHeader'; import WebsiteHeader from './WebsiteHeader';
@ -12,11 +11,10 @@ import useFetch from 'hooks/useFetch';
import useDateRange from 'hooks/useDateRange'; import useDateRange from 'hooks/useDateRange';
import useTimezone from 'hooks/useTimezone'; import useTimezone from 'hooks/useTimezone';
import usePageQuery from 'hooks/usePageQuery'; import usePageQuery from 'hooks/usePageQuery';
import useLocale from 'hooks/useLocale'; import { getDateArray, getDateLength, getDateRangeValues } from 'lib/date';
import { getDateArray, getDateLength, getDateRange, getDateRangeValues } from 'lib/date';
import useShareToken from 'hooks/useShareToken'; import useShareToken from 'hooks/useShareToken';
import useApi from 'hooks/useApi';
import { TOKEN_HEADER } from 'lib/constants'; import { TOKEN_HEADER } from 'lib/constants';
import { get } from 'lib/web';
import styles from './WebsiteChart.module.css'; import styles from './WebsiteChart.module.css';
export default function WebsiteChart({ export default function WebsiteChart({
@ -31,14 +29,13 @@ export default function WebsiteChart({
const shareToken = useShareToken(); const shareToken = useShareToken();
const [dateRange, setDateRange] = useDateRange(websiteId); const [dateRange, setDateRange] = useDateRange(websiteId);
const { startDate, endDate, unit, value, modified } = dateRange; const { startDate, endDate, unit, value, modified } = dateRange;
const { locale } = useLocale();
const [timezone] = useTimezone(); const [timezone] = useTimezone();
const { basePath } = useRouter();
const { const {
router, router,
resolve, resolve,
query: { url, ref }, query: { url, ref },
} = usePageQuery(); } = usePageQuery();
const { get } = useApi();
const { data, loading, error } = useFetch( const { data, loading, error } = useFetch(
`/website/${websiteId}/pageviews`, `/website/${websiteId}/pageviews`,
@ -73,12 +70,10 @@ export default function WebsiteChart({
async function handleDateChange(value) { async function handleDateChange(value) {
if (value === 'all') { if (value === 'all') {
const { data, ok } = await get(`${basePath}/api/website/${websiteId}`); const { data, ok } = await get(`/website/${websiteId}`);
if (ok) { if (ok) {
setDateRange({ value, ...getDateRangeValues(new Date(data.created_at), Date.now()) }); setDateRange({ value, ...getDateRangeValues(new Date(data.created_at), Date.now()) });
} }
} else if (typeof value === 'string') {
setDateRange(getDateRange(value, locale));
} else { } else {
setDateRange(value); setDateRange(value);
} }

20
components/pages/WebsiteDetails.js
View File

@ -9,20 +9,20 @@ import MenuLayout from 'components/layout/MenuLayout';
import Link from 'components/common/Link'; import Link from 'components/common/Link';
import Loading from 'components/common/Loading'; import Loading from 'components/common/Loading';
import Arrow from 'assets/arrow-right.svg'; import Arrow from 'assets/arrow-right.svg';
import styles from './WebsiteDetails.module.css'; import PagesTable from 'components/metrics/PagesTable';
import PagesTable from '../metrics/PagesTable'; import ReferrersTable from 'components/metrics/ReferrersTable';
import ReferrersTable from '../metrics/ReferrersTable'; import BrowsersTable from 'components/metrics/BrowsersTable';
import BrowsersTable from '../metrics/BrowsersTable'; import OSTable from 'components/metrics/OSTable';
import OSTable from '../metrics/OSTable'; import DevicesTable from 'components/metrics/DevicesTable';
import DevicesTable from '../metrics/DevicesTable'; import CountriesTable from 'components/metrics/CountriesTable';
import CountriesTable from '../metrics/CountriesTable'; import LanguagesTable from 'components/metrics/LanguagesTable';
import LanguagesTable from '../metrics/LanguagesTable'; import EventsTable from 'components/metrics/EventsTable';
import EventsTable from '../metrics/EventsTable'; import EventsChart from 'components/metrics/EventsChart';
import EventsChart from '../metrics/EventsChart';
import useFetch from 'hooks/useFetch'; import useFetch from 'hooks/useFetch';
import usePageQuery from 'hooks/usePageQuery'; import usePageQuery from 'hooks/usePageQuery';
import useShareToken from 'hooks/useShareToken'; import useShareToken from 'hooks/useShareToken';
import { DEFAULT_ANIMATION_DURATION, TOKEN_HEADER } from 'lib/constants'; import { DEFAULT_ANIMATION_DURATION, TOKEN_HEADER } from 'lib/constants';
import styles from './WebsiteDetails.module.css';
const views = { const views = {
url: PagesTable, url: PagesTable,

10
components/settings/DateRangeSetting.js
View File

@ -14,14 +14,6 @@ export default function DateRangeSetting() {
const { startDate, endDate, value } = dateRange; const { startDate, endDate, value } = dateRange;
const options = filterOptions.filter(e => e.value !== 'all'); const options = filterOptions.filter(e => e.value !== 'all');
function handleChange(value) {
if (typeof value === 'string') {
setDateRange(getDateRange(value, locale));
} else {
setDateRange(value);
}
}
function handleReset() { function handleReset() {
setDateRange(getDateRange(DEFAULT_DATE_RANGE, locale)); setDateRange(getDateRange(DEFAULT_DATE_RANGE, locale));
} }
@ -33,7 +25,7 @@ export default function DateRangeSetting() {
value={value} value={value}
startDate={startDate} startDate={startDate}
endDate={endDate} endDate={endDate}
onChange={handleChange} onChange={setDateRange}
/> />
<Button className={styles.button} size="small" onClick={handleReset}> <Button className={styles.button} size="small" onClick={handleReset}>
<FormattedMessage id="label.reset" defaultMessage="Reset" /> <FormattedMessage id="label.reset" defaultMessage="Reset" />

7
hooks/useShareToken.js
View File

@ -1,16 +1,15 @@
import { useEffect } from 'react'; import { useEffect } from 'react';
import { useRouter } from 'next/router';
import { get } from 'lib/web';
import useStore, { setShareToken } from 'store/app'; import useStore, { setShareToken } from 'store/app';
import useApi from './useApi';
const selector = state => state.shareToken; const selector = state => state.shareToken;
export default function useShareToken(shareId) { export default function useShareToken(shareId) {
const { basePath } = useRouter();
const shareToken = useStore(selector); const shareToken = useStore(selector);
const { get } = useApi();
async function loadToken(id) { async function loadToken(id) {
const { data } = await get(`${basePath}/api/share/${id}`); const { data } = await get(`/share/${id}`);
if (data) { if (data) {
setShareToken(data); setShareToken(data);

13
store/websites.js
View File

@ -1,15 +1,26 @@
import create from 'zustand'; import create from 'zustand';
import produce from 'immer'; import produce from 'immer';
import app from './app';
import { getDateRange } from '../lib/date';
const store = create(() => ({})); const store = create(() => ({}));
export function setDateRange(websiteId, dateRange) { export function setDateRange(websiteId, value) {
store.setState( store.setState(
produce(state => { produce(state => {
if (!state[websiteId]) { if (!state[websiteId]) {
state[websiteId] = {}; state[websiteId] = {};
} }
let dateRange = value;
if (typeof value === 'string') {
const { locale } = app.getState();
dateRange = getDateRange(value, locale);
}
console.log({ websiteId, value, dateRange });
state[websiteId].dateRange = { ...dateRange, modified: Date.now() }; state[websiteId].dateRange = { ...dateRange, modified: Date.now() };
return state; return state;