Fix build errors, remove active users link on share page.
This commit is contained in:
@@ -31,7 +31,7 @@ export function WebsiteHeader({
|
||||
titleHref={allowLink ? renderUrl(`/websites/${website.id}`, false) : undefined}
|
||||
>
|
||||
<Row alignItems="center" gap="6" wrap="wrap">
|
||||
<ActiveUsers websiteId={website.id} />
|
||||
<ActiveUsers websiteId={website.id} allowLink={allowLink} />
|
||||
|
||||
{showActions && (
|
||||
<LinkButton href={renderUrl(`/websites/${website.id}/settings`, false)}>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { Column, Heading, Row, SearchField, Text } from '@umami/react-zen';
|
||||
import Link from '@/components/common/Link';
|
||||
import { useMemo, useState } from 'react';
|
||||
import { FixedSizeList } from 'react-window';
|
||||
import { List, type RowComponentProps } from 'react-window';
|
||||
import { SessionModal } from '@/app/(main)/websites/[websiteId]/sessions/SessionModal';
|
||||
import { useFormat } from '@/components//hooks/useFormat';
|
||||
import { Avatar } from '@/components/common/Avatar';
|
||||
@@ -121,7 +121,7 @@ export function RealtimeLog({ data }: { data: any }) {
|
||||
}
|
||||
};
|
||||
|
||||
const TableRow = ({ index, style }) => {
|
||||
const TableRow = ({ index, style, logs }: RowComponentProps<{ logs: any[] }>) => {
|
||||
const row = logs[index];
|
||||
return (
|
||||
<Row alignItems="center" style={style} gap>
|
||||
@@ -195,9 +195,14 @@ export function RealtimeLog({ data }: { data: any }) {
|
||||
<Column>
|
||||
{logs?.length === 0 && <Empty />}
|
||||
{logs?.length > 0 && (
|
||||
<FixedSizeList width="100%" height={500} itemCount={logs.length} itemSize={50}>
|
||||
{TableRow}
|
||||
</FixedSizeList>
|
||||
<List
|
||||
rowComponent={TableRow}
|
||||
rowCount={logs.length}
|
||||
rowHeight={50}
|
||||
rowProps={{ logs }}
|
||||
defaultHeight={500}
|
||||
style={{ width: '100%' }}
|
||||
/>
|
||||
)}
|
||||
</Column>
|
||||
<SessionModal websiteId={website.id} />
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import type { ReactQueryOptions } from '@/lib/types';
|
||||
import { useApi } from '../useApi';
|
||||
|
||||
export function useActyiveUsersQuery(websiteId: string, options?: ReactQueryOptions) {
|
||||
export function useActiveUsersQuery(websiteId: string, options?: ReactQueryOptions) {
|
||||
const { get, useQuery } = useApi();
|
||||
return useQuery<any>({
|
||||
queryKey: ['websites:active', websiteId],
|
||||
|
||||
@@ -7,17 +7,19 @@ export function ActiveUsers({
|
||||
websiteId,
|
||||
value,
|
||||
refetchInterval = 60000,
|
||||
allowLink = true,
|
||||
}: {
|
||||
websiteId: string;
|
||||
value?: number;
|
||||
refetchInterval?: number;
|
||||
allowLink?: boolean;
|
||||
}) {
|
||||
const { t, labels } = useMessages();
|
||||
const { data } = useActiveUsersQuery(websiteId, { refetchInterval });
|
||||
|
||||
const count = useMemo(() => {
|
||||
if (websiteId) {
|
||||
return data?.visitors || 0;
|
||||
return data?.visitors || 10;
|
||||
}
|
||||
|
||||
return value !== undefined ? value : 0;
|
||||
@@ -27,13 +29,17 @@ export function ActiveUsers({
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Link href={`/websites/${websiteId}/realtime`}>
|
||||
<StatusLight variant="success">
|
||||
<Text size="sm" weight="medium">
|
||||
{count} {t(labels.online)}
|
||||
</Text>
|
||||
</StatusLight>
|
||||
</Link>
|
||||
const content = (
|
||||
<StatusLight variant="success">
|
||||
<Text size="sm" weight="medium">
|
||||
{count} {t(labels.online)}
|
||||
</Text>
|
||||
</StatusLight>
|
||||
);
|
||||
|
||||
if (!allowLink) {
|
||||
return content;
|
||||
}
|
||||
|
||||
return <Link href={`/websites/${websiteId}/realtime`}>{content}</Link>;
|
||||
}
|
||||
Reference in New Issue
Block a user