Skip to content
This repository has been archived by the owner on Oct 4, 2023. It is now read-only.

Switch to Stripe package instead of script #3798

Merged
merged 6 commits into from
Jul 26, 2023
Merged

Switch to Stripe package instead of script #3798

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
d529736
Switch to Stripe package instead of script
dharit-tan Jul 25, 2023
926250f
package-lock
dharit-tan Jul 25, 2023
a4b46fb
Revert lock
dylanjeffers Jul 26, 2023
ffb544c
Update core lock
dylanjeffers Jul 26, 2023
6b4e7e0
Update lock
dylanjeffers Jul 26, 2023
1ec88fb
pin stripe package versions
dharit-tan Jul 26, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions packages/web/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,8 @@
"@sentry/integrations": "6.16.1",
"@solana/spl-token": "0.1.8",
"@solana/web3.js": "1.53.0",
"@stripe/crypto": "0.0.4",
"@stripe/stripe-js": "^1.54.1",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

pin

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@rickyrombo as in should or should not pin?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

pin it!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@dharit-tan hmm these aren't pinned in main, can you pin?

"@types/react-dates": "21.8.3",
"@types/react-twitter-auth": "0.0.4",
"@walletconnect/web3-provider": "1.4.1",
Expand Down
6 changes: 0 additions & 6 deletions packages/web/public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,12 +141,6 @@
</script>
<!-- end Optimizely -->

<!-- start Stripe -->
<!-- TODO: Replace with npm packages when Stripe publishes -->
<script src="https://js.stripe.com/v3/"></script>
<script type="text/javascript" src="https://crypto-js.stripe.com/crypto-onramp-outer.js"></script>
<!-- end Stripe -->

<!-- TODO: Remove this when we compute average colors on the backend -->
<link href="/scripts/jimp.min.js" as="script">
</head>
Expand Down
15 changes: 10 additions & 5 deletions packages/web/src/components/buy-audio-modal/components/StripeBuyAudioButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
buyAudioSelectors,
buyAudioActions
} from '@audius/common'
import { loadStripeOnramp } from '@stripe/crypto'
import { useDispatch, useSelector } from 'react-redux'

import { useModalState } from 'common/hooks/useModalState'
Expand All @@ -28,10 +29,6 @@ const {
const STRIPE_PUBLISHABLE_KEY =
process.env.REACT_APP_STRIPE_CLIENT_PUBLISHABLE_KEY

// TODO: Replace this with Stripe npm package when available
// @ts-ignore
const StripeOnRamp = window.StripeOnramp

const messages = {
belowThreshold: 'Link by Stripe requires a purchase minimum of $1 USD'
}
Expand Down Expand Up @@ -73,7 +70,15 @@ export const StripeBuyAudioButton = () => {
amount,
destinationWallet: (await getRootSolanaAccount()).publicKey.toString()
})
const stripeOnRampInstance = StripeOnRamp(STRIPE_PUBLISHABLE_KEY)
if (!STRIPE_PUBLISHABLE_KEY) {
throw new Error('Stripe publishable key not found')
}
const stripeOnRampInstance = await loadStripeOnramp(
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Function was already async and using an await so I wouldn't sweat it.

Just worth noting that event handlers aren't going to block on async functions. If I understand correctly, most of this code is going to run after the click handler has had a chance to finish it's capture/bubble cycle and return back to React.

STRIPE_PUBLISHABLE_KEY
)
if (!stripeOnRampInstance) {
throw new Error('Stripe onramp instance not found')
}
const session = stripeOnRampInstance.createSession({
clientSecret: res.client_secret
})
Expand Down