diff --git a/src/app/(main)/App.tsx b/src/app/(main)/App.tsx index 7700639d..ec08838d 100644 --- a/src/app/(main)/App.tsx +++ b/src/app/(main)/App.tsx @@ -16,7 +16,7 @@ export function App({ children }) { } if (error) { - window.location.href = '/login'; + window.location.href = `${process.env.basePath || ''}/login`; return null; } diff --git a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx index e9e3e6a0..ea0edde1 100644 --- a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx +++ b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx @@ -1,11 +1,24 @@ -import { DataTable, DataColumn, Row, Text, DataTableProps, IconLabel } from '@umami/react-zen'; +import { + DataTable, + DataColumn, + Row, + Text, + DataTableProps, + IconLabel, + Button, + Dialog, + DialogTrigger, + Icon, + Popover, +} from '@umami/react-zen'; import { useFormat, useMessages, useNavigation } from '@/components/hooks'; import { Avatar } from '@/components/common/Avatar'; import Link from 'next/link'; -import { Eye } from '@/components/icons'; +import { Eye, FileText } from '@/components/icons'; import { Lightning } from '@/components/svg'; import { DateDistance } from '@/components/common/DateDistance'; import { TypeIcon } from '@/components/common/TypeIcon'; +import { EventData } from '@/components/metrics/EventData'; export function EventsTable(props: DataTableProps) { const { formatMessage, labels } = useMessages(); @@ -32,6 +45,7 @@ export function EventsTable(props: DataTableProps) { > {row.eventName || row.urlPath} + {row.hasData > 0 && } ); }} @@ -72,3 +86,22 @@ export function EventsTable(props: DataTableProps) { ); } + +const PropertiesButton = props => { + return ( + + + + + + + + + ); +}; diff --git a/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx b/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx index 9ae19bf8..3dec340f 100644 --- a/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx +++ b/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx @@ -9,6 +9,7 @@ import { useCountryNames, useLocale, useMessages, + useMobile, useNavigation, useTimezone, useWebsite, @@ -40,6 +41,7 @@ export function RealtimeLog({ data }: { data: any }) { const { countryNames } = useCountryNames(locale); const [filter, setFilter] = useState(TYPE_ALL); const { updateParams } = useNavigation(); + const { isPhone } = useMobile(); const buttons = [ { @@ -123,12 +125,18 @@ export function RealtimeLog({ data }: { data: any }) { const row = logs[index]; return ( - - - - {getTime(row)} + + + + + + + {getTime(row)} + - {getDetail(row)} + + {getDetail(row)} + ); @@ -168,10 +176,22 @@ export function RealtimeLog({ data }: { data: any }) { return ( {formatMessage(labels.activity)} - - - - + {isPhone ? ( + <> + + + + + + + + ) : ( + + + + + )} + {logs?.length === 0 && } {logs?.length > 0 && ( diff --git a/src/app/(main)/websites/[websiteId]/realtime/RealtimePage.tsx b/src/app/(main)/websites/[websiteId]/realtime/RealtimePage.tsx index 7f9ab608..0f9fa358 100644 --- a/src/app/(main)/websites/[websiteId]/realtime/RealtimePage.tsx +++ b/src/app/(main)/websites/[websiteId]/realtime/RealtimePage.tsx @@ -6,7 +6,7 @@ import { PageBody } from '@/components/common/PageBody'; import { Panel } from '@/components/common/Panel'; import { RealtimeChart } from '@/components/metrics/RealtimeChart'; import { WorldMap } from '@/components/metrics/WorldMap'; -import { useRealtimeQuery } from '@/components/hooks'; +import { useMobile, useRealtimeQuery } from '@/components/hooks'; import { RealtimeLog } from './RealtimeLog'; import { RealtimeHeader } from './RealtimeHeader'; import { RealtimePaths } from './RealtimePaths'; @@ -16,6 +16,7 @@ import { percentFilter } from '@/lib/filters'; export function RealtimePage({ websiteId }: { websiteId: string }) { const { data, isLoading, error } = useRealtimeQuery(websiteId); + const { isMobile } = useMobile(); if (isLoading || error) { return ; @@ -48,7 +49,7 @@ export function RealtimePage({ websiteId }: { websiteId: string }) { - + diff --git a/src/app/(main)/websites/[websiteId]/sessions/SessionActivity.tsx b/src/app/(main)/websites/[websiteId]/sessions/SessionActivity.tsx index b9f34e48..7bcf1b76 100644 --- a/src/app/(main)/websites/[websiteId]/sessions/SessionActivity.tsx +++ b/src/app/(main)/websites/[websiteId]/sessions/SessionActivity.tsx @@ -14,7 +14,7 @@ import { import { LoadingPanel } from '@/components/common/LoadingPanel'; import { Eye, FileText } from '@/components/icons'; import { Lightning } from '@/components/svg'; -import { useMessages, useSessionActivityQuery, useTimezone } from '@/components/hooks'; +import { useMessages, useMobile, useSessionActivityQuery, useTimezone } from '@/components/hooks'; import { EventData } from '@/components/metrics/EventData'; export function SessionActivity({ @@ -36,6 +36,7 @@ export function SessionActivity({ startDate, endDate, ); + const { isMobile } = useMobile(); let lastDay = null; return ( @@ -50,16 +51,16 @@ export function SessionActivity({ {showHeader && {formatTimezoneDate(createdAt, 'PPPP')}} - {formatTimezoneDate(createdAt, 'pp')} + {formatTimezoneDate(createdAt, 'pp')} {eventName ? : } - + {eventName ? formatMessage(labels.triggeredEvent) : formatMessage(labels.viewedPage)} - + {eventName || urlPath} {hasData > 0 && } diff --git a/src/app/logout/LogoutPage.tsx b/src/app/logout/LogoutPage.tsx index bd471796..d66d62a9 100644 --- a/src/app/logout/LogoutPage.tsx +++ b/src/app/logout/LogoutPage.tsx @@ -13,7 +13,7 @@ export function LogoutPage() { async function logout() { await post('/auth/logout'); - window.location.href = '/login'; + window.location.href = `${process.env.basePath || ''}/login`; } removeClientAuthToken(); diff --git a/src/components/metrics/ListTable.tsx b/src/components/metrics/ListTable.tsx index 303556b0..e76e0174 100644 --- a/src/components/metrics/ListTable.tsx +++ b/src/components/metrics/ListTable.tsx @@ -57,7 +57,7 @@ export function ListTable({ showPercentage={showPercentage} change={renderChange ? renderChange(row, index) : null} currency={currency} - isMobile={isPhone} + isPhone={isPhone} /> ); }; @@ -101,7 +101,7 @@ const AnimatedRow = ({ animate, showPercentage = true, currency, - isMobile, + isPhone, }) => { const props = useSpring({ width: percent, @@ -120,7 +120,7 @@ const AnimatedRow = ({ gap > - + {label} diff --git a/src/queries/sql/events/getEventData.ts b/src/queries/sql/events/getEventData.ts index 42dc2040..269258a8 100644 --- a/src/queries/sql/events/getEventData.ts +++ b/src/queries/sql/events/getEventData.ts @@ -19,20 +19,20 @@ async function relationalQuery(websiteId: string, eventId: string) { return rawQuery( ` - select website_id as "websiteId", - session_id as "sessionId", - event_id as "eventId", - url_path as "urlPath", - event_name as "eventName", - data_key as "dataKey", - string_value as "stringValue", - number_value as "numberValue", - date_value as "dateValue", - data_type as "dataType", - created_at as "createdAt" + select event_data.website_id as "websiteId", + event_data.website_event_id as "eventId", + website_event.event_name as "eventName", + event_data.data_key as "dataKey", + event_data.string_value as "stringValue", + event_data.number_value as "numberValue", + event_data.date_value as "dateValue", + event_data.data_type as "dataType", + event_data.created_at as "createdAt" from event_data - website_id = {{websiteId::uuid}} - event_id = {{eventId::uuid}} + join website_event on website_event.event_id = event_data.website_event_id + and website_event.website_id = {{websiteId::uuid}} + where event_data.website_id = {{websiteId::uuid}} + and event_data.website_event_id = {{eventId::uuid}} `, { websiteId, eventId }, FUNCTION_NAME, @@ -45,9 +45,7 @@ async function clickhouseQuery(websiteId: string, eventId: string): Promise result?.[0]); - total.average = total.count > 0 ? total.sum / total.count : 0; + total.average = total.count > 0 ? Number(total.sum) / Number(total.count) : 0; return { chart, country, total }; } diff --git a/src/queries/sql/sessions/getSessionActivity.ts b/src/queries/sql/sessions/getSessionActivity.ts index 360db530..3dd4fa9d 100644 --- a/src/queries/sql/sessions/getSessionActivity.ts +++ b/src/queries/sql/sessions/getSessionActivity.ts @@ -29,10 +29,10 @@ async function relationalQuery(websiteId: string, sessionId: string, filters: Qu event_type as "eventType", event_name as "eventName", visit_id as "visitId", - event_id IN (select event_id + event_id IN (select website_event_id from event_data where website_id = {{websiteId::uuid}} - and session_id = {{sessionId::uuid}}) AS "hasData" + and created_at between {{startDate}} and {{endDate}}) AS "hasData" from website_event where website_id = {{websiteId::uuid}} and session_id = {{sessionId::uuid}}