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

use uuid

Browse source
This commit is contained in:
Brian Cao 2022-10-31 23:42:37 -07:00
parent 246e4e5f4f
commit 17041efaae
73 changed files with 491 additions and 874 deletions
Download patch file Download diff file Expand all files Collapse all files

2
components/forms/ChangePasswordForm.js
View file

@ -43,7 +43,7 @@ export default function ChangePasswordForm({ values, onSave, onClose }) {
const { user } = useUser();
const handleSubmit = async values => {
const { ok, error } = await post(`/accounts/${user.accountUuid}/password`, values);
const { ok, error } = await post(`/users/${user.id}/password`, values);
if (ok) {
onSave();

2
components/forms/TrackingCodeForm.js
View file

@ -26,7 +26,7 @@ export default function TrackingCodeForm({ values, onClose }) {
rows={3}
cols={60}
spellCheck={false}
defaultValue={`<script async defer data-website-id="${values.websiteUuid}" src="${
defaultValue={`<script async defer data-website-id="${values.id}" src="${
document.location.origin
}${basePath}/${trackerScriptName ? `${trackerScriptName}.js` : 'umami.js'}"></script>`}
readOnly

4
components/forms/AccountEditForm.js → components/forms/UserEditForm.js
View file

@ -28,13 +28,13 @@ const validate = ({ id, username, password }) => {
return errors;
};
export default function AccountEditForm({ values, onSave, onClose }) {
export default function UserEditForm({ values, onSave, onClose }) {
const { post } = useApi();
const [message, setMessage] = useState();
const handleSubmit = async values => {
const { id } = values;
const { ok, data } = await post(id ? `/accounts/${id}` : '/accounts', values);
const { ok, data } = await post(id ? `/users/${id}` : '/users', values);
if (ok) {
onSave();

14
components/forms/WebsiteEditForm.js
View file

@ -37,7 +37,7 @@ const validate = ({ name, domain }) => {
return errors;
};
const OwnerDropDown = ({ user, accounts }) => {
const OwnerDropDown = ({ user, users }) => {
const { setFieldValue, values } = useFormikContext();
useEffect(() => {
@ -46,7 +46,7 @@ const OwnerDropDown = ({ user, accounts }) => {
} else if (user?.id && values.owner === '') {
setFieldValue('owner', user.id.toString());
}
}, [accounts, setFieldValue, user, values]);
}, [users, setFieldValue, user, values]);
if (user?.isAdmin) {
return (
@ -56,7 +56,7 @@ const OwnerDropDown = ({ user, accounts }) => {
</label>
<div>
<Field as="select" name="owner" className={styles.dropdown}>
{accounts?.map(acc => (
{users?.map(acc => (
<option key={acc.id} value={acc.id}>
{acc.username}
</option>
@ -73,14 +73,14 @@ const OwnerDropDown = ({ user, accounts }) => {
export default function WebsiteEditForm({ values, onSave, onClose }) {
const { post } = useApi();
const { data: accounts } = useFetch(`/accounts`);
const { data: users } = useFetch(`/users`);
const { user } = useUser();
const [message, setMessage] = useState();
const handleSubmit = async values => {
const { websiteUuid: websiteId } = values;
const { id } = values;
const { ok, data } = await post(websiteId ? `/websites/${websiteId}` : '/websites', values);
const { ok, data } = await post(id ? `/websites/${id}` : '/websites', values);
if (ok) {
onSave();
@ -125,7 +125,7 @@ export default function WebsiteEditForm({ values, onSave, onClose }) {
<FormError name="domain" />
</div>
</FormRow>
<OwnerDropDown accounts={accounts} user={user} />
<OwnerDropDown users={users} user={user} />
<FormRow>
<label />
<Field name="enableShareUrl">

4
components/metrics/RealtimeHeader.js
View file

@ -14,9 +14,9 @@ export default function RealtimeHeader({ websites, data, websiteId, onSelect })
value: null,
},
].concat(
websites.map(({ name, websiteUuid }, index) => ({
websites.map(({ name, id }, index) => ({
label: name,
value: websiteUuid,
value: id,
divider: index === 0,
})),
);

12
components/pages/DashboardEdit.js
View file

@ -24,7 +24,7 @@ export default function DashboardEdit({ websites }) {
const ordered = useMemo(
() =>
websites
.map(website => ({ ...website, order: order.indexOf(website.websiteUuid) }))
.map(website => ({ ...website, order: order.indexOf(website.id) }))
.sort(firstBy('order')),
[websites, order],
);
@ -36,7 +36,7 @@ export default function DashboardEdit({ websites }) {
const [removed] = orderedWebsites.splice(source.index, 1);
orderedWebsites.splice(destination.index, 0, removed);
setOrder(orderedWebsites.map(website => website?.websiteUuid || 0));
setOrder(orderedWebsites.map(website => website?.id || 0));
}
function handleSave() {
@ -76,12 +76,8 @@ export default function DashboardEdit({ websites }) {
ref={provided.innerRef}
style={{ marginBottom: snapshot.isDraggingOver ? 260 : null }}
>
{ordered.map(({ websiteUuid, name, domain }, index) => (
<Draggable
key={websiteUuid}
draggableId={`${dragId}-${websiteUuid}`}
index={index}
>
{ordered.map(({ id, name, domain }, index) => (
<Draggable key={id} draggableId={`${dragId}-${id}`} index={index}>
{(provided, snapshot) => (
<div
ref={provided.innerRef}

16
components/pages/RealtimeDashboard.js
View file

@ -32,7 +32,7 @@ export default function RealtimeDashboard() {
const { locale } = useLocale();
const countryNames = useCountryNames(locale);
const [data, setData] = useState();
const [websiteUuid, setWebsiteUuid] = useState(null);
const [websiteId, setWebsiteId] = useState(null);
const { data: init, loading } = useFetch('/realtime/init');
const { data: updates } = useFetch('/realtime/update', {
params: { start_at: data?.timestamp },
@ -50,8 +50,8 @@ export default function RealtimeDashboard() {
if (data) {
const { pageviews, sessions, events } = data;
if (websiteUuid) {
const { id } = init.websites.find(n => n.websiteUuid === websiteUuid);
if (websiteId) {
const { id } = init.websites.find(n => n.id === websiteId);
return {
pageviews: filterWebsite(pageviews, id),
sessions: filterWebsite(sessions, id),
@ -61,7 +61,7 @@ export default function RealtimeDashboard() {
}
return data;
}, [data, websiteUuid]);
}, [data, websiteId]);
const countries = useMemo(() => {
if (realtimeData?.sessions) {
@ -118,9 +118,9 @@ export default function RealtimeDashboard() {
<Page>
<RealtimeHeader
websites={websites}
websiteId={websiteUuid}
websiteId={websiteId}
data={{ ...realtimeData, countries }}
onSelect={setWebsiteUuid}
onSelect={setWebsiteId}
/>
<div className={styles.chart}>
<RealtimeChart data={realtimeData} unit="minute" records={REALTIME_RANGE} />
@ -128,10 +128,10 @@ export default function RealtimeDashboard() {
<GridLayout>
<GridRow>
<GridColumn xs={12} lg={4}>
<RealtimeViews websiteId={websiteUuid} data={realtimeData} websites={websites} />
<RealtimeViews websiteId={websiteId} data={realtimeData} websites={websites} />
</GridColumn>
<GridColumn xs={12} lg={8}>
<RealtimeLog websiteId={websiteUuid} data={realtimeData} websites={websites} />
<RealtimeLog websiteId={websiteId} data={realtimeData} websites={websites} />
</GridColumn>
</GridRow>
<GridRow>

8
components/pages/Settings.js
View file

@ -4,12 +4,12 @@ import { useRouter } from 'next/router';
import Page from 'components/layout/Page';
import MenuLayout from 'components/layout/MenuLayout';
import WebsiteSettings from 'components/settings/WebsiteSettings';
import AccountSettings from 'components/settings/AccountSettings';
import UserSettings from 'components/settings/UserSettings';
import ProfileSettings from 'components/settings/ProfileSettings';
import useUser from 'hooks/useUser';
const WEBSITES = '/settings';
const ACCOUNTS = '/settings/accounts';
const ACCOUNTS = '/settings/users';
const PROFILE = '/settings/profile';
export default function Settings() {
@ -28,7 +28,7 @@ export default function Settings() {
value: WEBSITES,
},
{
label: <FormattedMessage id="label.accounts" defaultMessage="Accounts" />,
label: <FormattedMessage id="label.users" defaultMessage="Users" />,
value: ACCOUNTS,
hidden: !user?.isAdmin,
},
@ -42,7 +42,7 @@ export default function Settings() {
<Page>
<MenuLayout menu={menuOptions} selectedOption={option} onMenuSelect={setOption}>
{pathname === WEBSITES && <WebsiteSettings />}
{pathname === ACCOUNTS && <AccountSettings />}
{pathname === ACCOUNTS && <UserSettings />}
{pathname === PROFILE && <ProfileSettings />}
</MenuLayout>
</Page>

12
components/pages/TestConsole.js
View file

@ -24,9 +24,9 @@ export default function TestConsole() {
return null;
}
const options = data.map(({ name, websiteUuid }) => ({ label: name, value: websiteUuid }));
const website = data.find(({ websiteUuid }) => websiteId === websiteUuid);
const selectedValue = options.find(({ value }) => value === website?.websiteUuid)?.value;
const options = data.map(({ name, id }) => ({ label: name, value: id }));
const website = data.find(({ id }) => websiteId === id);
const selectedValue = options.find(({ value }) => value === website?.id)?.value;
function handleSelect(value) {
router.push(`/console/${value}`);
@ -46,7 +46,7 @@ export default function TestConsole() {
<script
async
defer
data-website-id={website.websiteUuid}
data-website-id={website.id}
src={`${basePath}/umami.js`}
data-cache="true"
/>
@ -104,13 +104,13 @@ export default function TestConsole() {
<div className="row">
<div className="col-12">
<WebsiteChart
websiteId={website.websiteUuid}
websiteId={website.id}
title={website.name}
domain={website.domain}
showLink
/>
<PageHeader>Events</PageHeader>
<EventsChart websiteId={website.websiteUuid} />
<EventsChart websiteId={website.id} />
</div>
</div>
</>

8
components/pages/WebsiteList.js
View file

@ -27,7 +27,7 @@ export default function WebsiteList({ websites, showCharts, limit }) {
const ordered = useMemo(
() =>
websites
.map(website => ({ ...website, order: websiteOrder.indexOf(website.websiteUuid) || 0 }))
.map(website => ({ ...website, order: websiteOrder.indexOf(website.id) || 0 }))
.sort(firstBy('order')),
[websites, websiteOrder],
);
@ -46,11 +46,11 @@ export default function WebsiteList({ websites, showCharts, limit }) {
return (
<div>
{ordered.map(({ websiteUuid, name, domain }, index) =>
{ordered.map(({ id, name, domain }, index) =>
index < limit ? (
<div key={websiteUuid} className={styles.website}>
<div key={id} className={styles.website}>
<WebsiteChart
websiteId={websiteUuid}
websiteId={id}
title={name}
domain={domain}
showChart={showCharts}

54
components/settings/AccountSettings.js → components/settings/UserSettings.js
View file

@ -8,7 +8,7 @@ import Icon from 'components/common/Icon';
import Table from 'components/common/Table';
import Modal from 'components/common/Modal';
import Toast from 'components/common/Toast';
import AccountEditForm from 'components/forms/AccountEditForm';
import UserEditForm from 'components/forms/UserEditForm';
import ButtonLayout from 'components/layout/ButtonLayout';
import DeleteForm from 'components/forms/DeleteForm';
import useFetch from 'hooks/useFetch';
@ -17,21 +17,21 @@ import Plus from 'assets/plus.svg';
import Trash from 'assets/trash.svg';
import Check from 'assets/check.svg';
import LinkIcon from 'assets/external-link.svg';
import styles from './AccountSettings.module.css';
import styles from './UserSettings.module.css';
export default function AccountSettings() {
const [addAccount, setAddAccount] = useState();
const [editAccount, setEditAccount] = useState();
const [deleteAccount, setDeleteAccount] = useState();
export default function UserSettings() {
const [addUser, setAddUser] = useState();
const [editUser, setEditUser] = useState();
const [deleteUser, setDeleteUser] = useState();
const [saved, setSaved] = useState(0);
const [message, setMessage] = useState();
const { data } = useFetch(`/accounts`, {}, [saved]);
const { data } = useFetch(`/users`, {}, [saved]);
const Checkmark = ({ isAdmin }) => (isAdmin ? <Icon icon={<Check />} size="medium" /> : null);
const DashboardLink = row => {
return (
<Link href={`/dashboard/${row.accountUuid}/${row.username}`}>
<Link href={`/dashboard/${row.id}/${row.username}`}>
<a>
<Icon icon={<LinkIcon />} />
</a>
@ -41,11 +41,11 @@ export default function AccountSettings() {
const Buttons = row => (
<ButtonLayout align="right">
<Button icon={<Pen />} size="small" onClick={() => setEditAccount(row)}>
<Button icon={<Pen />} size="small" onClick={() => setEditUser(row)}>
<FormattedMessage id="label.edit" defaultMessage="Edit" />
</Button>
{!row.isAdmin && (
<Button icon={<Trash />} size="small" onClick={() => setDeleteAccount(row)}>
<Button icon={<Trash />} size="small" onClick={() => setDeleteUser(row)}>
<FormattedMessage id="label.delete" defaultMessage="Delete" />
</Button>
)}
@ -84,9 +84,9 @@ export default function AccountSettings() {
}
function handleClose() {
setEditAccount(null);
setAddAccount(null);
setDeleteAccount(null);
setEditUser(null);
setAddUser(null);
setDeleteUser(null);
}
if (!data) {
@ -97,33 +97,31 @@ export default function AccountSettings() {
<>
<PageHeader>
<div>
<FormattedMessage id="label.accounts" defaultMessage="Accounts" />
<FormattedMessage id="label.users" defaultMessage="Users" />
</div>
<Button icon={<Plus />} size="small" onClick={() => setAddAccount(true)}>
<FormattedMessage id="label.add-account" defaultMessage="Add account" />
<Button icon={<Plus />} size="small" onClick={() => setAddUser(true)}>
<FormattedMessage id="label.add-user" defaultMessage="Add user" />
</Button>
</PageHeader>
<Table columns={columns} rows={data} />
{editAccount && (
<Modal title={<FormattedMessage id="label.edit-account" defaultMessage="Edit account" />}>
<AccountEditForm
values={{ ...editAccount, password: '' }}
{editUser && (
<Modal title={<FormattedMessage id="label.edit-user" defaultMessage="Edit user" />}>
<UserEditForm
values={{ ...editUser, password: '' }}
onSave={handleSave}
onClose={handleClose}
/>
</Modal>
)}
{addAccount && (
<Modal title={<FormattedMessage id="label.add-account" defaultMessage="Add account" />}>
<AccountEditForm onSave={handleSave} onClose={handleClose} />
{addUser && (
<Modal title={<FormattedMessage id="label.add-user" defaultMessage="Add user" />}>
<UserEditForm onSave={handleSave} onClose={handleClose} />
</Modal>
)}
{deleteAccount && (
<Modal
title={<FormattedMessage id="label.delete-account" defaultMessage="Delete account" />}
>
{deleteUser && (
<Modal title={<FormattedMessage id="label.delete-user" defaultMessage="Delete user" />}>
<DeleteForm
values={{ type: 'accounts', id: deleteAccount.id, name: deleteAccount.username }}
values={{ type: 'users', id: deleteUser.id, name: deleteUser.username }}
onSave={handleSave}
onClose={handleClose}
/>

0
components/settings/AccountSettings.module.css → components/settings/UserSettings.module.css
View file

30
components/settings/WebsiteSettings.js
View file

@ -46,7 +46,7 @@ export default function WebsiteSettings() {
icon={<LinkIcon />}
size="small"
tooltip={<FormattedMessage id="message.get-share-url" defaultMessage="Get share URL" />}
tooltipId={`button-share-${row.websiteUuid}`}
tooltipId={`button-share-${row.id}`}
onClick={() => setShowUrl(row)}
/>
)}
@ -56,46 +56,42 @@ export default function WebsiteSettings() {
tooltip={
<FormattedMessage id="message.get-tracking-code" defaultMessage="Get tracking code" />
}
tooltipId={`button-code-${row.websiteUuid}`}
tooltipId={`button-code-${row.id}`}
onClick={() => setShowCode(row)}
/>
<Button
icon={<Pen />}
size="small"
tooltip={<FormattedMessage id="label.edit" defaultMessage="Edit" />}
tooltipId={`button-edit-${row.websiteUuid}`}
tooltipId={`button-edit-${row.id}`}
onClick={() => setEditWebsite(row)}
/>
<Button
icon={<Reset />}
size="small"
tooltip={<FormattedMessage id="label.reset" defaultMessage="Reset" />}
tooltipId={`button-reset-${row.websiteUuid}`}
tooltipId={`button-reset-${row.id}`}
onClick={() => setResetWebsite(row)}
/>
<Button
icon={<Trash />}
size="small"
tooltip={<FormattedMessage id="label.delete" defaultMessage="Delete" />}
tooltipId={`button-delete-${row.websiteUuid}`}
tooltipId={`button-delete-${row.id}`}
onClick={() => setDeleteWebsite(row)}
/>
</ButtonLayout>
);
const DetailsLink = ({ websiteUuid, name, domain }) => (
<Link
className={styles.detailLink}
href="/websites/[...id]"
as={`/websites/${websiteUuid}/${name}`}
>
const DetailsLink = ({ id, name, domain }) => (
<Link className={styles.detailLink} href="/websites/[...id]" as={`/websites/${id}/${name}`}>
<Favicon domain={domain} />
<OverflowText tooltipId={`${websiteUuid}-name`}>{name}</OverflowText>
<OverflowText tooltipId={`${id}-name`}>{name}</OverflowText>
</Link>
);
const Domain = ({ domain, websiteUuid }) => (
<OverflowText tooltipId={`${websiteUuid}-domain`}>{domain}</OverflowText>
const Domain = ({ domain, id }) => (
<OverflowText tooltipId={`${id}-domain`}>{domain}</OverflowText>
);
const adminColumns = [
@ -112,7 +108,7 @@ export default function WebsiteSettings() {
render: Domain,
},
{
key: 'account',
key: 'user',
label: <FormattedMessage id="label.owner" defaultMessage="Owner" />,
className: 'col-12 col-lg-4 col-xl-1',
},
@ -203,7 +199,7 @@ export default function WebsiteSettings() {
title={<FormattedMessage id="label.reset-website" defaultMessage="Reset statistics" />}
>
<ResetForm
values={{ type: 'websites', id: resetWebsite.websiteUuid, name: resetWebsite.name }}
values={{ type: 'websites', id: resetWebsite.id, name: resetWebsite.name }}
onSave={handleSave}
onClose={handleClose}
/>
@ -214,7 +210,7 @@ export default function WebsiteSettings() {
title={<FormattedMessage id="label.delete-website" defaultMessage="Delete website" />}
>
<DeleteForm
values={{ type: 'websites', id: deleteWebsite.websiteUuid, name: deleteWebsite.name }}
values={{ type: 'websites', id: deleteWebsite.id, name: deleteWebsite.name }}
onSave={handleSave}
onClose={handleClose}
/>