diff --git a/apps/marketing/src/app/(marketing)/open/cap-table.tsx b/apps/marketing/src/app/(marketing)/open/cap-table.tsx new file mode 100644 index 000000000..9bf4f9023 --- /dev/null +++ b/apps/marketing/src/app/(marketing)/open/cap-table.tsx @@ -0,0 +1,57 @@ +'use client'; + +import { HTMLAttributes } from 'react'; + +import { Cell, Pie, PieChart } from 'recharts'; + +import { cn } from '@documenso/ui/lib/utils'; + +const data = [ + { name: 'Founders', percentage: 75.5 }, + { name: 'Investors', percentage: 14.5 }, + { name: 'Team Pool', percentage: 10 }, +]; + +const COLORS = ['#7fd843', '#a2e771', '#c6f2a4']; + +const RADIAN = Math.PI / 180; +const renderCustomizedLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, percent, index }) => { + const radius = innerRadius + (outerRadius - innerRadius) * 0.25; + const x = cx + radius * Math.cos(-midAngle * RADIAN); + const y = cy + radius * Math.sin(-midAngle * RADIAN); + + return ( + cx ? 'start' : 'end'} dominantBaseline="central"> + {`${(percent * 100).toFixed(1)}%`} + + ); +}; +export type CapTableProps = HTMLAttributes; + +export const CapTable = ({ className, ...props }: CapTableProps) => { + return ( +
+

Cap Table

+ +
+ + + {data.map((entry, index) => ( + + ))} + + +
+
+ ); +}; diff --git a/apps/marketing/src/app/(marketing)/open/data.ts b/apps/marketing/src/app/(marketing)/open/data.ts index fa831d08b..083f653dc 100644 --- a/apps/marketing/src/app/(marketing)/open/data.ts +++ b/apps/marketing/src/app/(marketing)/open/data.ts @@ -93,3 +93,18 @@ export const SALARY_BANDS = [ salary: 80_000, }, ]; + +export const CAP_TABLE = [ + { + shareholder: 'Founders', + percentage: '75.5', + }, + { + shareholder: 'Investors', + percentage: '14.5', + }, + { + shareholder: 'Team Pool', + percentage: '10', + }, +]; diff --git a/apps/marketing/src/app/(marketing)/open/page.tsx b/apps/marketing/src/app/(marketing)/open/page.tsx index 0ab3318fd..73de57dd5 100644 --- a/apps/marketing/src/app/(marketing)/open/page.tsx +++ b/apps/marketing/src/app/(marketing)/open/page.tsx @@ -3,6 +3,7 @@ import { z } from 'zod'; import { MetricCard } from '~/app/(marketing)/open/metric-card'; import { SalaryBands } from '~/app/(marketing)/open/salary-bands'; +import { CapTable } from './cap-table'; import { FundingRaised } from './funding-raised'; import { TeamMembers } from './team-members'; @@ -85,6 +86,8 @@ export default async function OpenPage() { + +

Where's the rest?

diff --git a/package-lock.json b/package-lock.json index cfd4f57c9..57d2195f7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,9 @@ "apps/*", "packages/*" ], + "dependencies": { + "recharts": "^2.7.2" + }, "devDependencies": { "dotenv": "^16.0.3", "dotenv-cli": "^7.2.1", diff --git a/package.json b/package.json index 428819000..045275faa 100644 --- a/package.json +++ b/package.json @@ -20,5 +20,8 @@ "workspaces": [ "apps/*", "packages/*" - ] + ], + "dependencies": { + "recharts": "^2.7.2" + } }