Compare commits

...

1 Commits

Author SHA1 Message Date
Ephraim Atta-Duncan
07249b38b2 chore: add responsive container to pie chart 2023-08-16 18:37:48 +00:00

View File

@@ -2,7 +2,7 @@
import { HTMLAttributes, useEffect, useState } from 'react'; import { HTMLAttributes, useEffect, useState } from 'react';
import { Cell, Pie, PieChart, Tooltip } from 'recharts'; import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from 'recharts';
import { cn } from '@documenso/ui/lib/utils'; import { cn } from '@documenso/ui/lib/utils';
@@ -53,15 +53,16 @@ export const CapTable = ({ className, ...props }: CapTableProps) => {
<div className="border-border mt-2.5 flex flex-1 items-center justify-center rounded-2xl border shadow-sm hover:shadow"> <div className="border-border mt-2.5 flex flex-1 items-center justify-center rounded-2xl border shadow-sm hover:shadow">
{!isSSR && ( {!isSSR && (
<PieChart width={400} height={400}> <ResponsiveContainer width="100%" height={400}>
<PieChart>
<Pie <Pie
data={CAP_TABLE} data={CAP_TABLE}
cx="50%" cx="50%"
cy="50%" cy="50%"
labelLine={false} labelLine={false}
label={renderCustomizedLabel} label={renderCustomizedLabel}
outerRadius={180} outerRadius={160}
innerRadius={100} innerRadius={80}
fill="#8884d8" fill="#8884d8"
dataKey="percentage" dataKey="percentage"
> >
@@ -75,6 +76,7 @@ export const CapTable = ({ className, ...props }: CapTableProps) => {
}} }}
/> />
</PieChart> </PieChart>
</ResponsiveContainer>
)} )}
</div> </div>
</div> </div>