diff --git a/components/forms/AccountEditForm.js b/components/forms/AccountEditForm.js index 4b185f1a..97317aff 100644 --- a/components/forms/AccountEditForm.js +++ b/components/forms/AccountEditForm.js @@ -8,7 +8,7 @@ import FormLayout, { FormMessage, FormRow, } from 'components/layout/FormLayout'; -import usePost from 'hooks/usePost'; +import useApi from 'hooks/useApi'; const initialValues = { username: '', @@ -29,11 +29,11 @@ const validate = ({ user_id, username, password }) => { }; export default function AccountEditForm({ values, onSave, onClose }) { - const post = usePost(); + const { post } = useApi(); const [message, setMessage] = useState(); const handleSubmit = async values => { - const { ok, data } = await post('/api/account', values); + const { ok, data } = await post('/account', values); if (ok) { onSave(); diff --git a/components/forms/ChangePasswordForm.js b/components/forms/ChangePasswordForm.js index d62b5539..29f34521 100644 --- a/components/forms/ChangePasswordForm.js +++ b/components/forms/ChangePasswordForm.js @@ -8,7 +8,7 @@ import FormLayout, { FormMessage, FormRow, } from 'components/layout/FormLayout'; -import usePost from 'hooks/usePost'; +import useApi from 'hooks/useApi'; const initialValues = { current_password: '', @@ -37,11 +37,11 @@ const validate = ({ current_password, new_password, confirm_password }) => { }; export default function ChangePasswordForm({ values, onSave, onClose }) { - const post = usePost(); + const { post } = useApi(); const [message, setMessage] = useState(); const handleSubmit = async values => { - const { ok, data } = await post('/api/account/password', values); + const { ok, data } = await post('/account/password', values); if (ok) { onSave(); diff --git a/components/forms/DeleteForm.js b/components/forms/DeleteForm.js index 78600305..7fa5d6f6 100644 --- a/components/forms/DeleteForm.js +++ b/components/forms/DeleteForm.js @@ -8,7 +8,7 @@ import FormLayout, { FormMessage, FormRow, } from 'components/layout/FormLayout'; -import useDelete from 'hooks/useDelete'; +import useApi from 'hooks/useApi'; const CONFIRMATION_WORD = 'DELETE'; @@ -27,11 +27,11 @@ const validate = ({ confirmation }) => { }; export default function DeleteForm({ values, onSave, onClose }) { - const del = useDelete(); + const { del } = useApi(); const [message, setMessage] = useState(); const handleSubmit = async ({ type, id }) => { - const { ok, data } = await del(`/api/${type}/${id}`); + const { ok, data } = await del(`/${type}/${id}`); if (ok) { onSave(); diff --git a/components/forms/LoginForm.js b/components/forms/LoginForm.js index 276a7a4e..f73241ac 100644 --- a/components/forms/LoginForm.js +++ b/components/forms/LoginForm.js @@ -10,7 +10,7 @@ import FormLayout, { FormRow, } from 'components/layout/FormLayout'; import Icon from 'components/common/Icon'; -import usePost from 'hooks/usePost'; +import useApi from 'hooks/useApi'; import { setItem } from 'lib/web'; import { AUTH_TOKEN } from 'lib/constants'; import { setUser } from 'store/app'; @@ -31,12 +31,12 @@ const validate = ({ username, password }) => { }; export default function LoginForm() { - const post = usePost(); + const { post } = useApi(); const router = useRouter(); const [message, setMessage] = useState(); const handleSubmit = async ({ username, password }) => { - const { ok, status, data } = await post('/api/auth/login', { + const { ok, status, data } = await post('/auth/login', { username, password, }); diff --git a/components/forms/ResetForm.js b/components/forms/ResetForm.js index 791039ac..924aa7b1 100644 --- a/components/forms/ResetForm.js +++ b/components/forms/ResetForm.js @@ -8,7 +8,7 @@ import FormLayout, { FormMessage, FormRow, } from 'components/layout/FormLayout'; -import usePost from 'hooks/usePost'; +import useApi from 'hooks/useApi'; const CONFIRMATION_WORD = 'RESET'; @@ -27,11 +27,11 @@ const validate = ({ confirmation }) => { }; export default function ResetForm({ values, onSave, onClose }) { - const post = usePost(); + const { post } = useApi(); const [message, setMessage] = useState(); const handleSubmit = async ({ type, id }) => { - const { ok, data } = await post(`/api/${type}/${id}/reset`); + const { ok, data } = await post(`/${type}/${id}/reset`); if (ok) { onSave(); diff --git a/components/forms/WebsiteEditForm.js b/components/forms/WebsiteEditForm.js index 0be48561..64655d56 100644 --- a/components/forms/WebsiteEditForm.js +++ b/components/forms/WebsiteEditForm.js @@ -10,7 +10,7 @@ import FormLayout, { } from 'components/layout/FormLayout'; import Checkbox from 'components/common/Checkbox'; import { DOMAIN_REGEX } from 'lib/constants'; -import usePost from 'hooks/usePost'; +import useApi from 'hooks/useApi'; const initialValues = { name: '', @@ -34,11 +34,11 @@ const validate = ({ name, domain }) => { }; export default function WebsiteEditForm({ values, onSave, onClose }) { - const post = usePost(); + const { post } = useApi(); const [message, setMessage] = useState(); const handleSubmit = async values => { - const { ok, data } = await post('/api/website', values); + const { ok, data } = await post('/website', values); if (ok) { onSave(); diff --git a/components/metrics/ActiveUsers.js b/components/metrics/ActiveUsers.js index 1be5b5c3..41ab7694 100644 --- a/components/metrics/ActiveUsers.js +++ b/components/metrics/ActiveUsers.js @@ -9,7 +9,7 @@ import styles from './ActiveUsers.module.css'; export default function ActiveUsers({ websiteId, className, value, interval = 60000 }) { const shareToken = useShareToken(); - const { data } = useFetch(!value && `/api/website/${websiteId}/active`, { + const { data } = useFetch(!value && `/website/${websiteId}/active`, { interval, headers: { [TOKEN_HEADER]: shareToken?.token }, }); diff --git a/components/metrics/EventsChart.js b/components/metrics/EventsChart.js index 89318a5a..6b478b90 100644 --- a/components/metrics/EventsChart.js +++ b/components/metrics/EventsChart.js @@ -17,7 +17,7 @@ export default function EventsChart({ websiteId, className, token }) { const shareToken = useShareToken(); const { data, loading } = useFetch( - `/api/website/${websiteId}/events`, + `/website/${websiteId}/events`, { params: { start_at: +startDate, diff --git a/components/metrics/MetricsBar.js b/components/metrics/MetricsBar.js index 7852b96c..492f2a88 100644 --- a/components/metrics/MetricsBar.js +++ b/components/metrics/MetricsBar.js @@ -22,7 +22,7 @@ export default function MetricsBar({ websiteId, className }) { } = usePageQuery(); const { data, error, loading } = useFetch( - `/api/website/${websiteId}/stats`, + `/website/${websiteId}/stats`, { params: { start_at: +startDate, diff --git a/components/metrics/MetricsTable.js b/components/metrics/MetricsTable.js index 95eb00c3..90dbe6ab 100644 --- a/components/metrics/MetricsTable.js +++ b/components/metrics/MetricsTable.js @@ -35,7 +35,7 @@ export default function MetricsTable({ } = usePageQuery(); const { data, loading, error } = useFetch( - `/api/website/${websiteId}/metrics`, + `/website/${websiteId}/metrics`, { params: { type, diff --git a/components/metrics/WebsiteChart.js b/components/metrics/WebsiteChart.js index 62a38694..f3d3e371 100644 --- a/components/metrics/WebsiteChart.js +++ b/components/metrics/WebsiteChart.js @@ -41,7 +41,7 @@ export default function WebsiteChart({ } = usePageQuery(); const { data, loading, error } = useFetch( - `/api/website/${websiteId}/pageviews`, + `/website/${websiteId}/pageviews`, { params: { start_at: +startDate, diff --git a/components/pages/RealtimeDashboard.js b/components/pages/RealtimeDashboard.js index 890f0db4..a7e69726 100644 --- a/components/pages/RealtimeDashboard.js +++ b/components/pages/RealtimeDashboard.js @@ -33,8 +33,8 @@ export default function RealtimeDashboard() { const countryNames = useCountryNames(locale); const [data, setData] = useState(); const [websiteId, setWebsiteId] = useState(0); - const { data: init, loading } = useFetch('/api/realtime/init'); - const { data: updates } = useFetch('/api/realtime/update', { + const { data: init, loading } = useFetch('/realtime/init'); + const { data: updates } = useFetch('/realtime/update', { params: { start_at: data?.timestamp }, disabled: !init?.websites?.length || !data, interval: REALTIME_INTERVAL, diff --git a/components/pages/TestConsole.js b/components/pages/TestConsole.js index fff60516..2767de01 100644 --- a/components/pages/TestConsole.js +++ b/components/pages/TestConsole.js @@ -21,7 +21,7 @@ export default function TestConsole() { const [website, setWebsite] = useState(); const [show, setShow] = useState(true); const { basePath } = useRouter(); - const { data } = useFetch('/api/websites'); + const { data } = useFetch('/websites'); if (!data || !user?.is_admin) { return null; diff --git a/components/pages/WebsiteDetails.js b/components/pages/WebsiteDetails.js index 2d9dceaa..94e8a930 100644 --- a/components/pages/WebsiteDetails.js +++ b/components/pages/WebsiteDetails.js @@ -37,7 +37,7 @@ const views = { export default function WebsiteDetails({ websiteId }) { const shareToken = useShareToken(); - const { data } = useFetch(`/api/website/${websiteId}`, { + const { data } = useFetch(`/website/${websiteId}`, { headers: { [TOKEN_HEADER]: shareToken?.token }, }); const [chartLoaded, setChartLoaded] = useState(false); diff --git a/components/pages/WebsiteList.js b/components/pages/WebsiteList.js index a5acc063..0a29d8ed 100644 --- a/components/pages/WebsiteList.js +++ b/components/pages/WebsiteList.js @@ -11,7 +11,7 @@ import Chart from 'assets/chart-bar.svg'; import styles from './WebsiteList.module.css'; export default function WebsiteList({ userId }) { - const { data } = useFetch('/api/websites', { params: { user_id: userId } }); + const { data } = useFetch('/websites', { params: { user_id: userId } }); const [showCharts, setShowCharts] = useState(true); if (!data) { diff --git a/components/settings/AccountSettings.js b/components/settings/AccountSettings.js index 46629587..14304bc2 100644 --- a/components/settings/AccountSettings.js +++ b/components/settings/AccountSettings.js @@ -25,7 +25,7 @@ export default function AccountSettings() { const [deleteAccount, setDeleteAccount] = useState(); const [saved, setSaved] = useState(0); const [message, setMessage] = useState(); - const { data } = useFetch(`/api/accounts`, {}, [saved]); + const { data } = useFetch(`/accounts`, {}, [saved]); const Checkmark = ({ is_admin }) => (is_admin ? } size="medium" /> : null); diff --git a/components/settings/WebsiteSettings.js b/components/settings/WebsiteSettings.js index 090866da..c99ec76c 100644 --- a/components/settings/WebsiteSettings.js +++ b/components/settings/WebsiteSettings.js @@ -36,9 +36,7 @@ export default function WebsiteSettings() { const [showUrl, setShowUrl] = useState(); const [saved, setSaved] = useState(0); const [message, setMessage] = useState(); - const { data } = useFetch(`/api/websites` + (user.is_admin ? '?include_all=true' : ''), {}, [ - saved, - ]); + const { data } = useFetch(`/websites` + (user?.is_admin ? '?include_all=true' : ''), {}, [saved]); const Buttons = row => ( diff --git a/hooks/useApi.js b/hooks/useApi.js new file mode 100644 index 00000000..57dd9bd6 --- /dev/null +++ b/hooks/useApi.js @@ -0,0 +1,25 @@ +import { useCallback } from 'react'; +import { useRouter } from 'next/router'; +import { get, post, put, del } from 'lib/web'; + +export default function useApi() { + const { basePath } = useRouter(); + + return { + get: useCallback(async (url, params, headers) => { + return get(`${basePath}/api/${url}`, params, headers); + }, []), + + post: useCallback(async (url, params, headers) => { + return post(`${basePath}/api/${url}`, params, headers); + }, []), + + put: useCallback(async (url, params, headers) => { + return put(`${basePath}/api/${url}`, params, headers); + }, []), + + del: useCallback(async (url, params, headers) => { + return del(`${basePath}/api/${url}`, params, headers); + }, []), + }; +} diff --git a/hooks/useDelete.js b/hooks/useDelete.js deleted file mode 100644 index 253ae1da..00000000 --- a/hooks/useDelete.js +++ /dev/null @@ -1,11 +0,0 @@ -import { useCallback } from 'react'; -import { useRouter } from 'next/router'; -import { del } from 'lib/web'; - -export default function useDelete() { - const { basePath } = useRouter(); - - return useCallback(async (url, params, headers) => { - return del(`${basePath}${url}`, params, headers); - }, []); -} diff --git a/hooks/useFetch.js b/hooks/useFetch.js index d5e23c3d..029f6219 100644 --- a/hooks/useFetch.js +++ b/hooks/useFetch.js @@ -1,14 +1,13 @@ import { useState, useEffect } from 'react'; -import { useRouter } from 'next/router'; -import { get } from 'lib/web'; import { saveQuery } from 'store/queries'; +import useApi from './useApi'; export default function useFetch(url, options = {}, update = []) { const [response, setResponse] = useState(); const [error, setError] = useState(); const [loading, setLoadiing] = useState(false); const [count, setCount] = useState(0); - const { basePath } = useRouter(); + const { get } = useApi(); const { params = {}, headers = {}, disabled, delay = 0, interval, onDataLoad } = options; async function loadData(params) { @@ -17,7 +16,7 @@ export default function useFetch(url, options = {}, update = []) { setError(null); const time = performance.now(); - const { data, status, ok } = await get(`${basePath}${url}`, params, headers); + const { data, status, ok } = await get(url, params, headers); await saveQuery(url, { time: performance.now() - time, completed: Date.now() }); diff --git a/hooks/usePost.js b/hooks/usePost.js deleted file mode 100644 index 3114ede7..00000000 --- a/hooks/usePost.js +++ /dev/null @@ -1,11 +0,0 @@ -import { useCallback } from 'react'; -import { useRouter } from 'next/router'; -import { post } from 'lib/web'; - -export default function usePost() { - const { basePath } = useRouter(); - - return useCallback(async (url, params, headers) => { - return post(`${basePath}${url}`, params, headers); - }, []); -} diff --git a/public/messages/de-DE.json b/public/messages/de-DE.json index 129643e7..52420a70 100644 --- a/public/messages/de-DE.json +++ b/public/messages/de-DE.json @@ -568,7 +568,7 @@ "message.reset-warning": [ { "type": 0, - "value": "Alle Daten für diese Website werden gelöscht, jedoch bleibt der tracking code bestehen." + "value": "Alle Daten für diese Webseite werden gelöscht, jedoch bleibt der Tracking Code bestehen." } ], "message.save-success": [