Fixed UTM calculation.

This commit is contained in:
Mike Cao 2024-03-20 19:52:07 -07:00
parent 96af798d42
commit fb3536c352
4 changed files with 22 additions and 25 deletions

View File

@ -1,5 +1,5 @@
.title { .title {
font-size: 18px; font-size: 24px;
line-height: 36px; line-height: 36px;
font-weight: 700; font-weight: 700;
} }

View File

@ -26,8 +26,8 @@ export default function UTMView() {
return ( return (
<div> <div>
{UTM_PARAMS.map(key => { {UTM_PARAMS.map(param => {
const items = toArray(data[key]); const items = toArray(data[param]);
const chartData = { const chartData = {
labels: items.map(({ name }) => name), labels: items.map(({ name }) => name),
datasets: [ datasets: [
@ -42,9 +42,9 @@ export default function UTMView() {
}, 0); }, 0);
return ( return (
<div key={key} className={styles.row}> <div key={param} className={styles.row}>
<div> <div>
<div className={styles.title}>{key}</div> <div className={styles.title}>{param.replace(/^utm_/, '')}</div>
<ListTable <ListTable
metric={formatMessage(labels.views)} metric={formatMessage(labels.views)}
data={items.map(({ name, value }) => ({ data={items.map(({ name, value }) => ({

View File

@ -228,7 +228,7 @@ export const URL_LENGTH = 500;
export const PAGE_TITLE_LENGTH = 500; export const PAGE_TITLE_LENGTH = 500;
export const EVENT_NAME_LENGTH = 50; export const EVENT_NAME_LENGTH = 50;
export const UTM_PARAMS = ['source', 'medium', 'campaign', 'term', 'content']; export const UTM_PARAMS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content'];
export const DESKTOP_OS = [ export const DESKTOP_OS = [
'BeOS', 'BeOS',

View File

@ -92,29 +92,26 @@ async function clickhouseQuery(
).then(result => parseParameters(result as any[])); ).then(result => parseParameters(result as any[]));
} }
function parseParameters(result: any[]) { function parseParameters(data: any[]) {
return Object.values(result).reduce((data, { url_query, num }) => { return data.reduce((obj, { url_query, num }) => {
const params = url_query.split('&').map(n => decodeURIComponent(n)); try {
const searchParams = new URLSearchParams(url_query);
for (const param of params) { for (const [key, value] of searchParams) {
const [key, value] = param.split('='); if (key.match(/^utm_(\w+)$/)) {
if (!obj[key]) {
const match = key.match(/^utm_(\w+)$/); obj[key] = { [value]: +num };
} else if (!obj[key][value]) {
if (match) { obj[key][value] = +num;
const group = match[1]; } else {
const name = decodeURIComponent(value); obj[key][value] += +num;
}
if (!data[group]) {
data[group] = { [name]: +num };
} else if (!data[group][name]) {
data[group][name] = +num;
} else {
data[group][name] += +num;
} }
} }
} catch {
// Ignore
} }
return data; return obj;
}, {}); }, {});
} }