From 80d4ebc4f9441065254c5e46109b5500fc507e80 Mon Sep 17 00:00:00 2001 From: Nick <33908215+NicholasG04@users.noreply.github.com> Date: Sun, 5 Jun 2022 13:40:36 +0100 Subject: [PATCH] feat: ability to disable purchases (#273) * feat: ability to disable purchases * chore: add flags secret line --- .env.local.example | 1 + .github/workflows/lint.yml | 1 + package.json | 1 + pnpm-lock.yaml | 32 ++++++++++++++++++ src/components/Checkout/CheckoutWrapper.tsx | 11 +++++-- src/components/UserPanel/NoTicket.tsx | 36 ++++++++++++++------- src/pages/_app.tsx | 4 +++ src/types/flags.ts | 3 ++ 8 files changed, 76 insertions(+), 13 deletions(-) create mode 100644 src/types/flags.ts diff --git a/.env.local.example b/.env.local.example index 114b082..36b6e2a 100644 --- a/.env.local.example +++ b/.env.local.example @@ -8,6 +8,7 @@ STRIPE_WEBHOOK_SECRET=YOUR_STRIPE_WEBHOOK_SECRET NEXT_PUBLIC_STRIPE_TERMINAL_LOCATION=YOUR_STRIPE_TERMINAL_LOCATION_ID NEXT_PUBLIC_HAPPYKIT_ANALYTICS_PUBLIC_KEY= +NEXT_PUBLIC_FLAGS_ENVIRONMENT_KEY= SENTRY_AUTH_TOKEN= diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index a58c55b..a4ff4a6 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -37,6 +37,7 @@ jobs: NEXT_PUBLIC_SUPABASE_URL: ${{ secrets.NEXT_PUBLIC_SUPABASE_URL }} NEXT_PUBLIC_SUPABASE_ANON_KEY: ${{ secrets.NEXT_PUBLIC_SUPABASE_ANON_KEY }} SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }} + NEXT_PUBLIC_FLAGS_ENVIRONMENT_KEY: ${{ secrets.NEXT_PUBLIC_FLAGS_ENVIRONMENT_KEY }} - name: Run ESLint run: pnpm run lint \ No newline at end of file diff --git a/package.json b/package.json index d52352c..036fd7e 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@emotion/react": "11.9.0", "@emotion/styled": "11.8.1", "@happykit/analytics": "1.0.1", + "@happykit/flags": "^2.0.5-perf.0", "@sendgrid/mail": "7.6.2", "@sentry/cli": "1.74.4", "@sentry/nextjs": "6.19.7", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4e233f3..bc528b4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -9,6 +9,7 @@ specifiers: '@emotion/styled': 11.8.1 '@fast-csv/parse': 4.3.6 '@happykit/analytics': 1.0.1 + '@happykit/flags': ^2.0.5-perf.0 '@next/eslint-plugin-next': 12.1.6 '@sendgrid/mail': 7.6.2 '@sentry/cli': 1.74.4 @@ -61,6 +62,7 @@ dependencies: '@emotion/react': 11.9.0_d28441a8be41759546f0f99cc164e5ce '@emotion/styled': 11.8.1_25785ff73a5cbea4cb033ce870e20f07 '@happykit/analytics': 1.0.1_next@12.1.6+react@18.0.0 + '@happykit/flags': 2.0.5-perf.0_next@12.1.6+react@18.0.0 '@sendgrid/mail': 7.6.2 '@sentry/cli': 1.74.4 '@sentry/nextjs': 6.19.7_next@12.1.6+react@18.0.0 @@ -2256,6 +2258,18 @@ packages: react: 18.0.0 dev: false + /@happykit/flags/2.0.5-perf.0_next@12.1.6+react@18.0.0: + resolution: {integrity: sha512-bpur3OFrYBy9O0DsoMgmpTUVductONKgiMLneSd41mD3nkN4ONsd64T85uFjnDwObdbPPTjiuRyDaHNjCRwABQ==} + peerDependencies: + next: '>=12.0.2' + react: '>=16.13.1' + dependencies: + abort-controller: 3.0.0 + nanoid: 3.2.0 + next: 12.1.6_572108936dbf4157100a77328045f809 + react: 18.0.0 + dev: false + /@humanwhocodes/config-array/0.9.3: resolution: {integrity: sha512-3xSMlXHh03hCcCmFc0rbKp3Ivt2PFEJnQUJDDMTJQ2wkECZWdq4GePs2ctc5H8zV+cHPaq8k2vU8mrQjA6iHdQ==} engines: {node: '>=10.10.0'} @@ -3108,6 +3122,13 @@ packages: dev: false optional: true + /abort-controller/3.0.0: + resolution: {integrity: sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==} + engines: {node: '>=6.5'} + dependencies: + event-target-shim: 5.0.1 + dev: false + /acorn-jsx/5.3.2_acorn@8.7.1: resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} peerDependencies: @@ -4149,6 +4170,11 @@ packages: resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==} engines: {node: '>=0.10.0'} + /event-target-shim/5.0.1: + resolution: {integrity: sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==} + engines: {node: '>=6'} + dev: false + /ext/1.6.0: resolution: {integrity: sha512-sdBImtzkq2HpkdRLtlLWDa6w4DX22ijZLKx8BMPUuKe1c5lbN6xwQDQCxSfxBQnHZ13ls/FH0MQZx/q/gr6FQg==} dependencies: @@ -5309,6 +5335,12 @@ packages: /ms/2.1.3: resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} + /nanoid/3.2.0: + resolution: {integrity: sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==} + engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} + hasBin: true + dev: false + /nanoid/3.3.0: resolution: {integrity: sha512-JzxqqT5u/x+/KOFSd7JP15DOo9nOoHpx6DYatqIHUW2+flybkm+mdcraotSQR5WcnZr+qhGVh8Ted0KdfSMxlg==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} diff --git a/src/components/Checkout/CheckoutWrapper.tsx b/src/components/Checkout/CheckoutWrapper.tsx index 4a65b6b..ea0a00e 100644 --- a/src/components/Checkout/CheckoutWrapper.tsx +++ b/src/components/Checkout/CheckoutWrapper.tsx @@ -1,12 +1,19 @@ -import { Spinner } from '@chakra-ui/react'; +import { Spinner, Text } from '@chakra-ui/react'; import { usePaymentIntent } from 'util/stripeHelpers'; import { Elements } from '@stripe/react-stripe-js'; import { getStripe } from 'util/getStripe'; import CheckoutForm from './CheckoutForm'; -const CheckoutWrapper: React.FC = () => { +interface Props { + purchasesEnabled: boolean; +} + +const CheckoutWrapper: React.FC = ({ purchasesEnabled }) => { const stripe = getStripe(); const clientSecret = usePaymentIntent(); + if (purchasesEnabled === false) { + return Sorry - purchases are disabled.; + } const appearance = { theme: 'stripe', diff --git a/src/components/UserPanel/NoTicket.tsx b/src/components/UserPanel/NoTicket.tsx index e8df7e6..a676f37 100644 --- a/src/components/UserPanel/NoTicket.tsx +++ b/src/components/UserPanel/NoTicket.tsx @@ -2,19 +2,33 @@ import { Flex, Heading, Text, } from '@chakra-ui/react'; import CheckoutWrapper from 'components/Checkout/CheckoutWrapper'; +import type { Flags } from 'types/flags'; +import { useFlags } from '@happykit/flags/client'; +import { useUser } from '@supabase/supabase-auth-helpers/react'; import MoreInfo from './MoreInfo'; -const NoTicket: React.FC = () => ( - - Buy your ticket for £{(parseInt(process.env.NEXT_PUBLIC_TICKET_PRICE, 10) / 100).toFixed(2)} - - - - - More information - +const NoTicket: React.FC = () => { + const { user } = useUser(); + const { flags } = useFlags({ + user: { + key: user.id, + email: user.email, + name: user.user_metadata.proper_name, + }, + }); + const purchasesEnabled = flags?.purchases_enabled; + return ( + + Buy your ticket for £{(parseInt(process.env.NEXT_PUBLIC_TICKET_PRICE, 10) / 100).toFixed(2)} + + + + + More information + - -); + + ); +}; export default NoTicket; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index c4d0d18..62e9365 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -5,11 +5,15 @@ import { DefaultSeo } from 'next-seo'; import { supabaseClient } from '@supabase/supabase-auth-helpers/nextjs'; import { UserProvider } from '@supabase/supabase-auth-helpers/react'; import { useAnalytics } from '@happykit/analytics'; +import { configure } from '@happykit/flags/config'; import { TicketContextProvider } from 'util/ticketContext'; import theme from '../util/theme'; const App: NextPage = ({ Component, pageProps }) => { useAnalytics({ publicKey: process.env.NEXT_PUBLIC_HAPPYKIT_ANALYTICS_PUBLIC_KEY }); + configure({ + envKey: process.env.NEXT_PUBLIC_FLAGS_ENVIRONMENT_KEY, + }); return ( diff --git a/src/types/flags.ts b/src/types/flags.ts new file mode 100644 index 0000000..cbe9ced --- /dev/null +++ b/src/types/flags.ts @@ -0,0 +1,3 @@ +export type Flags = { + purchases_enabled: boolean; +};