Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-10 04:22:32 +10:00
Code Issues Packages Projects Releases Wiki Activity

chore: custom tooltip

Browse Source
This commit is contained in:
Ephraim Atta-Duncan
2024-05-21 22:53:31 +00:00
parent 39e7eb0568
commit 72d0a1b69c
2 changed files with 6 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
apps/web/src/app/(dashboard)/admin/stats/page.tsx
View File

@ -106,14 +106,11 @@ export default async function AdminStatsPage() {
<div className="mt-16">
<h3 className="text-3xl font-semibold">Charts</h3>
<div className="mt-5 grid grid-cols-2 gap-10">
<UserWithDocumentChart
data={MONTHLY_USERS_SIGNED}
title="Monthly users who created documents"
/>
<UserWithDocumentChart data={MONTHLY_USERS_SIGNED} title="MAU (created document)" />
<UserWithDocumentChart
data={MONTHLY_USERS_SIGNED}
completed
title="Monthly users who completed documents"
title="MAU (had document completed)"
/>
</div>
</div>

6
apps/web/src/app/(dashboard)/admin/stats/user-with-document.tsx
View File

@ -10,6 +10,7 @@ export type UserWithDocumentChartProps = {
title: string;
data: GetUserWithDocumentMonthlyGrowth;
completed?: boolean;
tooltip?: string;
};
export const UserWithDocumentChart = ({
@ -17,6 +18,7 @@ export const UserWithDocumentChart = ({
data,
title,
completed = false,
tooltip,
}: UserWithDocumentChartProps) => {
const formattedData = (data: GetUserWithDocumentMonthlyGrowth, completed: boolean) => {
return [...data].reverse().map(({ month, count, signed_count }) => {
@ -51,7 +53,7 @@ export const UserWithDocumentChart = ({
labelStyle={{
color: 'hsl(var(--primary-foreground))',
}}
formatter={(value) => [Number(value).toLocaleString('en-US'), 'Documents']}
formatter={(value) => [Number(value).toLocaleString('en-US'), tooltip]}
cursor={{ fill: 'hsl(var(--primary) / 10%)' }}
/>
@ -60,7 +62,7 @@ export const UserWithDocumentChart = ({
fill="hsl(var(--primary))"
radius={[4, 4, 0, 0]}
maxBarSize={60}
label="Documents"
label={tooltip}
/>
</BarChart>
</ResponsiveContainer>