From 97b2a5d5a9463142bbb797de14ed0a7485066abb Mon Sep 17 00:00:00 2001
From: Austin Chen <akrolsmir@gmail.com>
Date: Wed, 4 May 2022 12:10:33 -0400
Subject: [PATCH] Store custom amounts in the link

---
 web/pages/send.tsx | 52 ++++++++++++++++++++++++++++++++--------------
 1 file changed, 36 insertions(+), 16 deletions(-)

diff --git a/web/pages/send.tsx b/web/pages/send.tsx
index 9408a4c3..fb1b19ba 100644
--- a/web/pages/send.tsx
+++ b/web/pages/send.tsx
@@ -1,10 +1,14 @@
+import { useState } from 'react'
+import { Col } from '../components/layout/col'
 import { Page } from '../components/page'
 import { SEO } from '../components/SEO'
+import { Title } from '../components/title'
 import { useUser } from '../hooks/use-user'
 import { createManalink } from '../lib/firebase/manalinks'
 
 export default function SendPage() {
   const user = useUser()
+  const [amount, setAmount] = useState(100)
 
   return (
     <Page>
@@ -14,22 +18,38 @@ export default function SendPage() {
         url="/send"
       />
 
-      <h1>Send Mana</h1>
-      {user && (
-        <button
-          className="btn"
-          onClick={async () => {
-            await createManalink({
-              fromId: user.id,
-              amount: 1234,
-              expiresTime: Date.now() + 1000 * 60 * 60 * 24 * 7,
-              maxUses: Infinity,
-            })
-          }}
-        >
-          Create a new Manalink
-        </button>
-      )}
+      <Col className="gap-4">
+        <Title text="Send mana" />
+
+        {/* Add a input form to set the amount */}
+        <label>
+          Amount M$
+          <input
+            className="input"
+            type="number"
+            value={amount}
+            onChange={(e) => setAmount(parseInt(e.target.value))}
+          />
+        </label>
+
+        {user && (
+          <button
+            className="btn"
+            onClick={async () => {
+              await createManalink({
+                fromId: user.id,
+                amount: amount,
+                expiresTime: Date.now() + 1000 * 60 * 60 * 24 * 7,
+                maxUses: Infinity,
+              })
+            }}
+          >
+            Create a new Manalink
+          </button>
+        )}
+      </Col>
+
+      {/* TODO: show referral links via TailwindUI Table https://tailwindui.com/components/application-ui/lists/tables */}
     </Page>
   )
 }