mirror of
https://github.com/umami-software/umami.git
synced 2026-02-04 04:37:11 +01:00
Compare commits
No commits in common. "abfb78bb980ea078d6110738c24bf315221be4fb" and "a37de757a098ed7a64525246216b0f30b2c8139c" have entirely different histories.
abfb78bb98
...
a37de757a0
52 changed files with 855 additions and 809 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -31,8 +31,6 @@ pm2.yml
|
|||
*.log
|
||||
.vscode
|
||||
.tool-versions
|
||||
.claude
|
||||
nul
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
},
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "next dev -p 3002 --turbo",
|
||||
"dev": "next dev -p 3001 --turbo",
|
||||
"build": "npm-run-all check-env build-db check-db build-tracker build-geo build-app",
|
||||
"start": "next start",
|
||||
"build-docker": "npm-run-all build-db build-tracker build-geo build-app",
|
||||
|
|
@ -102,7 +102,7 @@
|
|||
"kafkajs": "^2.1.0",
|
||||
"lucide-react": "^0.543.0",
|
||||
"maxmind": "^5.0.0",
|
||||
"next": "^15.5.10",
|
||||
"next": "^15.5.9",
|
||||
"node-fetch": "^3.2.8",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"papaparse": "^5.5.3",
|
||||
|
|
@ -164,7 +164,7 @@
|
|||
"stylelint-config-css-modules": "^4.5.1",
|
||||
"stylelint-config-prettier": "^9.0.3",
|
||||
"stylelint-config-recommended": "^14.0.0",
|
||||
"tar": "^7.5.7",
|
||||
"tar": "^7.5.4",
|
||||
"ts-jest": "^29.4.6",
|
||||
"ts-node": "^10.9.1",
|
||||
"tsup": "^8.5.0",
|
||||
|
|
|
|||
617
pnpm-lock.yaml
generated
617
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load diff
|
|
@ -42,7 +42,7 @@ export function MobileNav() {
|
|||
{({ close }) => {
|
||||
return (
|
||||
<>
|
||||
<NavMenu padding="3" onItemClick={close} border="bottom" width="100%">
|
||||
<NavMenu padding="3" onItemClick={close} border="bottom">
|
||||
<NavButton />
|
||||
{links.map(link => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ export function PixelsTable({ showActions, ...props }: PixelsTableProps) {
|
|||
const { formatMessage, labels } = useMessages();
|
||||
const { renderUrl } = useNavigation();
|
||||
const { getSlugUrl } = useSlug('pixel');
|
||||
console.log(showActions);
|
||||
|
||||
return (
|
||||
<DataTable {...props}>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Box, Column, Dialog, Grid, Icon, ProgressBar, Row, Text } from '@umami/react-zen';
|
||||
import { LoadingPanel } from '@/components/common/LoadingPanel';
|
||||
import { useMessages, useNavigation, useResultQuery } from '@/components/hooks';
|
||||
import { useMessages, useResultQuery } from '@/components/hooks';
|
||||
import { File, User } from '@/components/icons';
|
||||
import { ReportEditButton } from '@/components/input/ReportEditButton';
|
||||
import { ChangeLabel } from '@/components/metrics/ChangeLabel';
|
||||
|
|
@ -20,8 +20,6 @@ type FunnelResult = {
|
|||
|
||||
export function Funnel({ id, name, type, parameters, websiteId }) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { pathname } = useNavigation();
|
||||
const isSharePage = pathname.includes('/share/');
|
||||
const { data, error, isLoading } = useResultQuery(type, {
|
||||
websiteId,
|
||||
...parameters,
|
||||
|
|
@ -38,13 +36,13 @@ export function Funnel({ id, name, type, parameters, websiteId }) {
|
|||
</Text>
|
||||
</Row>
|
||||
</Column>
|
||||
{!isSharePage && (
|
||||
<Column>
|
||||
<ReportEditButton id={id} name={name} type={type}>
|
||||
{({ close }) => {
|
||||
return (
|
||||
<Dialog
|
||||
title={formatMessage(labels.funnel)}
|
||||
variant="modal"
|
||||
style={{ minHeight: 300, minWidth: 400 }}
|
||||
>
|
||||
<FunnelEditForm id={id} websiteId={websiteId} onClose={close} />
|
||||
|
|
@ -53,7 +51,6 @@ export function Funnel({ id, name, type, parameters, websiteId }) {
|
|||
}}
|
||||
</ReportEditButton>
|
||||
</Column>
|
||||
)}
|
||||
</Grid>
|
||||
{data?.map(
|
||||
(
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { WebsiteControls } from '@/app/(main)/websites/[websiteId]/WebsiteContro
|
|||
import { LoadingPanel } from '@/components/common/LoadingPanel';
|
||||
import { Panel } from '@/components/common/Panel';
|
||||
import { SectionHeader } from '@/components/common/SectionHeader';
|
||||
import { useDateRange, useNavigation, useReportsQuery } from '@/components/hooks';
|
||||
import { useDateRange, useReportsQuery } from '@/components/hooks';
|
||||
import { Funnel } from './Funnel';
|
||||
import { FunnelAddButton } from './FunnelAddButton';
|
||||
|
||||
|
|
@ -13,17 +13,13 @@ export function FunnelsPage({ websiteId }: { websiteId: string }) {
|
|||
const {
|
||||
dateRange: { startDate, endDate },
|
||||
} = useDateRange();
|
||||
const { pathname } = useNavigation();
|
||||
const isSharePage = pathname.includes('/share/');
|
||||
|
||||
return (
|
||||
<Column gap>
|
||||
<WebsiteControls websiteId={websiteId} />
|
||||
{!isSharePage && (
|
||||
<SectionHeader>
|
||||
<FunnelAddButton websiteId={websiteId} />
|
||||
</SectionHeader>
|
||||
)}
|
||||
<LoadingPanel data={data} isLoading={isLoading} error={error}>
|
||||
{data && (
|
||||
<Grid gap>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Column, Dialog, Grid, Icon, ProgressBar, Row, Text } from '@umami/react-zen';
|
||||
import { LoadingPanel } from '@/components/common/LoadingPanel';
|
||||
import { useMessages, useNavigation, useResultQuery } from '@/components/hooks';
|
||||
import { useMessages, useResultQuery } from '@/components/hooks';
|
||||
import { File, User } from '@/components/icons';
|
||||
import { ReportEditButton } from '@/components/input/ReportEditButton';
|
||||
import { Lightning } from '@/components/svg';
|
||||
|
|
@ -25,8 +25,6 @@ export type GoalData = { num: number; total: number };
|
|||
|
||||
export function Goal({ id, name, type, parameters, websiteId, startDate, endDate }: GoalProps) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { pathname } = useNavigation();
|
||||
const isSharePage = pathname.includes('/share/');
|
||||
const { data, error, isLoading, isFetching } = useResultQuery<GoalData>(type, {
|
||||
websiteId,
|
||||
startDate,
|
||||
|
|
@ -47,7 +45,6 @@ export function Goal({ id, name, type, parameters, websiteId, startDate, endDate
|
|||
</Text>
|
||||
</Row>
|
||||
</Column>
|
||||
{!isSharePage && (
|
||||
<Column>
|
||||
<ReportEditButton id={id} name={name} type={type}>
|
||||
{({ close }) => {
|
||||
|
|
@ -63,7 +60,6 @@ export function Goal({ id, name, type, parameters, websiteId, startDate, endDate
|
|||
}}
|
||||
</ReportEditButton>
|
||||
</Column>
|
||||
)}
|
||||
</Grid>
|
||||
<Row alignItems="center" justifyContent="space-between" gap>
|
||||
<Text color="muted">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { WebsiteControls } from '@/app/(main)/websites/[websiteId]/WebsiteContro
|
|||
import { LoadingPanel } from '@/components/common/LoadingPanel';
|
||||
import { Panel } from '@/components/common/Panel';
|
||||
import { SectionHeader } from '@/components/common/SectionHeader';
|
||||
import { useDateRange, useNavigation, useReportsQuery } from '@/components/hooks';
|
||||
import { useDateRange, useReportsQuery } from '@/components/hooks';
|
||||
import { Goal } from './Goal';
|
||||
import { GoalAddButton } from './GoalAddButton';
|
||||
|
||||
|
|
@ -13,17 +13,13 @@ export function GoalsPage({ websiteId }: { websiteId: string }) {
|
|||
const {
|
||||
dateRange: { startDate, endDate },
|
||||
} = useDateRange();
|
||||
const { pathname } = useNavigation();
|
||||
const isSharePage = pathname.includes('/share/');
|
||||
|
||||
return (
|
||||
<Column gap>
|
||||
<WebsiteControls websiteId={websiteId} />
|
||||
{!isSharePage && (
|
||||
<SectionHeader>
|
||||
<GoalAddButton websiteId={websiteId} />
|
||||
</SectionHeader>
|
||||
)}
|
||||
<LoadingPanel data={data} isLoading={isLoading} error={error}>
|
||||
{data && (
|
||||
<Grid columns={{ xs: '1fr', md: '1fr 1fr' }} gap>
|
||||
|
|
|
|||
|
|
@ -6,13 +6,7 @@ import { useMessages, useNavigation, useWebsite } from '@/components/hooks';
|
|||
import { Edit } from '@/components/icons';
|
||||
import { ActiveUsers } from '@/components/metrics/ActiveUsers';
|
||||
|
||||
export function WebsiteHeader({
|
||||
showActions,
|
||||
allowLink = true,
|
||||
}: {
|
||||
showActions?: boolean;
|
||||
allowLink?: boolean;
|
||||
}) {
|
||||
export function WebsiteHeader({ showActions }: { showActions?: boolean }) {
|
||||
const website = useWebsite();
|
||||
const { renderUrl, pathname } = useNavigation();
|
||||
const isSettings = pathname.endsWith('/settings');
|
||||
|
|
@ -27,7 +21,7 @@ export function WebsiteHeader({
|
|||
<PageHeader
|
||||
title={website.name}
|
||||
icon={<Favicon domain={website.domain} />}
|
||||
titleHref={allowLink ? renderUrl(`/websites/${website.id}`, false) : undefined}
|
||||
titleHref={renderUrl(`/websites/${website.id}`, false)}
|
||||
>
|
||||
<Row alignItems="center" gap="6" wrap="wrap">
|
||||
<ActiveUsers websiteId={website.id} />
|
||||
|
|
|
|||
|
|
@ -9,10 +9,11 @@ import { WebsiteNav } from './WebsiteNav';
|
|||
export function WebsiteLayout({ websiteId, children }: { websiteId: string; children: ReactNode }) {
|
||||
return (
|
||||
<WebsiteProvider websiteId={websiteId}>
|
||||
<Grid columns={{ xs: '1fr', lg: 'auto 1fr' }} width="100%">
|
||||
<Grid columns={{ xs: '1fr', lg: 'auto 1fr' }} width="100%" height="100%">
|
||||
<Column
|
||||
display={{ xs: 'none', lg: 'flex' }}
|
||||
width="240px"
|
||||
height="100%"
|
||||
border="right"
|
||||
backgroundColor
|
||||
marginRight="2"
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
import { Grid, Heading, Row, Tab, TabList, TabPanel, Tabs } from '@umami/react-zen';
|
||||
import { GridRow } from '@/components/common/GridRow';
|
||||
import { Panel } from '@/components/common/Panel';
|
||||
import { useMessages } from '@/components/hooks';
|
||||
import { useMessages, useNavigation } from '@/components/hooks';
|
||||
import { EventsChart } from '@/components/metrics/EventsChart';
|
||||
import { MetricsTable } from '@/components/metrics/MetricsTable';
|
||||
import { WeeklyTraffic } from '@/components/metrics/WeeklyTraffic';
|
||||
import { WorldMap } from '@/components/metrics/WorldMap';
|
||||
|
||||
export function WebsitePanels({ websiteId }: { websiteId: string }) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { pathname } = useNavigation();
|
||||
const tableProps = {
|
||||
websiteId,
|
||||
limit: 10,
|
||||
|
|
@ -16,6 +18,7 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
|
|||
metric: formatMessage(labels.visitors),
|
||||
};
|
||||
const rowProps = { minHeight: '570px' };
|
||||
const isSharePage = pathname.includes('/share/');
|
||||
|
||||
return (
|
||||
<Grid gap="3">
|
||||
|
|
@ -113,6 +116,25 @@ export function WebsitePanels({ websiteId }: { websiteId: string }) {
|
|||
<WeeklyTraffic websiteId={websiteId} />
|
||||
</Panel>
|
||||
</GridRow>
|
||||
{isSharePage && (
|
||||
<GridRow layout="two-one" {...rowProps}>
|
||||
<Panel>
|
||||
<Heading size="2">{formatMessage(labels.events)}</Heading>
|
||||
<Row border="bottom" marginBottom="4" />
|
||||
<MetricsTable
|
||||
websiteId={websiteId}
|
||||
type="event"
|
||||
title={formatMessage(labels.event)}
|
||||
metric={formatMessage(labels.count)}
|
||||
limit={15}
|
||||
filterLink={false}
|
||||
/>
|
||||
</Panel>
|
||||
<Panel gridColumn={{ xs: 'span 1', md: 'span 2' }}>
|
||||
<EventsChart websiteId={websiteId} />
|
||||
</Panel>
|
||||
</GridRow>
|
||||
)}
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,81 @@
|
|||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Column,
|
||||
Form,
|
||||
FormField,
|
||||
FormSubmitButton,
|
||||
Row,
|
||||
Text,
|
||||
} from '@umami/react-zen';
|
||||
import { useState } from 'react';
|
||||
import { useApi, useMessages, useModified } from '@/components/hooks';
|
||||
import { SHARE_NAV_ITEMS } from './constants';
|
||||
|
||||
export interface ShareCreateFormProps {
|
||||
websiteId: string;
|
||||
onSave?: () => void;
|
||||
onClose?: () => void;
|
||||
}
|
||||
|
||||
export function ShareCreateForm({ websiteId, onSave, onClose }: ShareCreateFormProps) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { post } = useApi();
|
||||
const { touch } = useModified();
|
||||
const [isPending, setIsPending] = useState(false);
|
||||
|
||||
// Build default values - only overview and events enabled by default
|
||||
const defaultValues: Record<string, boolean> = {};
|
||||
SHARE_NAV_ITEMS.forEach(section => {
|
||||
section.items.forEach(item => {
|
||||
defaultValues[item.id] = item.id === 'overview' || item.id === 'events';
|
||||
});
|
||||
});
|
||||
|
||||
const handleSubmit = async (data: any) => {
|
||||
setIsPending(true);
|
||||
try {
|
||||
const parameters: Record<string, boolean> = {};
|
||||
SHARE_NAV_ITEMS.forEach(section => {
|
||||
section.items.forEach(item => {
|
||||
parameters[item.id] = data[item.id] ?? false;
|
||||
});
|
||||
});
|
||||
await post(`/websites/${websiteId}/shares`, { parameters });
|
||||
touch('shares');
|
||||
onSave?.();
|
||||
onClose?.();
|
||||
} finally {
|
||||
setIsPending(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Form onSubmit={handleSubmit} defaultValues={defaultValues}>
|
||||
<Column gap="3">
|
||||
{SHARE_NAV_ITEMS.map(section => (
|
||||
<Column key={section.section} gap="1">
|
||||
<Text size="2" weight="bold">
|
||||
{formatMessage((labels as any)[section.section])}
|
||||
</Text>
|
||||
<Column gap="1">
|
||||
{section.items.map(item => (
|
||||
<FormField key={item.id} name={item.id}>
|
||||
<Checkbox>{formatMessage((labels as any)[item.label])}</Checkbox>
|
||||
</FormField>
|
||||
))}
|
||||
</Column>
|
||||
</Column>
|
||||
))}
|
||||
<Row justifyContent="flex-end" paddingTop="3" gap="3">
|
||||
{onClose && (
|
||||
<Button isDisabled={isPending} onPress={onClose}>
|
||||
{formatMessage(labels.cancel)}
|
||||
</Button>
|
||||
)}
|
||||
<FormSubmitButton isDisabled={isPending}>{formatMessage(labels.save)}</FormSubmitButton>
|
||||
</Row>
|
||||
</Column>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
|
@ -5,7 +5,6 @@ import {
|
|||
Form,
|
||||
FormField,
|
||||
FormSubmitButton,
|
||||
Grid,
|
||||
Label,
|
||||
Loading,
|
||||
Row,
|
||||
|
|
@ -14,30 +13,25 @@ import {
|
|||
} from '@umami/react-zen';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useApi, useConfig, useMessages, useModified } from '@/components/hooks';
|
||||
import { useUpdateQuery } from '@/components/hooks/queries/useUpdateQuery';
|
||||
import { SHARE_NAV_ITEMS } from './constants';
|
||||
|
||||
export function ShareEditForm({
|
||||
shareId,
|
||||
websiteId,
|
||||
onSave,
|
||||
onClose,
|
||||
}: {
|
||||
shareId?: string;
|
||||
websiteId?: string;
|
||||
shareId: string;
|
||||
onSave?: () => void;
|
||||
onClose?: () => void;
|
||||
}) {
|
||||
const { formatMessage, labels, getErrorMessage } = useMessages();
|
||||
const { formatMessage, labels, messages, getErrorMessage } = useMessages();
|
||||
const { mutateAsync, error, isPending, touch, toast } = useUpdateQuery(`/share/id/${shareId}`);
|
||||
const { cloudMode } = useConfig();
|
||||
const { get, post } = useApi();
|
||||
const { touch } = useModified();
|
||||
const { get } = useApi();
|
||||
const { modified } = useModified('shares');
|
||||
const [share, setShare] = useState<any>(null);
|
||||
const [isLoading, setIsLoading] = useState(!!shareId);
|
||||
const [isPending, setIsPending] = useState(false);
|
||||
const [error, setError] = useState<any>(null);
|
||||
|
||||
const isEditing = !!shareId;
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
const getUrl = (slug: string) => {
|
||||
if (cloudMode) {
|
||||
|
|
@ -47,8 +41,6 @@ export function ShareEditForm({
|
|||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!shareId) return;
|
||||
|
||||
const loadShare = async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
|
|
@ -69,35 +61,27 @@ export function ShareEditForm({
|
|||
});
|
||||
});
|
||||
|
||||
setIsPending(true);
|
||||
setError(null);
|
||||
|
||||
try {
|
||||
if (isEditing) {
|
||||
await post(`/share/id/${shareId}`, { name: data.name, slug: share.slug, parameters });
|
||||
} else {
|
||||
await post(`/websites/${websiteId}/shares`, { name: data.name, parameters });
|
||||
}
|
||||
await mutateAsync(
|
||||
{ slug: share.slug, parameters },
|
||||
{
|
||||
onSuccess: async () => {
|
||||
toast(formatMessage(messages.saved));
|
||||
touch('shares');
|
||||
onSave?.();
|
||||
onClose?.();
|
||||
} catch (e) {
|
||||
setError(e);
|
||||
} finally {
|
||||
setIsPending(false);
|
||||
}
|
||||
},
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return <Loading placement="absolute" />;
|
||||
}
|
||||
|
||||
const url = isEditing ? getUrl(share?.slug || '') : null;
|
||||
const url = getUrl(share?.slug || '');
|
||||
|
||||
// Build default values from share parameters
|
||||
const defaultValues: Record<string, any> = {
|
||||
name: share?.name || '',
|
||||
};
|
||||
const defaultValues: Record<string, boolean> = {};
|
||||
SHARE_NAV_ITEMS.forEach(section => {
|
||||
section.items.forEach(item => {
|
||||
const defaultSelected = item.id === 'overview' || item.id === 'events';
|
||||
|
|
@ -105,33 +89,15 @@ export function ShareEditForm({
|
|||
});
|
||||
});
|
||||
|
||||
// Get all item ids for validation
|
||||
const allItemIds = SHARE_NAV_ITEMS.flatMap(section => section.items.map(item => item.id));
|
||||
|
||||
return (
|
||||
<Form onSubmit={handleSubmit} error={getErrorMessage(error)} defaultValues={defaultValues}>
|
||||
{({ watch }) => {
|
||||
const values = watch();
|
||||
const hasSelection = allItemIds.some(id => values[id]);
|
||||
|
||||
return (
|
||||
<Column gap="6">
|
||||
{url && (
|
||||
<Column gap="3">
|
||||
<Column>
|
||||
<Label>{formatMessage(labels.shareUrl)}</Label>
|
||||
<TextField value={url} isReadOnly allowCopy />
|
||||
</Column>
|
||||
)}
|
||||
<FormField
|
||||
label={formatMessage(labels.name)}
|
||||
name="name"
|
||||
rules={{ required: formatMessage(labels.required) }}
|
||||
>
|
||||
<TextField autoComplete="off" autoFocus={!isEditing} />
|
||||
</FormField>
|
||||
<Grid columns="repeat(auto-fit, minmax(150px, 1fr))" gap="3">
|
||||
{SHARE_NAV_ITEMS.map(section => (
|
||||
<Column key={section.section} gap="3">
|
||||
<Column key={section.section} gap="1">
|
||||
<Text weight="bold">{formatMessage((labels as any)[section.section])}</Text>
|
||||
<Column gap="1">
|
||||
{section.items.map(item => (
|
||||
|
|
@ -142,23 +108,15 @@ export function ShareEditForm({
|
|||
</Column>
|
||||
</Column>
|
||||
))}
|
||||
</Grid>
|
||||
<Row justifyContent="flex-end" paddingTop="3" gap="3">
|
||||
{onClose && (
|
||||
<Button isDisabled={isPending} onPress={onClose}>
|
||||
{formatMessage(labels.cancel)}
|
||||
</Button>
|
||||
)}
|
||||
<FormSubmitButton
|
||||
variant="primary"
|
||||
isDisabled={isPending || !hasSelection || !values.name}
|
||||
>
|
||||
{formatMessage(labels.save)}
|
||||
</FormSubmitButton>
|
||||
<FormSubmitButton variant="primary">{formatMessage(labels.save)}</FormSubmitButton>
|
||||
</Row>
|
||||
</Column>
|
||||
);
|
||||
}}
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,25 +1,24 @@
|
|||
import { DataColumn, DataTable, type DataTableProps, Row } from '@umami/react-zen';
|
||||
import { DateDistance } from '@/components/common/DateDistance';
|
||||
import { ExternalLink } from '@/components/common/ExternalLink';
|
||||
import { useConfig, useMessages, useMobile } from '@/components/hooks';
|
||||
import { useConfig, useMessages } from '@/components/hooks';
|
||||
import { ShareDeleteButton } from './ShareDeleteButton';
|
||||
import { ShareEditButton } from './ShareEditButton';
|
||||
|
||||
export function SharesTable(props: DataTableProps) {
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { cloudMode } = useConfig();
|
||||
const { isMobile } = useMobile();
|
||||
|
||||
const getUrl = (slug: string) => {
|
||||
return `${cloudMode ? process.env.cloudUrl : window?.location.origin}${process.env.basePath || ''}/share/${slug}`;
|
||||
if (cloudMode) {
|
||||
return `${process.env.cloudUrl}/share/${slug}`;
|
||||
}
|
||||
return `${window?.location.origin}${process.env.basePath || ''}/share/${slug}`;
|
||||
};
|
||||
|
||||
return (
|
||||
<DataTable {...props}>
|
||||
<DataColumn id="name" label={formatMessage(labels.name)}>
|
||||
{({ name }: any) => name}
|
||||
</DataColumn>
|
||||
<DataColumn id="slug" label={formatMessage(labels.shareUrl)} width="2fr">
|
||||
<DataColumn id="slug" label={formatMessage(labels.shareUrl)}>
|
||||
{({ slug }: any) => {
|
||||
const url = getUrl(slug);
|
||||
return (
|
||||
|
|
@ -29,11 +28,9 @@ export function SharesTable(props: DataTableProps) {
|
|||
);
|
||||
}}
|
||||
</DataColumn>
|
||||
{!isMobile && (
|
||||
<DataColumn id="created" label={formatMessage(labels.created)}>
|
||||
<DataColumn id="created" label={formatMessage(labels.created)} width="200px">
|
||||
{(row: any) => <DateDistance date={new Date(row.createdAt)} />}
|
||||
</DataColumn>
|
||||
)}
|
||||
<DataColumn id="action" align="end" width="100px">
|
||||
{({ id, slug }: any) => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import { Column, Heading, Row, Text } from '@umami/react-zen';
|
|||
import { Plus } from 'lucide-react';
|
||||
import { useMessages, useWebsiteSharesQuery } from '@/components/hooks';
|
||||
import { DialogButton } from '@/components/input/DialogButton';
|
||||
import { ShareEditForm } from './ShareEditForm';
|
||||
import { ShareCreateForm } from './ShareCreateForm';
|
||||
import { SharesTable } from './SharesTable';
|
||||
|
||||
export interface WebsiteShareFormProps {
|
||||
|
|
@ -11,7 +11,7 @@ export interface WebsiteShareFormProps {
|
|||
|
||||
export function WebsiteShareForm({ websiteId }: WebsiteShareFormProps) {
|
||||
const { formatMessage, labels, messages } = useMessages();
|
||||
const { data } = useWebsiteSharesQuery({ websiteId });
|
||||
const { data, isLoading } = useWebsiteSharesQuery({ websiteId });
|
||||
|
||||
const shares = data?.data || [];
|
||||
const hasShares = shares.length > 0;
|
||||
|
|
@ -25,9 +25,9 @@ export function WebsiteShareForm({ websiteId }: WebsiteShareFormProps) {
|
|||
label={formatMessage(labels.add)}
|
||||
title={formatMessage(labels.share)}
|
||||
variant="primary"
|
||||
width="600px"
|
||||
width="400px"
|
||||
>
|
||||
{({ close }) => <ShareEditForm websiteId={websiteId} onClose={close} />}
|
||||
{({ close }) => <ShareCreateForm websiteId={websiteId} onClose={close} />}
|
||||
</DialogButton>
|
||||
</Row>
|
||||
{hasShares ? (
|
||||
|
|
|
|||
|
|
@ -1,47 +1,7 @@
|
|||
import { ROLES } from '@/lib/constants';
|
||||
import { secret } from '@/lib/crypto';
|
||||
import { createToken } from '@/lib/jwt';
|
||||
import prisma from '@/lib/prisma';
|
||||
import redis from '@/lib/redis';
|
||||
import { json, notFound } from '@/lib/response';
|
||||
import type { WhiteLabel } from '@/lib/types';
|
||||
import { getShareByCode, getWebsite } from '@/queries/prisma';
|
||||
|
||||
async function getAccountId(website: { userId?: string; teamId?: string }): Promise<string | null> {
|
||||
if (website.userId) {
|
||||
return website.userId;
|
||||
}
|
||||
|
||||
if (website.teamId) {
|
||||
const teamOwner = await prisma.client.teamUser.findFirst({
|
||||
where: {
|
||||
teamId: website.teamId,
|
||||
role: ROLES.teamOwner,
|
||||
},
|
||||
select: {
|
||||
userId: true,
|
||||
},
|
||||
});
|
||||
|
||||
return teamOwner?.userId || null;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
async function getWhiteLabel(accountId: string): Promise<WhiteLabel | null> {
|
||||
if (!redis.enabled) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const data = await redis.client.get(`white-label:${accountId}`);
|
||||
|
||||
if (data) {
|
||||
return data as WhiteLabel;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
import { getShareByCode } from '@/queries/prisma';
|
||||
|
||||
export async function GET(_request: Request, { params }: { params: Promise<{ slug: string }> }) {
|
||||
const { slug } = await params;
|
||||
|
|
@ -52,25 +12,12 @@ export async function GET(_request: Request, { params }: { params: Promise<{ slu
|
|||
return notFound();
|
||||
}
|
||||
|
||||
const website = await getWebsite(share.entityId);
|
||||
|
||||
const data: Record<string, any> = {
|
||||
const data = {
|
||||
shareId: share.id,
|
||||
websiteId: share.entityId,
|
||||
parameters: share.parameters,
|
||||
};
|
||||
const token = createToken(data, secret());
|
||||
|
||||
data.token = createToken(data, secret());
|
||||
|
||||
const accountId = await getAccountId(website);
|
||||
|
||||
if (accountId) {
|
||||
const whiteLabel = await getWhiteLabel(accountId);
|
||||
|
||||
if (whiteLabel) {
|
||||
data.whiteLabel = whiteLabel;
|
||||
}
|
||||
}
|
||||
|
||||
return json(data);
|
||||
return json({ ...data, token });
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ export async function GET(request: Request, { params }: { params: Promise<{ shar
|
|||
|
||||
export async function POST(request: Request, { params }: { params: Promise<{ shareId: string }> }) {
|
||||
const schema = z.object({
|
||||
name: z.string().max(200),
|
||||
slug: z.string().max(100),
|
||||
parameters: anyObjectParam,
|
||||
});
|
||||
|
|
@ -37,7 +36,7 @@ export async function POST(request: Request, { params }: { params: Promise<{ sha
|
|||
}
|
||||
|
||||
const { shareId } = await params;
|
||||
const { name, slug, parameters } = body;
|
||||
const { slug, parameters } = body;
|
||||
|
||||
const share = await getShare(shareId);
|
||||
|
||||
|
|
@ -50,7 +49,6 @@ export async function POST(request: Request, { params }: { params: Promise<{ sha
|
|||
}
|
||||
|
||||
const result = await updateShare(shareId, {
|
||||
name,
|
||||
slug,
|
||||
parameters,
|
||||
} as any);
|
||||
|
|
|
|||
|
|
@ -44,7 +44,6 @@ export async function POST(
|
|||
{ params }: { params: Promise<{ websiteId: string }> },
|
||||
) {
|
||||
const schema = z.object({
|
||||
name: z.string().max(200),
|
||||
parameters: anyObjectParam.optional(),
|
||||
});
|
||||
|
||||
|
|
@ -55,8 +54,7 @@ export async function POST(
|
|||
}
|
||||
|
||||
const { websiteId } = await params;
|
||||
const { name, parameters } = body;
|
||||
const shareParameters = parameters ?? {};
|
||||
const { parameters = {} } = body;
|
||||
|
||||
if (!(await canUpdateWebsite(auth, websiteId))) {
|
||||
return unauthorized();
|
||||
|
|
@ -68,9 +66,8 @@ export async function POST(
|
|||
id: uuid(),
|
||||
entityId: websiteId,
|
||||
shareType: ENTITY_TYPE.website,
|
||||
name,
|
||||
slug,
|
||||
parameters: shareParameters,
|
||||
parameters,
|
||||
});
|
||||
|
||||
return json(share);
|
||||
|
|
|
|||
|
|
@ -1,77 +0,0 @@
|
|||
'use client';
|
||||
import { Loading } from '@umami/react-zen';
|
||||
import { usePathname, useRouter } from 'next/navigation';
|
||||
import { createContext, type ReactNode, useEffect } from 'react';
|
||||
import { useShareTokenQuery } from '@/components/hooks';
|
||||
import type { WhiteLabel } from '@/lib/types';
|
||||
|
||||
export interface ShareData {
|
||||
shareId: string;
|
||||
slug: string;
|
||||
websiteId: string;
|
||||
parameters: any;
|
||||
token: string;
|
||||
whiteLabel?: WhiteLabel;
|
||||
}
|
||||
|
||||
export const ShareContext = createContext<ShareData>(null);
|
||||
|
||||
const ALL_SECTION_IDS = [
|
||||
'overview',
|
||||
'events',
|
||||
'sessions',
|
||||
'realtime',
|
||||
'compare',
|
||||
'breakdown',
|
||||
'goals',
|
||||
'funnels',
|
||||
'journeys',
|
||||
'retention',
|
||||
'utm',
|
||||
'revenue',
|
||||
'attribution',
|
||||
];
|
||||
|
||||
function getSharePath(pathname: string) {
|
||||
const segments = pathname.split('/');
|
||||
const firstSegment = segments[3];
|
||||
|
||||
// If first segment looks like a domain name, skip it
|
||||
if (firstSegment?.includes('.')) {
|
||||
return segments[4];
|
||||
}
|
||||
|
||||
return firstSegment;
|
||||
}
|
||||
|
||||
export function ShareProvider({ slug, children }: { slug: string; children: ReactNode }) {
|
||||
const { share, isLoading, isFetching } = useShareTokenQuery(slug);
|
||||
const router = useRouter();
|
||||
const pathname = usePathname();
|
||||
const path = getSharePath(pathname);
|
||||
|
||||
const allowedSections = share?.parameters
|
||||
? ALL_SECTION_IDS.filter(id => share.parameters[id] !== false)
|
||||
: [];
|
||||
|
||||
const shouldRedirect =
|
||||
allowedSections.length === 1 &&
|
||||
allowedSections[0] !== 'overview' &&
|
||||
(path === undefined || path === '' || path === 'overview');
|
||||
|
||||
useEffect(() => {
|
||||
if (shouldRedirect) {
|
||||
router.replace(`/share/${slug}/${allowedSections[0]}`);
|
||||
}
|
||||
}, [shouldRedirect, slug, allowedSections, router]);
|
||||
|
||||
if (isFetching && isLoading) {
|
||||
return <Loading placement="absolute" />;
|
||||
}
|
||||
|
||||
if (!share || shouldRedirect) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return <ShareContext.Provider value={{ ...share, slug }}>{children}</ShareContext.Provider>;
|
||||
}
|
||||
12
src/app/share/[...shareId]/Footer.tsx
Normal file
12
src/app/share/[...shareId]/Footer.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { Row, Text } from '@umami/react-zen';
|
||||
import { CURRENT_VERSION, HOMEPAGE_URL } from '@/lib/constants';
|
||||
|
||||
export function Footer() {
|
||||
return (
|
||||
<Row as="footer" paddingY="6" justifyContent="flex-end">
|
||||
<a href={HOMEPAGE_URL} target="_blank">
|
||||
<Text weight="bold">umami</Text> {`v${CURRENT_VERSION}`}
|
||||
</a>
|
||||
</Row>
|
||||
);
|
||||
}
|
||||
24
src/app/share/[...shareId]/Header.tsx
Normal file
24
src/app/share/[...shareId]/Header.tsx
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
import { Icon, Row, Text, ThemeButton } from '@umami/react-zen';
|
||||
import { LanguageButton } from '@/components/input/LanguageButton';
|
||||
import { PreferencesButton } from '@/components/input/PreferencesButton';
|
||||
import { Logo } from '@/components/svg';
|
||||
|
||||
export function Header() {
|
||||
return (
|
||||
<Row as="header" justifyContent="space-between" alignItems="center" paddingY="3">
|
||||
<a href="https://umami.is" target="_blank" rel="noopener">
|
||||
<Row alignItems="center" gap>
|
||||
<Icon>
|
||||
<Logo />
|
||||
</Icon>
|
||||
<Text weight="bold">umami</Text>
|
||||
</Row>
|
||||
</a>
|
||||
<Row alignItems="center" gap>
|
||||
<ThemeButton />
|
||||
<LanguageButton />
|
||||
<PreferencesButton />
|
||||
</Row>
|
||||
</Row>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,30 +1,23 @@
|
|||
import { Button, Column, Icon, Row, Text, ThemeButton } from '@umami/react-zen';
|
||||
'use client';
|
||||
import { Column } from '@umami/react-zen';
|
||||
import { SideMenu } from '@/components/common/SideMenu';
|
||||
import { useMessages, useNavigation, useShare } from '@/components/hooks';
|
||||
import { AlignEndHorizontal, Clock, Eye, PanelLeft, Sheet, Tag, User } from '@/components/icons';
|
||||
import { LanguageButton } from '@/components/input/LanguageButton';
|
||||
import { PreferencesButton } from '@/components/input/PreferencesButton';
|
||||
import { Funnel, Lightning, Logo, Magnet, Money, Network, Path, Target } from '@/components/svg';
|
||||
import { useMessages, useNavigation } from '@/components/hooks';
|
||||
import { AlignEndHorizontal, Clock, Eye, Sheet, Tag, User } from '@/components/icons';
|
||||
import { Funnel, Lightning, Magnet, Money, Network, Path, Target } from '@/components/svg';
|
||||
|
||||
export function ShareNav({
|
||||
collapsed,
|
||||
onCollapse,
|
||||
shareId,
|
||||
parameters,
|
||||
onItemClick,
|
||||
}: {
|
||||
collapsed?: boolean;
|
||||
onCollapse?: (collapsed: boolean) => void;
|
||||
shareId: string;
|
||||
parameters: Record<string, boolean>;
|
||||
onItemClick?: () => void;
|
||||
}) {
|
||||
const share = useShare();
|
||||
const { formatMessage, labels } = useMessages();
|
||||
const { pathname } = useNavigation();
|
||||
const { slug, parameters, whiteLabel } = share;
|
||||
|
||||
const logoUrl = whiteLabel?.url || 'https://umami.is';
|
||||
const logoName = whiteLabel?.name || 'umami';
|
||||
const logoImage = whiteLabel?.image;
|
||||
|
||||
const renderPath = (path: string) => `/share/${slug}${path}`;
|
||||
const renderPath = (path: string) => `/share/${shareId}${path}`;
|
||||
|
||||
const allItems = [
|
||||
{
|
||||
|
|
@ -137,43 +130,8 @@ export function ShareNav({
|
|||
.flatMap(e => e.items)
|
||||
.find(({ path }) => path && pathname.endsWith(path.split('?')[0]))?.id;
|
||||
|
||||
const isMobile = !!onItemClick;
|
||||
|
||||
return (
|
||||
<Column
|
||||
position={isMobile ? undefined : 'fixed'}
|
||||
padding="3"
|
||||
width={isMobile ? '100%' : collapsed ? '60px' : '240px'}
|
||||
maxHeight="100dvh"
|
||||
height="100dvh"
|
||||
border={isMobile ? undefined : 'right'}
|
||||
borderColor={isMobile ? undefined : '4'}
|
||||
>
|
||||
<Row as="header" gap alignItems="center" justifyContent="space-between">
|
||||
{!collapsed && (
|
||||
<a href={logoUrl} target="_blank" rel="noopener" style={{ marginLeft: 12 }}>
|
||||
<Row alignItems="center" gap>
|
||||
{logoImage ? (
|
||||
<img src={logoImage} alt={logoName} style={{ height: 24 }} />
|
||||
) : (
|
||||
<Icon>
|
||||
<Logo />
|
||||
</Icon>
|
||||
)}
|
||||
<Text weight="bold">{logoName}</Text>
|
||||
</Row>
|
||||
</a>
|
||||
)}
|
||||
{!onItemClick && (
|
||||
<Button variant="quiet" onPress={() => onCollapse?.(!collapsed)}>
|
||||
<Icon color="muted">
|
||||
<PanelLeft />
|
||||
</Icon>
|
||||
</Button>
|
||||
)}
|
||||
</Row>
|
||||
{!collapsed && (
|
||||
<Column flexGrow={1} overflowY="auto">
|
||||
<Column padding="3" position="sticky" top="0" gap>
|
||||
<SideMenu
|
||||
items={items}
|
||||
selectedKey={selectedKey}
|
||||
|
|
@ -181,26 +139,5 @@ export function ShareNav({
|
|||
onItemClick={onItemClick}
|
||||
/>
|
||||
</Column>
|
||||
)}
|
||||
<Column
|
||||
flexGrow={collapsed ? 1 : undefined}
|
||||
justifyContent="flex-end"
|
||||
alignItems={collapsed ? 'center' : undefined}
|
||||
>
|
||||
{collapsed ? (
|
||||
<Column gap="2" alignItems="center">
|
||||
<ThemeButton />
|
||||
<LanguageButton />
|
||||
<PreferencesButton />
|
||||
</Column>
|
||||
) : (
|
||||
<Row>
|
||||
<ThemeButton />
|
||||
<LanguageButton />
|
||||
<PreferencesButton />
|
||||
</Row>
|
||||
)}
|
||||
</Column>
|
||||
</Column>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
'use client';
|
||||
import { Column, Grid, Row, useTheme } from '@umami/react-zen';
|
||||
import { usePathname } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Column, Grid, useTheme } from '@umami/react-zen';
|
||||
import { useEffect } from 'react';
|
||||
import { AttributionPage } from '@/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage';
|
||||
import { BreakdownPage } from '@/app/(main)/websites/[websiteId]/(reports)/breakdown/BreakdownPage';
|
||||
import { FunnelsPage } from '@/app/(main)/websites/[websiteId]/(reports)/funnels/FunnelsPage';
|
||||
|
|
@ -18,8 +17,9 @@ import { WebsiteHeader } from '@/app/(main)/websites/[websiteId]/WebsiteHeader';
|
|||
import { WebsitePage } from '@/app/(main)/websites/[websiteId]/WebsitePage';
|
||||
import { WebsiteProvider } from '@/app/(main)/websites/WebsiteProvider';
|
||||
import { PageBody } from '@/components/common/PageBody';
|
||||
import { useShare } from '@/components/hooks';
|
||||
import { MobileMenuButton } from '@/components/input/MobileMenuButton';
|
||||
import { useShareTokenQuery } from '@/components/hooks';
|
||||
import { Footer } from './Footer';
|
||||
import { Header } from './Header';
|
||||
import { ShareNav } from './ShareNav';
|
||||
|
||||
const PAGE_COMPONENTS: Record<string, React.ComponentType<{ websiteId: string }>> = {
|
||||
|
|
@ -39,25 +39,9 @@ const PAGE_COMPONENTS: Record<string, React.ComponentType<{ websiteId: string }>
|
|||
attribution: AttributionPage,
|
||||
};
|
||||
|
||||
function getSharePath(pathname: string) {
|
||||
const segments = pathname.split('/');
|
||||
const firstSegment = segments[3];
|
||||
|
||||
// If first segment looks like a domain name, skip it
|
||||
if (firstSegment?.includes('.')) {
|
||||
return segments[4];
|
||||
}
|
||||
|
||||
return firstSegment;
|
||||
}
|
||||
|
||||
export function SharePage() {
|
||||
const [navCollapsed, setNavCollapsed] = useState(false);
|
||||
const share = useShare();
|
||||
export function SharePage({ shareId, path = '' }: { shareId: string; path?: string }) {
|
||||
const { shareToken, isLoading } = useShareTokenQuery(shareId);
|
||||
const { setTheme } = useTheme();
|
||||
const pathname = usePathname();
|
||||
const path = getSharePath(pathname);
|
||||
const { websiteId, parameters = {} } = share;
|
||||
|
||||
useEffect(() => {
|
||||
const url = new URL(window?.location?.href);
|
||||
|
|
@ -68,6 +52,12 @@ export function SharePage() {
|
|||
}
|
||||
}, []);
|
||||
|
||||
if (isLoading || !shareToken) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { websiteId, parameters = {} } = shareToken;
|
||||
|
||||
// Check if the requested path is allowed
|
||||
const pageKey = path || '';
|
||||
const isAllowed = pageKey === '' || pageKey === 'overview' || parameters[pageKey] !== false;
|
||||
|
|
@ -79,25 +69,29 @@ export function SharePage() {
|
|||
const PageComponent = PAGE_COMPONENTS[pageKey] || WebsitePage;
|
||||
|
||||
return (
|
||||
<Grid columns={{ xs: '1fr', lg: `${navCollapsed ? '60px' : '240px'} 1fr` }} width="100%">
|
||||
<Row display={{ xs: 'flex', lg: 'none' }} alignItems="center" gap padding="3">
|
||||
<MobileMenuButton>
|
||||
{({ close }) => {
|
||||
return <ShareNav onItemClick={close} />;
|
||||
}}
|
||||
</MobileMenuButton>
|
||||
</Row>
|
||||
<Column display={{ xs: 'none', lg: 'flex' }} marginRight="2">
|
||||
<ShareNav collapsed={navCollapsed} onCollapse={setNavCollapsed} />
|
||||
<Column backgroundColor="2">
|
||||
<Header />
|
||||
<Grid columns={{ xs: '1fr', lg: 'auto 1fr' }} width="100%" height="100%">
|
||||
<Column
|
||||
display={{ xs: 'none', lg: 'flex' }}
|
||||
width="240px"
|
||||
height="100%"
|
||||
border="right"
|
||||
backgroundColor
|
||||
marginRight="2"
|
||||
>
|
||||
<ShareNav shareId={shareId} parameters={parameters} />
|
||||
</Column>
|
||||
<PageBody gap>
|
||||
<WebsiteProvider websiteId={websiteId}>
|
||||
<Column>
|
||||
<WebsiteHeader showActions={false} />
|
||||
<Column>
|
||||
<PageComponent websiteId={websiteId} />
|
||||
</Column>
|
||||
</WebsiteProvider>
|
||||
</PageBody>
|
||||
</Grid>
|
||||
<Footer />
|
||||
</Column>
|
||||
);
|
||||
}
|
||||
8
src/app/share/[...shareId]/page.tsx
Normal file
8
src/app/share/[...shareId]/page.tsx
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
import { SharePage } from './SharePage';
|
||||
|
||||
export default async function ({ params }: { params: Promise<{ shareId: string[] }> }) {
|
||||
const { shareId } = await params;
|
||||
const [slug, ...path] = shareId;
|
||||
|
||||
return <SharePage shareId={slug} path={path.join('/')} />;
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
import { SharePage } from './SharePage';
|
||||
|
||||
export default function () {
|
||||
return <SharePage />;
|
||||
}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import { ShareProvider } from '@/app/share/ShareProvider';
|
||||
|
||||
export default async function ({
|
||||
params,
|
||||
children,
|
||||
}: {
|
||||
params: Promise<{ slug: string }>;
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
const { slug } = await params;
|
||||
|
||||
return <ShareProvider slug={slug}>{children}</ShareProvider>;
|
||||
}
|
||||
|
|
@ -31,7 +31,6 @@ export function PageBody({
|
|||
<Column
|
||||
{...props}
|
||||
width="100%"
|
||||
minHeight="100vh"
|
||||
paddingBottom="6"
|
||||
maxWidth={maxWidth}
|
||||
paddingX={{ xs: '3', md: '6' }}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import {
|
|||
NavMenuItem,
|
||||
type NavMenuProps,
|
||||
Row,
|
||||
Text,
|
||||
} from '@umami/react-zen';
|
||||
import Link from 'next/link';
|
||||
|
||||
|
|
@ -43,11 +42,9 @@ export function SideMenu({
|
|||
|
||||
return (
|
||||
<Link key={id} href={path}>
|
||||
<Row padding hoverBackgroundColor="3">
|
||||
<IconLabel icon={icon}>
|
||||
<Text weight={isSelected ? 'bold' : undefined}>{label}</Text>
|
||||
</IconLabel>
|
||||
</Row>
|
||||
<NavMenuItem isSelected={isSelected}>
|
||||
<IconLabel icon={icon}>{label}</IconLabel>
|
||||
</NavMenuItem>
|
||||
</Link>
|
||||
);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
import { useContext } from 'react';
|
||||
import { ShareContext } from '@/app/share/ShareProvider';
|
||||
|
||||
export function useShare() {
|
||||
return useContext(ShareContext);
|
||||
}
|
||||
|
|
@ -3,7 +3,6 @@
|
|||
// Context hooks
|
||||
export * from './context/useLink';
|
||||
export * from './context/usePixel';
|
||||
export * from './context/useShare';
|
||||
export * from './context/useTeam';
|
||||
export * from './context/useUser';
|
||||
export * from './context/useWebsite';
|
||||
|
|
|
|||
|
|
@ -1,21 +1,25 @@
|
|||
import { setShare, useApp } from '@/store/app';
|
||||
import { setShareToken, useApp } from '@/store/app';
|
||||
import { useApi } from '../useApi';
|
||||
|
||||
const selector = state => state.share;
|
||||
const selector = (state: { shareToken: string }) => state.shareToken;
|
||||
|
||||
export function useShareTokenQuery(slug: string) {
|
||||
const share = useApp(selector);
|
||||
export function useShareTokenQuery(slug: string): {
|
||||
shareToken: any;
|
||||
isLoading?: boolean;
|
||||
error?: Error;
|
||||
} {
|
||||
const shareToken = useApp(selector);
|
||||
const { get, useQuery } = useApi();
|
||||
const query = useQuery({
|
||||
const { isLoading, error } = useQuery({
|
||||
queryKey: ['share', slug],
|
||||
queryFn: async () => {
|
||||
const data = await get(`/share/${slug}`);
|
||||
|
||||
setShare(data);
|
||||
setShareToken(data);
|
||||
|
||||
return data;
|
||||
},
|
||||
});
|
||||
|
||||
return { share, ...query };
|
||||
return { shareToken, isLoading, error };
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ export function MobileMenuButton(props: DialogProps) {
|
|||
</Icon>
|
||||
</Button>
|
||||
<Modal placement="left" offset="80px">
|
||||
<Dialog variant="sheet" {...props} style={{ width: 'auto' }} />
|
||||
<Dialog variant="sheet" {...props} />
|
||||
</Modal>
|
||||
</DialogTrigger>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -31,11 +31,9 @@ export function WebsiteDateFilter({
|
|||
const showCompare = allowCompare && !isAllTime;
|
||||
|
||||
const websiteDateRange = useDateRangeQuery(websiteId);
|
||||
const { startDate, endDate } = websiteDateRange;
|
||||
const hasData = startDate && endDate;
|
||||
|
||||
const handleChange = (date: string) => {
|
||||
if (date === 'all' && hasData) {
|
||||
if (date === 'all') {
|
||||
router.push(
|
||||
updateParams({
|
||||
date: `${getDateRangeValue(websiteDateRange.startDate, websiteDateRange.endDate)}:all`,
|
||||
|
|
@ -80,7 +78,7 @@ export function WebsiteDateFilter({
|
|||
<DateFilter
|
||||
value={dateValue}
|
||||
onChange={handleChange}
|
||||
showAllTime={hasData && showAllTime}
|
||||
showAllTime={showAllTime}
|
||||
renderDate={+offset !== 0}
|
||||
/>
|
||||
</Row>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ export function WebsiteSelect({
|
|||
const { user } = useLoginQuery();
|
||||
const { data, isLoading } = useUserWebsitesQuery(
|
||||
{ userId: user?.id, teamId },
|
||||
{ search, pageSize: 20, includeTeams },
|
||||
{ search, pageSize: 10, includeTeams },
|
||||
);
|
||||
const listItems: { id: string; name: string }[] = data?.data || [];
|
||||
|
||||
|
|
|
|||
|
|
@ -18,5 +18,5 @@ test('getIpAddress: Standard header', () => {
|
|||
});
|
||||
|
||||
test('getIpAddress: No header', () => {
|
||||
expect(getIpAddress(new Headers())).toEqual(undefined);
|
||||
expect(getIpAddress(new Headers())).toEqual(null);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ export function renderDateLabels(unit: string, locale: string) {
|
|||
|
||||
switch (unit) {
|
||||
case 'minute':
|
||||
return formatDate(d, 'h:mm', locale);
|
||||
case 'hour':
|
||||
return formatDate(d, 'p', locale);
|
||||
case 'day':
|
||||
|
|
|
|||
|
|
@ -108,7 +108,7 @@ function getFilterQuery(filters: Record<string, any>, options: QueryOptions = {}
|
|||
|
||||
if (name === 'referrer') {
|
||||
arr.push(
|
||||
`and (website_event.referrer_domain != regexp_replace(website_event.hostname, '^www.', '') or website_event.referrer_domain is null)`,
|
||||
`and (website_event.referrer_domain != website_event.hostname or website_event.referrer_domain is null)`,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -141,9 +141,3 @@ export interface ApiError extends Error {
|
|||
code?: string;
|
||||
message: string;
|
||||
}
|
||||
|
||||
export interface WhiteLabel {
|
||||
name: string;
|
||||
url: string;
|
||||
image: string;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,11 +5,7 @@ import type { Auth } from '@/lib/types';
|
|||
import { getTeamUser } from '@/queries/prisma';
|
||||
|
||||
export async function canViewEntity({ user }: Auth, entityId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
if (user?.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
|
@ -29,10 +25,6 @@ export async function canViewEntity({ user }: Auth, entityId: string) {
|
|||
}
|
||||
|
||||
export async function canUpdateEntity({ user }: Auth, entityId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -53,10 +45,6 @@ export async function canUpdateEntity({ user }: Auth, entityId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteEntity({ user }: Auth, entityId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,11 +4,7 @@ import type { Auth } from '@/lib/types';
|
|||
import { getLink, getTeamUser } from '@/queries/prisma';
|
||||
|
||||
export async function canViewLink({ user }: Auth, linkId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
if (user?.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
|
@ -28,10 +24,6 @@ export async function canViewLink({ user }: Auth, linkId: string) {
|
|||
}
|
||||
|
||||
export async function canUpdateLink({ user }: Auth, linkId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -52,10 +44,6 @@ export async function canUpdateLink({ user }: Auth, linkId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteLink({ user }: Auth, linkId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,11 +4,7 @@ import type { Auth } from '@/lib/types';
|
|||
import { getPixel, getTeamUser } from '@/queries/prisma';
|
||||
|
||||
export async function canViewPixel({ user }: Auth, pixelId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
if (user?.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
|
@ -28,10 +24,6 @@ export async function canViewPixel({ user }: Auth, pixelId: string) {
|
|||
}
|
||||
|
||||
export async function canUpdatePixel({ user }: Auth, pixelId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -52,10 +44,6 @@ export async function canUpdatePixel({ user }: Auth, pixelId: string) {
|
|||
}
|
||||
|
||||
export async function canDeletePixel({ user }: Auth, pixelId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@ import type { Auth } from '@/lib/types';
|
|||
import { canViewWebsite } from './website';
|
||||
|
||||
export async function canViewReport(auth: Auth, report: Report) {
|
||||
if (auth.user?.isAdmin) {
|
||||
if (auth.user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (auth.user?.id === report.userId) {
|
||||
if (auth.user.id === report.userId) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
|
@ -15,10 +15,6 @@ export async function canViewReport(auth: Auth, report: Report) {
|
|||
}
|
||||
|
||||
export async function canUpdateReport({ user }: Auth, report: Report) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,10 +4,6 @@ import type { Auth } from '@/lib/types';
|
|||
import { getTeamUser } from '@/queries/prisma';
|
||||
|
||||
export async function canViewTeam({ user }: Auth, teamId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -16,10 +12,6 @@ export async function canViewTeam({ user }: Auth, teamId: string) {
|
|||
}
|
||||
|
||||
export async function canCreateTeam({ user }: Auth) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -28,10 +20,6 @@ export async function canCreateTeam({ user }: Auth) {
|
|||
}
|
||||
|
||||
export async function canUpdateTeam({ user }: Auth, teamId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -42,10 +30,6 @@ export async function canUpdateTeam({ user }: Auth, teamId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteTeam({ user }: Auth, teamId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -56,10 +40,6 @@ export async function canDeleteTeam({ user }: Auth, teamId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteTeamUser({ user }: Auth, teamId: string, removeUserId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -74,10 +54,6 @@ export async function canDeleteTeamUser({ user }: Auth, teamId: string, removeUs
|
|||
}
|
||||
|
||||
export async function canCreateTeamWebsite({ user }: Auth, teamId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -88,5 +64,5 @@ export async function canCreateTeamWebsite({ user }: Auth, teamId: string) {
|
|||
}
|
||||
|
||||
export async function canViewAllTeams({ user }: Auth) {
|
||||
return user?.isAdmin ?? false;
|
||||
return user.isAdmin;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,14 +1,10 @@
|
|||
import type { Auth } from '@/lib/types';
|
||||
|
||||
export async function canCreateUser({ user }: Auth) {
|
||||
return user?.isAdmin ?? false;
|
||||
return user.isAdmin;
|
||||
}
|
||||
|
||||
export async function canViewUser({ user }: Auth, viewedUserId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -17,14 +13,10 @@ export async function canViewUser({ user }: Auth, viewedUserId: string) {
|
|||
}
|
||||
|
||||
export async function canViewUsers({ user }: Auth) {
|
||||
return user?.isAdmin ?? false;
|
||||
return user.isAdmin;
|
||||
}
|
||||
|
||||
export async function canUpdateUser({ user }: Auth, viewedUserId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -33,5 +25,5 @@ export async function canUpdateUser({ user }: Auth, viewedUserId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteUser({ user }: Auth) {
|
||||
return user?.isAdmin ?? false;
|
||||
return user.isAdmin;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export async function canViewWebsite({ user, shareToken }: Auth, websiteId: stri
|
|||
|
||||
const entity = await getEntity(websiteId);
|
||||
|
||||
if (!entity || !user) {
|
||||
if (!entity) {
|
||||
return false;
|
||||
}
|
||||
|
||||
|
|
@ -33,14 +33,10 @@ export async function canViewWebsite({ user, shareToken }: Auth, websiteId: stri
|
|||
}
|
||||
|
||||
export async function canViewAllWebsites({ user }: Auth) {
|
||||
return user?.isAdmin ?? false;
|
||||
return user.isAdmin;
|
||||
}
|
||||
|
||||
export async function canCreateWebsite({ user }: Auth) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -49,10 +45,6 @@ export async function canCreateWebsite({ user }: Auth) {
|
|||
}
|
||||
|
||||
export async function canUpdateWebsite({ user }: Auth, websiteId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -77,10 +69,6 @@ export async function canUpdateWebsite({ user }: Auth, websiteId: string) {
|
|||
}
|
||||
|
||||
export async function canDeleteWebsite({ user }: Auth, websiteId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (user.isAdmin) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -105,10 +93,6 @@ export async function canDeleteWebsite({ user }: Auth, websiteId: string) {
|
|||
}
|
||||
|
||||
export async function canTransferWebsiteToUser({ user }: Auth, websiteId: string, userId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const website = await getWebsite(websiteId);
|
||||
|
||||
if (!website) {
|
||||
|
|
@ -125,10 +109,6 @@ export async function canTransferWebsiteToUser({ user }: Auth, websiteId: string
|
|||
}
|
||||
|
||||
export async function canTransferWebsiteToTeam({ user }: Auth, websiteId: string, teamId: string) {
|
||||
if (!user) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const website = await getWebsite(websiteId);
|
||||
|
||||
if (!website) {
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ async function relationalQuery(websiteId: string, column: string, filters: Query
|
|||
let excludeDomain = '';
|
||||
|
||||
if (column === 'referrer_domain') {
|
||||
excludeDomain = `and website_event.referrer_domain != regexp_replace(website_event.hostname, '^www.', '')
|
||||
excludeDomain = `and website_event.referrer_domain != website_event.hostname
|
||||
and website_event.referrer_domain != ''`;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ export async function getWeeklyTraffic(...args: [websiteId: string, filters: Que
|
|||
}
|
||||
|
||||
async function relationalQuery(websiteId: string, filters: QueryFilters) {
|
||||
const { timezone = 'utc' } = filters;
|
||||
const timezone = 'utc';
|
||||
const { rawQuery, getDateWeeklySQL, parseFilters } = prisma;
|
||||
const { filterQuery, joinSessionQuery, cohortQuery, queryParams } = parseFilters({
|
||||
...filters,
|
||||
|
|
@ -33,7 +33,7 @@ async function relationalQuery(websiteId: string, filters: QueryFilters) {
|
|||
and website_event.created_at between {{startDate}} and {{endDate}}
|
||||
${filterQuery}
|
||||
group by time
|
||||
order by 1
|
||||
order by 2
|
||||
`,
|
||||
queryParams,
|
||||
FUNCTION_NAME,
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ async function relationalQuery(
|
|||
let excludeDomain = '';
|
||||
|
||||
if (column === 'referrer_domain') {
|
||||
excludeDomain = `and website_event.referrer_domain != regexp_replace(website_event.hostname, '^www.', '')
|
||||
excludeDomain = `and website_event.referrer_domain != website_event.hostname
|
||||
and website_event.referrer_domain != ''`;
|
||||
if (type === 'domain') {
|
||||
column = toPostgresGroupedReferrer(GROUPED_DOMAINS);
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ async function relationalQuery(
|
|||
let excludeDomain = '';
|
||||
|
||||
if (column === 'referrer_domain') {
|
||||
excludeDomain = `and website_event.referrer_domain != regexp_replace(website_event.hostname, '^www.', '')
|
||||
excludeDomain = `and website_event.referrer_domain != website_event.hostname
|
||||
and website_event.referrer_domain != ''`;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -142,7 +142,7 @@ async function relationalQuery(
|
|||
${
|
||||
currency
|
||||
? ''
|
||||
: `and we.referrer_domain != regexp_replace(we.hostname, '^www.', '')
|
||||
: `and we.referrer_domain != hostname
|
||||
and we.referrer_domain != ''`
|
||||
}
|
||||
group by 1
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ const initialState = {
|
|||
theme: getItem(THEME_CONFIG) || DEFAULT_THEME,
|
||||
timezone: getItem(TIMEZONE_CONFIG) || getTimezone(),
|
||||
dateRangeValue: getItem(DATE_RANGE_CONFIG) || DEFAULT_DATE_RANGE_VALUE,
|
||||
share: null,
|
||||
shareToken: null,
|
||||
user: null,
|
||||
config: null,
|
||||
};
|
||||
|
|
@ -31,8 +31,8 @@ export function setLocale(locale: string) {
|
|||
store.setState({ locale });
|
||||
}
|
||||
|
||||
export function setShare(share: object) {
|
||||
store.setState({ share });
|
||||
export function setShareToken(shareToken: string) {
|
||||
store.setState({ shareToken });
|
||||
}
|
||||
|
||||
export function setUser(user: object) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue