From f2627c6e4887b52e231b30ac4def0c8a0555279c Mon Sep 17 00:00:00 2001 From: mkue Date: Sun, 11 Aug 2024 11:33:35 +0200 Subject: [PATCH] feature(website): update video and mobile illustration sections on new landing page --- shared/src/stripe/StripeEventHandler.ts | 3 +- .../[region]/v2/(home)/(assets)/mobiles.tsx | 460 ++++++++++++++++++ .../v2/(home)/(sections)/explainer-video.tsx | 29 +- .../(home)/(sections)/mobile-illustration.tsx | 28 +- .../app/[lang]/[region]/v2/(home)/page.tsx | 5 +- .../src/app/api/user/link-auth-user/route.ts | 19 - 6 files changed, 490 insertions(+), 54 deletions(-) create mode 100644 website/src/app/[lang]/[region]/v2/(home)/(assets)/mobiles.tsx delete mode 100644 website/src/app/api/user/link-auth-user/route.ts diff --git a/shared/src/stripe/StripeEventHandler.ts b/shared/src/stripe/StripeEventHandler.ts index da055fa8d..b5a802a44 100644 --- a/shared/src/stripe/StripeEventHandler.ts +++ b/shared/src/stripe/StripeEventHandler.ts @@ -64,7 +64,7 @@ export class StripeEventHandler { }; /** - * Try to find an existing user using create a new on. + * Try to find an existing user using create a new one. */ getOrCreateFirestoreUser = async (customer: Stripe.Customer): Promise> => { const userDoc = await this.findFirestoreUser(customer); @@ -177,7 +177,6 @@ export class StripeEventHandler { /** * Extracts information out of the stripe charge to build a User. - * This is mainly for failed payments where we didn't create a user through the website directly */ constructUser = (customer: Stripe.Customer): User => { if (!customer.id || !customer.email) { diff --git a/website/src/app/[lang]/[region]/v2/(home)/(assets)/mobiles.tsx b/website/src/app/[lang]/[region]/v2/(home)/(assets)/mobiles.tsx new file mode 100644 index 000000000..272fc8bc2 --- /dev/null +++ b/website/src/app/[lang]/[region]/v2/(home)/(assets)/mobiles.tsx @@ -0,0 +1,460 @@ +export function Mobiles() { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +} diff --git a/website/src/app/[lang]/[region]/v2/(home)/(sections)/explainer-video.tsx b/website/src/app/[lang]/[region]/v2/(home)/(sections)/explainer-video.tsx index 647c7679b..137481eb5 100644 --- a/website/src/app/[lang]/[region]/v2/(home)/(sections)/explainer-video.tsx +++ b/website/src/app/[lang]/[region]/v2/(home)/(sections)/explainer-video.tsx @@ -11,23 +11,20 @@ export async function ExplainerVideo({ lang, region }: DefaultParams) { }); return ( - -
-
- {translator.t<{ text: string; color?: FontColor }[]>('section-4.title-1').map((title, index) => ( - - {title.text} - {index ? '' :
} - - ))} -
-
- -
- - {translator.t('section-4.cta')} - + + + {translator.t<{ text: string; color?: FontColor }[]>('section-4.title-1').map((title, index) => ( + + {title.text} + + ))} + +
+
+ + {translator.t('section-4.cta')} + ); } diff --git a/website/src/app/[lang]/[region]/v2/(home)/(sections)/mobile-illustration.tsx b/website/src/app/[lang]/[region]/v2/(home)/(sections)/mobile-illustration.tsx index 8a4b15841..284cd9ab6 100644 --- a/website/src/app/[lang]/[region]/v2/(home)/(sections)/mobile-illustration.tsx +++ b/website/src/app/[lang]/[region]/v2/(home)/(sections)/mobile-illustration.tsx @@ -1,6 +1,6 @@ import { DefaultParams } from '@/app/[lang]/[region]'; import { Translator } from '@socialincome/shared/src/utils/i18n'; -import { BaseContainer, Typography } from '@socialincome/ui'; +import { Typography } from '@socialincome/ui'; import { FontColor } from '@socialincome/ui/src/interfaces/color'; import Image from 'next/image'; import MobilesImg from '../(assets)/mobilesImgData.png'; @@ -12,19 +12,19 @@ export async function MobileIllustration({ lang, region }: DefaultParams) { }); return ( - -
-
- {translator.t<{ text: string; color?: FontColor }[]>('section-5.title-1').map((title, index) => ( - - {title.text} -
- - ))} -
- {translator.t('section-5.subtitle-1')} - Mobiles photo +
+ + {translator.t<{ text: string; color?: FontColor }[]>('section-5.title-1').map((title, index) => ( + + {title.text} +
+ + ))} + + {translator.t('section-5.subtitle-1')} +
+ Mobiles photo
- +
); } diff --git a/website/src/app/[lang]/[region]/v2/(home)/page.tsx b/website/src/app/[lang]/[region]/v2/(home)/page.tsx index f173424e9..17313b5f0 100644 --- a/website/src/app/[lang]/[region]/v2/(home)/page.tsx +++ b/website/src/app/[lang]/[region]/v2/(home)/page.tsx @@ -12,7 +12,7 @@ export default async function Page({ params: { lang, region } }: DefaultPageProp namespaces: ['website-(home)', 'website-videos'], }); return ( -
+ <> @@ -25,7 +25,6 @@ export default async function Page({ params: { lang, region } }: DefaultPageProp {/**/} {/**/} {/**/} -
-
+ ); } diff --git a/website/src/app/api/user/link-auth-user/route.ts b/website/src/app/api/user/link-auth-user/route.ts deleted file mode 100644 index 14460ea22..000000000 --- a/website/src/app/api/user/link-auth-user/route.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { firestoreAdmin } from '@/firebase-admin'; -import { StripeEventHandler } from '@socialincome/shared/src/stripe/StripeEventHandler'; -import { LanguageCode } from '@socialincome/shared/src/types/language'; - -export type LinkAuthUserData = { - stripeCheckoutSessionId: string; - authUserId: string; - language: LanguageCode; -}; - -type LinkAuthUserRequest = { json(): Promise } & Request; - -export async function POST(request: LinkAuthUserRequest) { - const { authUserId, stripeCheckoutSessionId, language } = await request.json(); - const stripeEventHandler = new StripeEventHandler(process.env.STRIPE_SECRET_KEY!, firestoreAdmin); - - await stripeEventHandler.updateUser(stripeCheckoutSessionId, { auth_user_id: authUserId, language }); - return new Response(null, { status: 200 }); -}