zias/stats
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: new billing and restrict access when trial has ended

Browse Source 
* fix: simply billing

* fix usage graph

* imporve billing more + supporter prompt on self-hosting

* revert service change

* revert query builder

* fix: comments
This commit is contained in:
Carl-Gerhard Lindesvärd
2025-11-11 11:09:11 +01:00
committed by GitHub
parent bbd30ca6e0
commit 9cafd61b25
57 changed files with 1642 additions and 1269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
apps/start/src/routes/_app.$organizationId.$projectId.events._tabs.stats.tsx Normal file
View File

@@ -0,0 +1,180 @@
import {
OverviewFilterButton,
OverviewFiltersButtons,
} from '@/components/overview/filters/overview-filters-buttons';
import { ReportChartShortcut } from '@/components/report-chart/shortcut';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import {
useEventQueryFilters,
useEventQueryNamesFilter,
} from '@/hooks/use-event-query-filters';
import type { IChartEvent } from '@openpanel/validation';
import { createFileRoute } from '@tanstack/react-router';
export const Route = createFileRoute(
'/_app/$organizationId/$projectId/events/_tabs/stats',
)({
component: Component,
});
function Component() {
const { projectId } = Route.useParams();
const [filters] = useEventQueryFilters();
const [events] = useEventQueryNamesFilter();
const fallback: IChartEvent[] = [
{
id: 'A',
name: '*',
displayName: 'All events',
segment: 'event',
filters: filters ?? [],
},
];
return (
<div>
<div className="mb-2 flex items-center gap-2">
<OverviewFilterButton enableEventsFilter />
<OverviewFiltersButtons className="justify-end p-0" />
</div>
<div className="grid grid-cols-1 gap-2 md:grid-cols-2">
<Widget className="w-full">
<WidgetHead>
<span className="title">Events per day</span>
</WidgetHead>
<WidgetBody>
<ReportChartShortcut
projectId={projectId}
range="30d"
chartType="histogram"
events={
events && events.length > 0
? events.map((name) => ({
id: name,
name,
displayName: name,
segment: 'event',
filters: filters ?? [],
}))
: fallback
}
/>
</WidgetBody>
</Widget>
<Widget className="w-full">
<WidgetHead>
<span className="title">Event distribution</span>
</WidgetHead>
<WidgetBody>
<ReportChartShortcut
projectId={projectId}
range="30d"
chartType="pie"
breakdowns={[
{
id: 'A',
name: 'name',
},
]}
events={
events && events.length > 0
? events.map((name) => ({
id: name,
name,
displayName: name,
segment: 'event',
filters: filters ?? [],
}))
: [
{
id: 'A',
name: '*',
displayName: 'All events',
segment: 'event',
filters: filters ?? [],
},
]
}
/>
</WidgetBody>
</Widget>
<Widget className="w-full">
<WidgetHead>
<span className="title">Event distribution</span>
</WidgetHead>
<WidgetBody>
<ReportChartShortcut
projectId={projectId}
range="30d"
chartType="bar"
breakdowns={[
{
id: 'A',
name: 'name',
},
]}
events={
events && events.length > 0
? events.map((name) => ({
id: name,
name,
displayName: name,
segment: 'event',
filters: filters ?? [],
}))
: [
{
id: 'A',
name: '*',
displayName: 'All events',
segment: 'event',
filters: filters ?? [],
},
]
}
/>
</WidgetBody>
</Widget>
<Widget className="w-full">
<WidgetHead>
<span className="title">Event distribution</span>
</WidgetHead>
<WidgetBody>
<ReportChartShortcut
projectId={projectId}
range="30d"
chartType="linear"
breakdowns={[
{
id: 'A',
name: 'name',
},
]}
events={
events && events.length > 0
? events.map((name) => ({
id: name,
name,
displayName: name,
segment: 'event',
filters: filters ?? [],
}))
: [
{
id: 'A',
name: '*',
displayName: 'All events',
segment: 'event',
filters: filters ?? [],
},
]
}
/>
</WidgetBody>
</Widget>
</div>
</div>
);
}