diff --git a/shared/locales/de/website-common.json b/shared/locales/de/website-common.json index f705e0f18..553872d22 100644 --- a/shared/locales/de/website-common.json +++ b/shared/locales/de/website-common.json @@ -30,7 +30,8 @@ "footer": { "follow-us": "Folge uns", "resources": "Informationen", - "legal": "Rechtliches" + "legal": "Rechtliches", + "newsletter": "Newsletter" }, "cookie-consent-banner": { "text": "Dürfen wir Cookies benützen um den Traffic und die Leistung unserer Website zu analysieren? Wir sammeln niemals persönliche Daten. Datenschutzrichtlinie.", diff --git a/shared/locales/de/website-newsletter.json b/shared/locales/de/website-newsletter.json index 83e4bff7b..c81aaab0d 100644 --- a/shared/locales/de/website-newsletter.json +++ b/shared/locales/de/website-newsletter.json @@ -1,29 +1,29 @@ { "metadata": { - "title": "Datenschutzrichtlinie | Social Income" + "title": "Newsletter | Social Income" }, "updates": { - "alert-title": "Social Income Newsletter", - "alert-description": "Melde dich an, um bei allen Thema rund um Social Income auf dem neusten Stand zu sein.", + "title": "Bleib informiert", + "description-1": "Erhalte News zu Social Income, plus:", + "bullet-1": "Stories von Empfänger:innen", + "bullet-2": "Neue Forschung zu Direktzahlungen", + "bullet-3": "Berichterstattung rund um das BGE", + "description-2": "Wird an jedem Monatsende versendet.", + "description-3": "Newsletters verfasst von", + "author-name": "Aurélie Schmiedlin", + "author-city": "Genf", + "form-title": "Newsletter abonnieren", "firstname": "Vorname", - "lastname": "Nachname", - "gender": "Geschlecht", "email": "E-Mail", - "street": "Strasse", - "street-number": "Nummer", - "city": "Ort", - "zip": "PLZ", - "country": "Land", - "language": "Kommunikationssprache", - "submit-button": "Beim Newsletter anmelden", + "submit-button": "Anmelden", "newsletter-updated-toast": "Du wurdest zum Newsletter hinzugefügt", "newsletter-error-toast": "Du konntest leider nicht zum Newsletter hinzugefügt werden" }, "popup": { - "information-label": "Melde dich für unseren Newsletter an und werde Teil der Social Income Community!", + "information-label": "Erhalte monatliche Updates über Social Income, BGE und Direktzahlungen.", "toast-success": "Danke für das Abonnieren des Social Income Newsletters!", "toast-failure": "Oops! Etwas ist schief gelaufen. Bitte versuche es nochmals, oder kontaktiere uns auf hello@socialincome.org", "email-placeholder": "Deine E-Mail Adresse", - "button-subscribe": "Abonnieren" + "button-subscribe": "Newsletter abonnieren" } } diff --git a/shared/locales/en/website-common.json b/shared/locales/en/website-common.json index eafac3160..94423473a 100644 --- a/shared/locales/en/website-common.json +++ b/shared/locales/en/website-common.json @@ -30,7 +30,8 @@ "footer": { "follow-us": "Follow Us", "resources": "Resources", - "legal": "Legal" + "legal": "Legal", + "newsletter": "Newsletter" }, "cookie-consent-banner": { "text": "Do you allow us to use cookies for analyzing our website traffic and performance? We never collect any personal data. Privacy Policy.", diff --git a/shared/locales/en/website-newsletter.json b/shared/locales/en/website-newsletter.json index ed3172900..df99ff88a 100644 --- a/shared/locales/en/website-newsletter.json +++ b/shared/locales/en/website-newsletter.json @@ -1,29 +1,29 @@ { "metadata": { - "title": "Datenschutzrichtlinie | Social Income" + "title": "Newsletter | Social Income" }, "updates": { - "alert-title": "Social Income Newsletter", - "alert-description": "Sign up to stay up to date on all things of Social Income.", + "title": "Stay Informed", + "description-1": "Receive updates on Social Income, plus:", + "bullet-1": "Engaging stories from our recipients", + "bullet-2": "New research on direct cash transfers", + "bullet-3": "Summaries of the latest news around UBI", + "description-2": "Sent at the end month of each month.", + "description-3": "Newsletters written by", + "author-name": "Aurélie Schmiedlin", + "author-city": "Geneva", + "form-title": "Subscribe to our newsletter", "firstname": "First Name", - "lastname": "Last Name", - "gender": "Gender", "email": "Email", - "street": "Street", - "street-number": "Number", - "city": "City", - "zip": "Zip", - "country": "Country", - "language": "Communication language", - "submit-button": "Subscribe to newsletter", + "submit-button": "Subscribe now", "newsletter-updated-toast": "You have been added to the newsletter", "newsletter-error-toast": "We weren't able to add you to our newsletter" }, "popup": { - "information-label": "Join our newsletter and become part of the Social Income Community!", + "information-label": "Our monthly newsletter updates you on Social Income, UBI and Direct Cash Transfers.", "toast-success": "Thank you for subscribing to our newsletter!", "toast-failure": "Something went wrong. Try again or contact us at hello@socialincome.org", "email-placeholder": "Your email", - "button-subscribe": "Subscribe" + "button-subscribe": "Subscribe now" } } diff --git a/shared/src/mailchimp/MailchimpAPI.ts b/shared/src/mailchimp/MailchimpAPI.ts index 5df44b0ee..f8dc2f085 100644 --- a/shared/src/mailchimp/MailchimpAPI.ts +++ b/shared/src/mailchimp/MailchimpAPI.ts @@ -8,6 +8,7 @@ export type NewsletterSubscriptionData = { firstname?: string; lastname?: string; country?: CountryCode; + source?: 'contributor' | 'subscriber'; }; export class MailchimpAPI { @@ -39,6 +40,7 @@ export class MailchimpAPI { LNAME: data.lastname ?? '', COUNTRY: data.country ?? '', LANGUAGE: data.language === 'de' ? 'German' : 'English', + SOURCE: data.source ?? 'subscriber', }, }); } @@ -53,6 +55,7 @@ export class MailchimpAPI { LNAME: data.lastname ?? '', COUNTRY: data.country ?? '', LANGUAGE: data.language === 'de' ? 'German' : 'English', + SOURCE: data.source ?? 'subscriber', }, }); }; diff --git a/website/src/app/[lang]/[region]/(website)/newsletter/page.tsx b/website/src/app/[lang]/[region]/(website)/newsletter/page.tsx index 0f90ac73e..c31cfe4d1 100644 --- a/website/src/app/[lang]/[region]/(website)/newsletter/page.tsx +++ b/website/src/app/[lang]/[region]/(website)/newsletter/page.tsx @@ -1,8 +1,15 @@ import { DefaultPageProps } from '@/app/[lang]/[region]'; import { SubscriptionInfoForm } from '@/app/[lang]/[region]/(website)/newsletter/subscription-info-form'; - +import { getMetadata } from '@/metadata'; import { Translator } from '@socialincome/shared/src/utils/i18n'; -import { Alert, AlertDescription, AlertTitle } from '@socialincome/ui'; +import { BaseContainer, Typography } from '@socialincome/ui'; +import Image from 'next/image'; +import Link from 'next/link'; +import aurelieImage from '../about-us/(assets)/aurelie.jpeg'; + +export async function generateMetadata({ params }: DefaultPageProps) { + return getMetadata(params.lang, 'website-newsletter'); +} export default async function Page({ params }: DefaultPageProps) { const translator = await Translator.getInstance({ @@ -11,25 +18,63 @@ export default async function Page({ params }: DefaultPageProps) { }); return ( -
- - {translator.t('updates.alert-title')} - {translator.t('updates.alert-description')} - - -
+ +
+
+ + {translator.t('updates.title')} + +
+ {translator.t('updates.description-1')} +
+
    +
  • + {translator.t('updates.bullet-1')} +
    • +
  • + {translator.t('updates.bullet-2')} +
    • +
  • + {translator.t('updates.bullet-3')} +
    • +
+
+ {translator.t('updates.description-2')} +
+ {translator.t('updates.description-3')} + + Avatar + + {translator.t('updates.author-name')}, {translator.t('updates.author-city')} + + +
+
+
+
+ + {translator.t('updates.form-title')} + + +
+
+
+ ); } diff --git a/website/src/app/[lang]/[region]/(website)/newsletter/subscription-info-form.tsx b/website/src/app/[lang]/[region]/(website)/newsletter/subscription-info-form.tsx index e15b46c95..f6b707b13 100644 --- a/website/src/app/[lang]/[region]/(website)/newsletter/subscription-info-form.tsx +++ b/website/src/app/[lang]/[region]/(website)/newsletter/subscription-info-form.tsx @@ -2,26 +2,9 @@ import { DefaultParams } from '@/app/[lang]/[region]'; import { useApi } from '@/hooks/useApi'; -import { useTranslator } from '@/hooks/useTranslator'; import { zodResolver } from '@hookform/resolvers/zod'; import { NewsletterSubscriptionData } from '@socialincome/shared/src/mailchimp/MailchimpAPI'; -import { COUNTRY_CODES } from '@socialincome/shared/src/types/country'; -import { - Button, - Form, - FormControl, - FormField, - FormItem, - FormLabel, - FormMessage, - Input, - Select, - SelectContent, - SelectGroup, - SelectItem, - SelectTrigger, - SelectValue, -} from '@socialincome/ui'; +import { Button, Form, FormControl, FormField, FormItem, FormLabel, FormMessage, Input } from '@socialincome/ui'; import { useForm } from 'react-hook-form'; import toast from 'react-hot-toast'; import * as z from 'zod'; @@ -29,10 +12,7 @@ import * as z from 'zod'; type PersonalInfoFormProps = { translations: { firstname: string; - lastname: string; email: string; - country: string; - language: string; updatesSubmitButton: string; toastMessage: string; toastErrorMessage: string; @@ -40,16 +20,11 @@ type PersonalInfoFormProps = { } & DefaultParams; export function SubscriptionInfoForm({ lang, translations }: PersonalInfoFormProps) { - const commonTranslator = useTranslator(lang, 'common'); - const countryTranslator = useTranslator(lang, 'countries'); const api = useApi(); const formSchema = z.object({ firstname: z.string(), - lastname: z.string(), email: z.string().email(), - country: z.enum(['', ...COUNTRY_CODES]).optional(), - language: z.enum(['en', 'de']), }); type FormSchema = z.infer; @@ -57,20 +32,15 @@ export function SubscriptionInfoForm({ lang, translations }: PersonalInfoFormPro resolver: zodResolver(formSchema), defaultValues: { firstname: '', - lastname: '', email: '', - country: '' as any, - language: '' as any, }, }); const onSubmit = async (values: FormSchema) => { const data: NewsletterSubscriptionData = { firstname: values.firstname, - lastname: values.lastname, email: values.email, - country: values.country as any, - language: values.language, + language: lang === 'de' ? 'de' : 'en', status: 'subscribed', }; @@ -85,28 +55,15 @@ export function SubscriptionInfoForm({ lang, translations }: PersonalInfoFormPro return (
- + ( - {translations.firstname} + {translations.firstname} - - - - - )} - /> - ( - - {translations.lastname} - - + @@ -117,63 +74,21 @@ export function SubscriptionInfoForm({ lang, translations }: PersonalInfoFormPro name="email" render={({ field }) => ( - {translations.email} + {translations.email} - + )} /> - ( - - {translations.country} - - - - )} - /> - ( - - {translations.language} - - - - )} - /> - - diff --git a/website/src/app/api/newsletter/subscription/route.ts b/website/src/app/api/newsletter/subscription/route.ts index 8d80c4817..694e14f61 100644 --- a/website/src/app/api/newsletter/subscription/route.ts +++ b/website/src/app/api/newsletter/subscription/route.ts @@ -19,7 +19,9 @@ export async function GET(request: Request) { /** * Upsert Mailchimp subscription */ -type NewsletterSubscriptionUpdateRequest = { json(): Promise<{ status: 'subscribed' | 'unsubscribed' }> } & Request; +type NewsletterSubscriptionUpdateRequest = { + json(): Promise<{ status: 'subscribed' | 'unsubscribed'; source: 'subscriber' | 'contributor' }>; +} & Request; export async function POST(request: NewsletterSubscriptionUpdateRequest) { try { const userDoc = await authorizeRequest(request); diff --git a/website/src/components/footer/footer.tsx b/website/src/components/footer/footer.tsx index 039ece209..a2af48eef 100644 --- a/website/src/components/footer/footer.tsx +++ b/website/src/components/footer/footer.tsx @@ -3,7 +3,7 @@ import { FooterClient } from '@/components/footer/footer-client'; import { SILogo } from '@/components/logos/si-logo'; import { WebsiteLanguage, websiteRegions } from '@/i18n'; import { DocumentTextIcon, InformationCircleIcon, UserCircleIcon } from '@heroicons/react/24/solid'; -import { SiFacebook, SiGithub, SiInstagram, SiLinkedin, SiX } from '@icons-pack/react-simple-icons'; +import { SiFacebook, SiGithub, SiInstagram, SiLinkedin, SiMaildotru, SiX } from '@icons-pack/react-simple-icons'; import { Translator } from '@socialincome/shared/src/utils/i18n'; import { BaseContainer, Typography } from '@socialincome/ui'; import Link from 'next/link'; @@ -85,6 +85,11 @@ export default async function Footer({ lang, region }: DefaultParams) { url="https://github.com/socialincome-san/public" target="_blank" /> +
diff --git a/website/src/components/newsletter-popup/newsletter-popup-client.tsx b/website/src/components/newsletter-popup/newsletter-popup-client.tsx index ad32ddd58..c58751ee0 100644 --- a/website/src/components/newsletter-popup/newsletter-popup-client.tsx +++ b/website/src/components/newsletter-popup/newsletter-popup-client.tsx @@ -38,7 +38,7 @@ const NewsletterPopupToast = ({ lang, translations, t, onClose }: NewsletterPopu }); const onSubmit = async (values: FormSchema) => { - const body: CreateNewsletterSubscription = { email: values.email, language: lang as any }; + const body: CreateNewsletterSubscription = { email: values.email, language: lang as any, source: 'subscriber' }; api.post('/api/newsletter/subscription/public', body).then((response) => { if (response.status === 200) { toast.dismiss(t.id);