Merge branch 'dev' into analytics

pull/1915/head
Mike Cao 2023-04-04 00:36:11 -07:00
commit dea4b4766c
2 changed files with 39 additions and 24 deletions

View File

@ -49,15 +49,13 @@ export default function TestConsole() {
return null; return null;
} }
const websiteId = id?.[0]; const [websiteId] = id || [];
const website = data.find(({ id }) => websiteId === id); const website = data.find(({ id }) => websiteId === id);
return ( return (
<Page loading={isLoading} error={error}> <Page loading={isLoading} error={error}>
<Head> <Head>
<title> <title>{website ? `${website.name} | Umami Console` : 'Umami Console'}</title>
{router.query.id[2] ? `Umami Console page ${router.query.id[2]}` : 'Umami Console Select'}
</title>
</Head> </Head>
<PageHeader title="Test console"> <PageHeader title="Test console">
<WebsiteSelect websiteId={website?.id} onSelect={handleChange} /> <WebsiteSelect websiteId={website?.id} onSelect={handleChange} />
@ -74,10 +72,10 @@ export default function TestConsole() {
<Column xs="4"> <Column xs="4">
<div className={styles.header}>Page links</div> <div className={styles.header}>Page links</div>
<div> <div>
<Link href={`/console/${websiteId}/page/1/?q=123`}>page one</Link> <Link href={`/console/${websiteId}/page/1/?q=abc`}>page one</Link>
</div> </div>
<div> <div>
<Link href={`/console/${websiteId}/page/2/?q=456 `}>page two</Link> <Link href={`/console/${websiteId}/page/2/?q=123 `}>page two</Link>
</div> </div>
<div> <div>
<a href="https://www.google.com" data-umami-event="external-link-direct"> <a href="https://www.google.com" data-umami-event="external-link-direct">

View File

@ -28,6 +28,7 @@
const endpoint = `${root}/api/send`; const endpoint = `${root}/api/send`;
const screen = `${width}x${height}`; const screen = `${width}x${height}`;
const eventRegex = /data-umami-event-([\w-_]+)/; const eventRegex = /data-umami-event-([\w-_]+)/;
const eventNameAttribute = _data + 'umami-event';
/* Helper functions */ /* Helper functions */
@ -90,15 +91,14 @@
}; };
const handleClick = () => { const handleClick = () => {
const callback = e => { const trackElement = el => {
const t = e.target; const attr = el.getAttribute.bind(el);
const attr = t.getAttribute.bind(t); const eventName = attr(eventNameAttribute);
const eventName = attr(_data + 'umami-event');
if (eventName) { if (eventName) {
const eventData = {}; const eventData = {};
t.getAttributeNames().forEach(name => { el.getAttributeNames().forEach(name => {
const match = name.match(eventRegex); const match = name.match(eventRegex);
if (match) { if (match) {
@ -106,23 +106,40 @@
} }
}); });
if (t.tagName === 'A') { return track(eventName, { data: eventData });
const href = attr('href'); }
const target = attr('target'); return Promise.resolve();
};
if ( const callback = e => {
href && const el = e.target;
target !== '_blank' && const anchor =
!(e.ctrlKey || e.shiftKey || e.metaKey || (e.button && e.button === 1)) el.tagName === 'A'
) { ? el
: el.parentElement && el.parentElement.tagName === 'A'
? el.parentElement
: null;
if (anchor) {
const { href, target } = anchor;
const external =
target === '_blank' ||
e.ctrlKey ||
e.shiftKey ||
e.metaKey ||
(e.button && e.button === 1);
const eventName = anchor.getAttribute(eventNameAttribute);
if (eventName && href) {
if (!external) {
e.preventDefault(); e.preventDefault();
return track(eventName, { data: eventData }).then(() => {
location.href = href;
});
} }
return trackElement(anchor).then(() => {
if (!external) location.href = href;
});
} }
} else {
track(eventName, { data: eventData }); trackElement(el);
} }
}; };