({
+ resolver: zodResolver(formSchema),
+ defaultValues: { email: '' },
+ });
+
+ const onSubmit = async (values: FormSchema) => {
+ const body: CreateNewsletterSubscription = { email: values.email, language: lang as any };
+ api.post('/api/newsletter/subscription/public', body).then((response) => {
+ if (response.status === 200) {
+ toast.dismiss(t.id);
+ toast.success(translations.toastSuccess);
+ } else {
+ toast.error(translations.toastFailure);
+ }
+ });
+ };
+
+ return (
+
+
+ {translations.informationLabel}
+
+
+
+ );
+};
+
+type NewsletterPopupClientProps = {
+ translations: NewsletterPopupTranslations;
+} & NewsletterPopupProps;
+
+export const NewsletterPopupClient = ({ delay, lang, translations }: NewsletterPopupClientProps) => {
+ useEffect(() => {
+ toast.dismiss();
+ const timeout = setTimeout(() => {
+ toast.custom(
+ (t) => (
+ toast.dismiss(t.id)} />
+ ),
+ {
+ position: 'bottom-right',
+ duration: Infinity,
+ },
+ );
+ }, delay);
+ return () => {
+ clearTimeout(timeout);
+ };
+ }, []);
+
+ return null;
+};
diff --git a/website/src/components/newsletter-popup/newsletter-popup.tsx b/website/src/components/newsletter-popup/newsletter-popup.tsx
new file mode 100644
index 000000000..a2719de60
--- /dev/null
+++ b/website/src/components/newsletter-popup/newsletter-popup.tsx
@@ -0,0 +1,28 @@
+import { DefaultParams } from '@/app/[lang]/[region]';
+import { Translator } from '@socialincome/shared/src/utils/i18n';
+import { NewsletterPopupClient } from './newsletter-popup-client';
+
+export type NewsletterPopupProps = {
+ delay?: number; // Delay in milliseconds until the popup is shown
+} & DefaultParams;
+
+export default async function NewsletterPopup({ lang, region, delay = 0 }: NewsletterPopupProps) {
+ const translator = await Translator.getInstance({
+ language: lang,
+ namespaces: ['website-newsletter'],
+ });
+ return (
+
+ );
+}
diff --git a/website/src/components/providers/api-provider.tsx b/website/src/components/providers/api-provider.tsx
index 32f35582f..12830cd34 100644
--- a/website/src/components/providers/api-provider.tsx
+++ b/website/src/components/providers/api-provider.tsx
@@ -8,7 +8,7 @@ export const ApiProviderContext = createContext(undefined
export function ApiProvider({ children }: { children: React.ReactNode }) {
const { data: authUser } = useFirebaseUser();
- const [idToken, setIdToken] = useState();
+ const [idToken, setIdToken] = useState('');
useEffect(() => {
if (authUser) {
@@ -16,8 +16,5 @@ export function ApiProvider({ children }: { children: React.ReactNode }) {
}
}, [authUser, setIdToken]);
- if (!authUser || !idToken) {
- return;
- }
return {children};
}
diff --git a/website/src/app/context-providers.tsx b/website/src/components/providers/context-providers.tsx
similarity index 97%
rename from website/src/app/context-providers.tsx
rename to website/src/components/providers/context-providers.tsx
index e8c1c5d7d..a278cb819 100644
--- a/website/src/app/context-providers.tsx
+++ b/website/src/components/providers/context-providers.tsx
@@ -1,6 +1,7 @@
'use client';
import { CURRENCY_COOKIE, LANGUAGE_COOKIE, REGION_COOKIE } from '@/app/[lang]/[region]';
+import { ApiProvider } from '@/components/providers/api-provider';
import { FacebookTracking } from '@/components/tracking/facebook-tracking';
import { GoogleTagManager } from '@/components/tracking/google-tag-manager';
import { LinkedInTracking } from '@/components/tracking/linkedin-tracking';
@@ -211,9 +212,11 @@ export function ContextProviders({ children }: PropsWithChildren) {
return (
-
- {children}
-
+
+
+ {children}
+
+
);
diff --git a/website/src/components/ui/currency-selector.tsx b/website/src/components/ui/currency-selector.tsx
index 384602731..4b5c9e90a 100644
--- a/website/src/components/ui/currency-selector.tsx
+++ b/website/src/components/ui/currency-selector.tsx
@@ -1,7 +1,7 @@
'use client';
-import { useI18n } from '@/app/context-providers';
import { getFlagComponentByCurrency } from '@/components/country-flags';
+import { useI18n } from '@/components/providers/context-providers';
import { WebsiteCurrency } from '@/i18n';
import { isValidCurrency } from '@socialincome/shared/src/types/currency';
import {
diff --git a/website/src/hooks/useApi.ts b/website/src/hooks/useApi.ts
index f01d4de42..c482b3c3c 100644
--- a/website/src/hooks/useApi.ts
+++ b/website/src/hooks/useApi.ts
@@ -24,7 +24,7 @@ export class ApiClient {
let url: URL;
if (path.startsWith('/')) {
url = new URL(path, window.location.origin);
- url.searchParams.append('firebaseAuthToken', this.token);
+ if (this.token) url.searchParams.append('firebaseAuthToken', this.token);
} else {
url = new URL(path);
}