tanner/spaceport
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add a QR code for PayPal subscriptions on Home

Browse Source
This commit is contained in:
Tanner Collin
2021-08-18 20:40:11 +00:00
parent 17da308f37
commit d7101195ca
5 changed files with 57 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
webclient/src/App.js
View File

@@ -21,6 +21,7 @@ import { Classes, ClassDetail } from './Classes.js';
import { Members, MemberDetail } from './Members.js';
import { Charts } from './Charts.js';
import { Auth } from './Auth.js';
import { Subscribe } from './PayPal.js';
import { PasswordReset, ConfirmReset } from './PasswordReset.js';
import { NotFound, PleaseLogin } from './Misc.js';
import { Footer } from './Footer.js';
@@ -226,6 +227,10 @@ function App() {
<Auth user={user} />
</Route>
<Route path='/subscribe'>
<Subscribe />
</Route>
{user && user.member.set_details ?
<Switch>
<Route path='/account'>

9
webclient/src/Home.js
View File

@@ -1,9 +1,10 @@
import React, { useState, useEffect, useReducer } from 'react';
import { BrowserRouter as Router, Switch, Route, Link, useParams, useLocation } from 'react-router-dom';
import moment from 'moment-timezone';
import QRCode from 'react-qr-code';
import './light.css';
import { Container, Divider, Dropdown, Form, Grid, Header, Icon, Image, Menu, Message, Popup, Segment, Table } from 'semantic-ui-react';
import { statusColor, BasicTable, staticUrl, requester, isAdmin } from './utils.js';
import { statusColor, BasicTable, siteUrl, staticUrl, requester, isAdmin } from './utils.js';
import { LoginForm, SignupForm } from './LoginSignup.js';
import { AccountForm } from './Account.js';
import { PayPalSubscribeDeal } from './PayPal.js';
@@ -68,6 +69,10 @@ function MemberInfo(props) {
name='Protospace Membership'
custom={JSON.stringify({ deal: 3, member: user.member.id })}
/>
<p>Click "Checkout as Guest" if you don't have a PayPal account.</p>
<QRCode value={siteUrl + '/subscribe?monthly_fees=' + user.member.monthly_fees + '&id=' + user.member.id} />
</React.Fragment>}
<Header size='medium'>Details</Header>
@@ -159,7 +164,7 @@ export function Home(props) {
const getTrackAgo = (x) => stats && stats.track && stats.track[x] ? moment.unix(stats.track[x]['time']).tz('America/Edmonton').fromNow() : '';
const getTrackName = (x) => stats && stats.track && stats.track[x] && stats.track[x]['username'] ? stats.track[x]['username'] : 'Unknown';
const alarmStat = () => stats && stats.alarm && moment().unix() - stats.alarm['time'] < 300 ? stats.alarm['data'] > 200 ? 'Armed' : 'Disarmed' : 'Unknown';
const alarmStat = () => stats && stats.alarm && moment().unix() - stats.alarm['time'] < 300 ? stats.alarm['data'] < 270 ? 'Armed' : 'Disarmed' : 'Unknown';
return (
<Container>

29
webclient/src/PayPal.js
View File

@@ -1,4 +1,6 @@
import React, { useState, useEffect, useReducer } from 'react';
import { useLocation } from 'react-router-dom';
import { Button, Container, Divider, Dropdown, Form, Grid, Header, Icon, Image, Input, Item, Menu, Message, Segment, Table } from 'semantic-ui-react';
export function PayPalPayNow(props) {
const { amount, custom, name } = props;
@@ -77,3 +79,30 @@ export function PayPalSubscribeDeal(props) {
</div>
);
}
export function Subscribe(props) {
const qs = useLocation().search;
const params = new URLSearchParams(qs);
const monthly_fees = params.get('monthly_fees') || false;
const id = params.get('id') || false;
return (
<Container>
<Header size='large'>Create a PayPal Subscription</Header>
<p>Use this page to set up a Protospace membership subscription.</p>
{monthly_fees && id ?
<PayPalSubscribeDeal
amount={monthly_fees}
name='Protospace Membership'
custom={JSON.stringify({ deal: 3, member: id })}
/>
:
<p>Error, invalid subscribe link.</p>
}
<p>Click "Checkout as Guest" if you don't have a PayPal account.</p>
</Container>
);
}