Finished up the modal to create a payment and added the page to the sidebar

src/pages/api/payments/index.ts

@@ -6,6 +6,8 @@ import {withIronSessionApiRoute} from "iron-session/next";
 import {sessionOptions} from "@/lib/session";
 import {Group} from "@/interfaces/user";
 import {Payment} from "@/interfaces/paypal";
+import {v4} from "uuid";
+import ShortUniqueId from "short-unique-id";
 
 const db = getFirestore(app);
 
@@ -35,6 +37,7 @@ async function get(req: NextApiRequest, res: NextApiResponse) {
 async function post(req: NextApiRequest, res: NextApiResponse) {
 	const body = req.body as Payment;
 
-	await setDoc(doc(db, "payments", body.id), body);
+	const shortUID = new ShortUniqueId();
+	await setDoc(doc(db, "payments", shortUID.randomUUID(8)), body);
 	res.status(200).json({ok: true});
 }