Commit 85bcf275 authored by Mari's avatar Mari

[ni] update splash donation page with options for recurring payments

parent b752cad6
Pipeline #46094 passed with stage
in 56 seconds
No preview for this file type
No preview for this file type
......@@ -15,12 +15,12 @@ const buttonStyles = {
const stripePromise = loadStripe(process.env.GATSBY_STRIPE_PUBLISHABLE_KEY)
const redirectToCheckout = async (event, priceID) => {
const redirectToCheckout = async (event, priceID, mode) => {
event.preventDefault()
const stripe = await stripePromise
const { error } = await stripe.redirectToCheckout({
lineItems: [{ price: priceID, quantity: 1 }],
mode: 'payment',
mode,
successUrl: `https://signalboost.info/donate`,
cancelUrl: `https://signalboost.info/donate`,
})
......@@ -30,9 +30,12 @@ const redirectToCheckout = async (event, priceID) => {
}
}
const Checkout = ({ price, priceID }) => {
const Checkout = ({ price, priceID, mode }) => {
return (
<button style={buttonStyles} onClick={e => redirectToCheckout(e, priceID)}>
<button
style={buttonStyles}
onClick={e => redirectToCheckout(e, priceID, mode)}
>
{price}
</button>
)
......
......@@ -37,11 +37,44 @@ const DonatePage = () => (
amount of time we need to spend scaling up.
</p>
<h3>Support Signalboost here:</h3>
<h4 style={platformHeader}> Credit card:</h4>
<h4 style={platformHeader}>
If your organization has a tech budget, or if you have the means, consider
making a recurring donation:
</h4>
<div style={stripeBtnStyles}>
<Checkout price="$5" priceID={process.env.GATSBY_BUTTON_PRICE_ID_5} />
<Checkout price="$20" priceID={process.env.GATSBY_BUTTON_PRICE_ID_20} />
<Checkout price="$50" priceID={process.env.GATSBY_BUTTON_PRICE_ID_50} />
<Checkout
price="$5"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_RECURRING_5}
mode="subscription"
/>
<Checkout
price="$20"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_RECURRING_20}
mode="subscription"
/>
<Checkout
price="$50"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_RECURRING_50}
mode="subscription"
/>
</div>
<h4 style={platformHeader}>Or make a one-time donation:</h4>
<div style={stripeBtnStyles}>
<Checkout
price="$5"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_5}
mode="payment"
/>
<Checkout
price="$20"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_20}
mode="payment"
/>
<Checkout
price="$50"
priceID={process.env.GATSBY_BUTTON_PRICE_ID_50}
mode="payment"
/>
</div>
<a href="https://venmo.com/signalboost">
<h4 style={platformHeader}> Venmo: @signalboost</h4>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment