33 / Pay annual subscription by PayPal (#68)

* Refactors paypal-buttons -> paypal-product-buttons WebComponent

* Pulls out address to data file

* Defines annual subscription prices data hash

* Styles paypal-product-buttons

* Styles <address>

* Details have cursor:pointer on the summary

* Moves Jyne section to separate page

* Rewrites payment options using details components

* Reworks translation typing

* Defines MembershipType enum

* Adds translations for MembershipType enum

* Can pay annual subs by PayPal

* Styles tables better

1 files changed, 26 insertions, 0 deletions

diff --git a/src/components/PaypalProductButtons.astro b/src/components/PaypalProductButtons.astro
new file mode 100644
index 0000000..0ebbd3f
--- /dev/null
+++ b/src/components/PaypalProductButtons.astro
@@ -0,0 +1,26 @@
+---
+import env from '$lib/env';
+import type Price from '$types/Price';
+
+interface Props {
+  successPageUrl: string;
+  productDescription: string;
+  shortDescription: string;
+  totalPrice: Price;
+}
+
+const { successPageUrl, productDescription, shortDescription, totalPrice } = Astro.props;
+
+const PAYPAL_CLIENT_ID =
+  env.ENVIRONMENT === 'prod' ? env.PAYPAL_LIVE_CLIENT_ID : env.PAYPAL_SANDBOX_CLIENT_ID;
+---
+
+<paypal-product-buttons
+  paypal-client-id={PAYPAL_CLIENT_ID}
+  success-page-url={successPageUrl}
+  product-description={productDescription}
+  short-description={shortDescription}
+  total-price={totalPrice}
+>
+  Loading PayPal buttons…
+</paypal-product-buttons>