diff --git a/frontend/src/components/stripe-button.tsx b/frontend/src/components/stripe-button.tsx new file mode 100644 index 00000000..60535c0a --- /dev/null +++ b/frontend/src/components/stripe-button.tsx @@ -0,0 +1,29 @@ +import React, { useEffect } from "react"; + +const StripeButton: React.FC = () => { + useEffect(() => { + const script = document.createElement("script"); + script.src = "https://js.stripe.com/v3/buy-button.js"; + script.async = true; + document.body.appendChild(script); + + return () => { + document.body.removeChild(script); + }; + }, []); + + return ( +
+ `, + }} + >
+ ); +}; + +export default StripeButton; diff --git a/frontend/src/pages/profile.tsx b/frontend/src/pages/profile.tsx index c437a90b..55fa4ba7 100644 --- a/frontend/src/pages/profile.tsx +++ b/frontend/src/pages/profile.tsx @@ -4,9 +4,11 @@ import { getServerSession } from "next-auth"; import { useSession, signOut } from "next-auth/react"; import { authOptions } from "./api/auth/[...nextauth]"; -import { DashboardLayout } from "~/components/layouts"; +import { DashboardLayout, Meta } from "~/components/layouts"; import { Button, Dialog, DialogContent, DialogDescription, DialogTitle } from "~/components/ui"; import { deletePrivateKey } from "~/utils/auth"; +import Link from "next/link"; +import StripeButton from "~/components/stripe-button"; const AccountPage: NextPage = () => { const { data: session } = useSession(); @@ -19,6 +21,12 @@ const AccountPage: NextPage = () => { return ( +

Profile

You have been assigned an anonymous account

@@ -38,7 +46,8 @@ const AccountPage: NextPage = () => {
-

You're on the Fusion Free Plan.

+

Fusion is open source. Fund our development!

+
);