watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2025-12-06 01:18:00 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

add close button on session modal
Some checks are pending
Create docker images (cloud) / Build, push, and deploy (push) Waiting to run
Details
Node.js CI / build (postgresql, 18.18, 10) (push) Waiting to run
Details

Browse source
This commit is contained in:
Francis Cao 2025-10-21 21:59:20 -07:00
parent 2e1a5b444a
commit f5bf148b2b
2 changed files with 35 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/app/(main)/websites/[websiteId]/sessions/SessionModal.tsx
View file

@ -29,9 +29,11 @@ export function SessionModal({ websiteId, ...props }: SessionModalProps) {
>
<Column height="100%" maxWidth="1320px" style={{ margin: '0 auto' }}>
<Dialog variant="sheet">
<Column padding="6">
<SessionProfile websiteId={websiteId} sessionId={session} />
</Column>
{({ close }) => (
<Column padding="6">
<SessionProfile websiteId={websiteId} sessionId={session} onClose={() => close()} />
</Column>
)}
</Dialog>
</Column>
</Modal>

32
src/app/(main)/websites/[websiteId]/sessions/SessionProfile.tsx
View file

@ -1,4 +1,14 @@
import { TextField, Row, Column, Tabs, TabList, Tab, TabPanel } from '@umami/react-zen';
import {
TextField,
Row,
Column,
Tabs,
TabList,
Tab,
TabPanel,
Button,
Icon,
} from '@umami/react-zen';
import { Avatar } from '@/components/common/Avatar';
import { LoadingPanel } from '@/components/common/LoadingPanel';
import { useMessages, useWebsiteSessionQuery } from '@/components/hooks';
@ -6,8 +16,17 @@ import { SessionActivity } from './SessionActivity';
import { SessionData } from './SessionData';
import { SessionInfo } from './SessionInfo';
import { SessionStats } from './SessionStats';
import { X } from 'lucide-react';
export function SessionProfile({ websiteId, sessionId }: { websiteId: string; sessionId: string }) {
export function SessionProfile({
websiteId,
sessionId,
onClose,
}: {
websiteId: string;
sessionId: string;
onClose?: () => void;
}) {
const { data, isLoading, error } = useWebsiteSessionQuery(websiteId, sessionId);
const { formatMessage, labels } = useMessages();
@ -21,6 +40,15 @@ export function SessionProfile({ websiteId, sessionId }: { websiteId: string; se
>
{data && (
<Column gap>
{onClose && (
<Row justifyContent="flex-end">
<Button onPress={onClose} variant="quiet">
<Icon>
<X />
</Icon>
</Button>
</Row>
)}
<Column gap="6">
<Row justifyContent="center" alignItems="center" gap="6">
<Avatar seed={data?.id} size={128} />