45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
'use client';
|
|
import Avatar from 'components/common/Avatar';
|
|
import { LoadingPanel } from 'components/common/LoadingPanel';
|
|
import { useWebsiteSession } from 'components/hooks';
|
|
import WebsiteHeader from '../../WebsiteHeader';
|
|
import { SessionActivity } from './SessionActivity';
|
|
import { SessionData } from './SessionData';
|
|
import styles from './SessionDetailsPage.module.css';
|
|
import SessionInfo from './SessionInfo';
|
|
import { SessionStats } from './SessionStats';
|
|
|
|
export default function SessionDetailsPage({
|
|
websiteId,
|
|
sessionId,
|
|
}: {
|
|
websiteId: string;
|
|
sessionId: string;
|
|
}) {
|
|
const { data, ...query } = useWebsiteSession(websiteId, sessionId);
|
|
|
|
return (
|
|
<LoadingPanel {...query} loadingIcon="spinner" data={data}>
|
|
<WebsiteHeader websiteId={websiteId} />
|
|
<div className={styles.page}>
|
|
<div className={styles.sidebar}>
|
|
<Avatar seed={data?.id} />
|
|
<SessionInfo data={data} />
|
|
</div>
|
|
<div className={styles.content}>
|
|
<SessionStats data={data} />
|
|
<SessionActivity
|
|
websiteId={websiteId}
|
|
sessionId={sessionId}
|
|
startDate={data?.firstAt}
|
|
endDate={data?.lastAt}
|
|
/>
|
|
</div>
|
|
<div className={styles.data}>
|
|
<SessionData websiteId={websiteId} sessionId={sessionId} />
|
|
</div>
|
|
</div>
|
|
</LoadingPanel>
|
|
);
|
|
}
|