Fixed event search. Removed session time from profile.

This commit is contained in:
Mike Cao 2024-08-11 23:14:02 -07:00
parent 1e52eeb0f0
commit 78728b8706
5 changed files with 37 additions and 40 deletions

View File

@ -10,8 +10,9 @@ export function SessionData({ websiteId, sessionId }: { websiteId: string; sessi
const { data, ...query } = useSessionData(websiteId, sessionId); const { data, ...query } = useSessionData(websiteId, sessionId);
return ( return (
<LoadingPanel className={styles.data} {...query} data={data}> <>
<div className={styles.header}>{formatMessage(labels.properties)}</div> <div className={styles.header}>{formatMessage(labels.properties)}</div>
<LoadingPanel className={styles.data} {...query} data={data}>
{!data?.length && <Empty className={styles.empty} />} {!data?.length && <Empty className={styles.empty} />}
{data?.map(({ dataKey, dataType, stringValue }) => { {data?.map(({ dataKey, dataType, stringValue }) => {
return ( return (
@ -27,5 +28,6 @@ export function SessionData({ websiteId, sessionId }: { websiteId: string; sessi
); );
})} })}
</LoadingPanel> </LoadingPanel>
</>
); );
} }

View File

@ -1,31 +1,15 @@
import { useMessages } from 'components/hooks'; import { useMessages } from 'components/hooks';
import MetricCard from 'components/metrics/MetricCard'; import MetricCard from 'components/metrics/MetricCard';
import MetricsBar from 'components/metrics/MetricsBar'; import MetricsBar from 'components/metrics/MetricsBar';
import { formatShortTime } from 'lib/format';
export function SessionStats({ data }) { export function SessionStats({ data }) {
const { formatMessage, labels } = useMessages(); const { formatMessage, labels } = useMessages();
const duration = (new Date(data?.lastAt).getTime() - new Date(data?.firstAt).getTime()) / 1000;
let dateFormat;
if (duration > 86400) {
dateFormat = ['d', 'm'];
} else if (duration > 3600) {
dateFormat = ['h', 'm'];
} else {
dateFormat = ['m', 's'];
}
return ( return (
<MetricsBar isFetched={true}> <MetricsBar isFetched={true}>
<MetricCard label={formatMessage(labels.visits)} value={data?.visits} /> <MetricCard label={formatMessage(labels.visits)} value={data?.visits} />
<MetricCard label={formatMessage(labels.views)} value={data?.views} /> <MetricCard label={formatMessage(labels.views)} value={data?.views} />
<MetricCard label={formatMessage(labels.events)} value={data?.events} /> <MetricCard label={formatMessage(labels.events)} value={data?.events} />
<MetricCard
label={formatMessage(labels.sessionDuration)}
value={duration}
formatValue={n => `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), dateFormat, ' ')}`}
/>
</MetricsBar> </MetricsBar>
); );
} }

View File

@ -141,7 +141,6 @@ export const labels = defineMessages({
bounceRate: { id: 'label.bounce-rate', defaultMessage: 'Bounce rate' }, bounceRate: { id: 'label.bounce-rate', defaultMessage: 'Bounce rate' },
viewsPerVisit: { id: 'label.views-per-visit', defaultMessage: 'Views per visit' }, viewsPerVisit: { id: 'label.views-per-visit', defaultMessage: 'Views per visit' },
visitDuration: { id: 'label.visit-duration', defaultMessage: 'Visit duration' }, visitDuration: { id: 'label.visit-duration', defaultMessage: 'Visit duration' },
sessionDuration: { id: 'label.session-duration', defaultMessage: 'Session duration' },
desktop: { id: 'label.desktop', defaultMessage: 'Desktop' }, desktop: { id: 'label.desktop', defaultMessage: 'Desktop' },
laptop: { id: 'label.laptop', defaultMessage: 'Laptop' }, laptop: { id: 'label.laptop', defaultMessage: 'Laptop' },
tablet: { id: 'label.tablet', defaultMessage: 'Tablet' }, tablet: { id: 'label.tablet', defaultMessage: 'Tablet' },

View File

@ -14,10 +14,12 @@ export function getWebsiteEvents(
async function relationalQuery(websiteId: string, filters: QueryFilters, pageParams?: PageParams) { async function relationalQuery(websiteId: string, filters: QueryFilters, pageParams?: PageParams) {
const { pagedQuery } = prisma; const { pagedQuery } = prisma;
const { query } = pageParams;
const where = { const where = {
...filters, ...filters,
id: websiteId, id: websiteId,
...prisma.getSearchParameters(query, [{ eventName: 'contains' }, { urlPath: 'contains' }]),
}; };
return pagedQuery('website_event', { where }, pageParams); return pagedQuery('website_event', { where }, pageParams);
@ -47,7 +49,12 @@ async function clickhouseQuery(websiteId: string, filters: QueryFilters, pagePar
where website_id = {websiteId:UUID} where website_id = {websiteId:UUID}
${dateQuery} ${dateQuery}
${filterQuery} ${filterQuery}
${query ? `and (positionCaseInsensitive(event_name, {query:String}) > 0)` : ''} ${
query
? `and (positionCaseInsensitive(event_name, {query:String}) > 0
or positionCaseInsensitive(url_path, {query:String}) > 0)`
: ''
}
order by created_at desc order by created_at desc
`, `,
{ ...params, query }, { ...params, query },

View File

@ -14,12 +14,10 @@ export async function getWebsiteSessions(
async function relationalQuery(websiteId: string, filters: QueryFilters, pageParams: PageParams) { async function relationalQuery(websiteId: string, filters: QueryFilters, pageParams: PageParams) {
const { pagedQuery } = prisma; const { pagedQuery } = prisma;
const { query } = pageParams;
const where = { const where = {
...filters, ...filters,
id: websiteId, id: websiteId,
...prisma.getSearchParameters(query, [{ eventName: 'contains' }, { urlPath: 'contains' }]),
}; };
return pagedQuery('session', { where }, pageParams); return pagedQuery('session', { where }, pageParams);
@ -28,7 +26,6 @@ async function relationalQuery(websiteId: string, filters: QueryFilters, pagePar
async function clickhouseQuery(websiteId: string, filters: QueryFilters, pageParams?: PageParams) { async function clickhouseQuery(websiteId: string, filters: QueryFilters, pageParams?: PageParams) {
const { pagedQuery, parseFilters } = clickhouse; const { pagedQuery, parseFilters } = clickhouse;
const { params, dateQuery, filterQuery } = await parseFilters(websiteId, filters); const { params, dateQuery, filterQuery } = await parseFilters(websiteId, filters);
const { query } = pageParams;
return pagedQuery( return pagedQuery(
` `
@ -52,14 +49,22 @@ async function clickhouseQuery(websiteId: string, filters: QueryFilters, pagePar
where website_id = {websiteId:UUID} where website_id = {websiteId:UUID}
${dateQuery} ${dateQuery}
${filterQuery} ${filterQuery}
${query ? `and (positionCaseInsensitive(event_name, {query:String}) > 0)` : ''}
group by session_id, website_id, hostname, browser, os, device, screen, language, country, subdivision1, city group by session_id, website_id, hostname, browser, os, device, screen, language, country, subdivision1, city
order by lastAt desc order by lastAt desc
`, `,
params, params,
pageParams, pageParams,
).then((result: any) => ({ ).then((result: any) => {
return {
...result, ...result,
visits: Number(result.visits), data: result.data.map((row: any) => {
})); return {
...row,
createdAt: row.firstAt,
visits: Number(row.visits),
views: Number(row.views),
};
}),
};
});
} }