reels

src/contexts/BillboardFormContext.tsx

@@ -4,6 +4,7 @@ import { IFeature, Service } from "@/types/types";
 import { createContext, useContext, useEffect, useState } from "react";
 
 interface BillboardFormData {
+  countryId: string | null;
   stateId: string | null;
   cityId: string | null;
   categoryId: string;
@@ -27,6 +28,7 @@ interface BillboardFormData {
 }
 
 const initialFormData: BillboardFormData = {
+  countryId: "",
   stateId: "",
   cityId: "",
   categoryId: "",

src/contexts/LanguageProvider.tsx

@@ -11,6 +11,7 @@ import {
 import { useTranslation } from "react-i18next";
 import "@/lib/i18n";
 import {
+  DEFAULT_LANGUAGE,
   getDirection,
   type AppLanguage,
 } from "@/lib/i18n/registry";
@@ -33,9 +34,11 @@ const LanguageContext = createContext<LanguageContextValue | null>(null);
 
 export function LanguageProvider({ children }: { children: React.ReactNode }) {
   const { i18n } = useTranslation();
-  const [language, setLanguageState] = useState<AppLanguage>(() => {
-    return readStoredLanguagePreference() ?? resolveBrowserLanguage();
-  });
+  // Always start at the deterministic default on both server and the first client
+  // render pass — reading cookies/localStorage/navigator here would differ between
+  // SSR (no window) and hydration (window present), causing a hydration mismatch.
+  // The real preference is resolved client-side in the effect below instead.
+  const [language, setLanguageState] = useState<AppLanguage>(DEFAULT_LANGUAGE);
   const [ready, setReady] = useState(false);
 
   useEffect(() => {

src/contexts/ProjectFormContext.tsx

@@ -27,6 +27,7 @@ export interface ProjectFormData {
   ageMin: string;
   ageMax: string;
   publicType: string;
+  countryId: string;
   stateId: string;
   cityId: string;
   neighborhood: string;
@@ -57,6 +58,7 @@ export const initialProjectFormData: ProjectFormData = {
   ageMin: "",
   ageMax: "",
   publicType: "",
+  countryId: "",
   stateId: "",
   cityId: "",
   neighborhood: "",