From e6aaef9bf196b08c968f7fca2d567a0dba44b991 Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Tue, 25 Jan 2022 04:12:22 +0000
Subject: [PATCH] Add Consumables to Paymaster

---
 apiserver/apiserver/api/utils_paypal.py |  2 +-
 webclient/src/Paymaster.js              | 72 ++++++++++++++++---------
 2 files changed, 48 insertions(+), 26 deletions(-)

diff --git a/apiserver/apiserver/api/utils_paypal.py b/apiserver/apiserver/api/utils_paypal.py
index a3676df..bf135a4 100644
--- a/apiserver/apiserver/api/utils_paypal.py
+++ b/apiserver/apiserver/api/utils_paypal.py
@@ -353,7 +353,7 @@ def process_paypal_ipn(data):
         defaults=dict(user=user),
     )
 
-    if custom_json.get('category', False) in ['Snacks', 'OnAcct', 'Donation']:
+    if custom_json.get('category', False) in ['Snacks', 'OnAcct', 'Donation', 'Consumables']:
         logger.info('IPN - Category matched')
         update_ipn(ipn, 'Accepted, category')
         return create_category_tx(data, member, custom_json)
diff --git a/webclient/src/Paymaster.js b/webclient/src/Paymaster.js
index aef1d20..1a492ea 100644
--- a/webclient/src/Paymaster.js
+++ b/webclient/src/Paymaster.js
@@ -11,6 +11,8 @@ export function Paymaster(props) {
 	const { user } = props;
 	const [pop, setPop] = useState('20.00');
 	const [locker, setLocker] = useState('5.00');
+	const [consumables, setConsumables] = useState('20.00');
+	const [consumablesMemo, setConsumablesMemo] = useState('');
 	const [donate, setDonate] = useState('20.00');
 	const [memo, setMemo] = useState('');
 
@@ -93,26 +95,44 @@ export function Paymaster(props) {
 				</Grid.Column>
 			</Grid>
 
+			<Header size='medium'>Consumables</Header>
+
+			<p>Pay for materials you use (ie. welding gas, 3D printing, blades, etc).</p>
+
+			<Grid stackable padded columns={1}>
+				<Grid.Column>
+					Custom amount:
+
+					<div className='pay-custom'>
+						<Input
+							fluid
+							label={{ basic: true, content: '$' }}
+							labelPosition='left'
+							value={consumables}
+							onChange={(e, v) => setConsumables(v.value)}
+						/>
+					</div>
+
+					<p>
+						Please explain what you bought:<br/>
+						<Input
+							value={consumablesMemo}
+							maxLength={50}
+							onChange={(e, v) => setConsumablesMemo(v.value)}
+						/>
+					</p>
+
+					<PayPalPayNow
+						amount={consumables}
+						name='Protospace Consumables'
+						custom={JSON.stringify({ category: 'Consumables', member: user.member.id, memo: consumablesMemo })}
+					/>
+				</Grid.Column>
+			</Grid>
+
 			<Header size='medium'>Donate</Header>
-			<Grid stackable padded columns={3}>
-				<Grid.Column>
-					<p>Donate $5.00:</p>
-					<PayPalPayNow
-						amount={5}
-						name='Protospace Donation'
-						custom={JSON.stringify({ category: 'Donation', member: user.member.id, memo: memo })}
-					/>
-				</Grid.Column>
-
-				<Grid.Column>
-					<p>Donate $10.00:</p>
-					<PayPalPayNow
-						amount={10}
-						name='Protospace Donation'
-						custom={JSON.stringify({ category: 'Donation', member: user.member.id, memo: memo })}
-					/>
-				</Grid.Column>
 
+			<Grid stackable padded columns={1}>
 				<Grid.Column>
 					Custom amount:
 
@@ -126,19 +146,21 @@ export function Paymaster(props) {
 						/>
 					</div>
 
+					<p>
+						Optional memo:<br/>
+						<Input
+							value={memo}
+							maxLength={50}
+							onChange={(e, v) => setMemo(v.value)}
+						/>
+					</p>
+
 					<PayPalPayNow
 						amount={donate}
 						name='Protospace Donation'
 						custom={JSON.stringify({ category: 'Donation', member: user.member.id, memo: memo })}
 					/>
 				</Grid.Column>
-
-			Add an optional memo to your donation:
-			<Input
-				value={memo}
-				maxLength={50}
-				onChange={(e, v) => setMemo(v.value)}
-			/>
 			</Grid>
 
 			<Header size='medium'>Locker Storage</Header>