feat: set checkout languageCode based on user locale

- Add languageCode to checkout store state
- Add setLanguageCode action to store
- Pass languageCode when creating checkout
- Header component sets language code from useLocale hook
- Enables multi-language order confirmation emails

src/components/layout/Header.tsx

@@ -5,7 +5,7 @@ import Link from "next/link";
 import Image from "next/image";
 import { usePathname } from "next/navigation";
 import { AnimatePresence, motion } from "framer-motion";
-import { useTranslations } from "next-intl";
+import { useTranslations, useLocale } from "next-intl";
 import { useSaleorCheckoutStore } from "@/stores/saleorCheckoutStore";
 import { User, ShoppingBag, Menu, X, Globe } from "lucide-react";
 import CartDrawer from "@/components/cart/CartDrawer";
@@ -16,14 +16,15 @@ interface HeaderProps {
   locale?: string;
 }
 
-export default function Header({ locale = "sr" }: HeaderProps) {
+export default function Header({ locale: propLocale = "sr" }: HeaderProps) {
   const t = useTranslations("Header");
   const pathname = usePathname();
   const dropdownRef = useRef<HTMLDivElement>(null);
   const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
   const [scrolled, setScrolled] = useState(false);
   const [langDropdownOpen, setLangDropdownOpen] = useState(false);
-  const { getLineCount, toggleCart, initCheckout } = useSaleorCheckoutStore();
+  const { getLineCount, toggleCart, initCheckout, setLanguageCode } = useSaleorCheckoutStore();
+  const locale = useLocale();
 
   const itemCount = getLineCount();
   const currentLocale = isValidLocale(locale) ? LOCALE_CONFIG[locale] : LOCALE_CONFIG.sr;
@@ -58,6 +59,13 @@ export default function Header({ locale = "sr" }: HeaderProps) {
     initCheckout();
   }, [initCheckout]);
 
+  // Set language code for checkout based on current locale
+  useEffect(() => {
+    if (locale) {
+      setLanguageCode(locale);
+    }
+  }, [locale, setLanguageCode]);
+
   useEffect(() => {
     const handleScroll = () => {
       setScrolled(window.scrollY > 50);

src/stores/saleorCheckoutStore.ts

@@ -58,22 +58,24 @@ interface GetCheckoutResponse {
 interface SaleorCheckoutStore {
   checkout: Checkout | null;
   checkoutToken: string | null;
+  languageCode: string | null;
   isOpen: boolean;
   isLoading: boolean;
   error: string | null;
-  
+
   // Actions
   initCheckout: () => Promise<void>;
   addLine: (variantId: string, quantity: number) => Promise<void>;
   updateLine: (lineId: string, quantity: number) => Promise<void>;
   removeLine: (lineId: string) => Promise<void>;
   setEmail: (email: string) => Promise<void>;
+  setLanguageCode: (languageCode: string) => void;
   refreshCheckout: () => Promise<void>;
   toggleCart: () => void;
   openCart: () => void;
   closeCart: () => void;
   clearError: () => void;
-  
+
   // Getters
   getLineCount: () => number;
   getTotal: () => number;
@@ -85,13 +87,14 @@ export const useSaleorCheckoutStore = create<SaleorCheckoutStore>()(
     (set, get) => ({
       checkout: null,
       checkoutToken: null,
+      languageCode: null,
       isOpen: false,
       isLoading: false,
       error: null,
 
       initCheckout: async () => {
-        const { checkoutToken } = get();
-        
+        const { checkoutToken, languageCode } = get();
+
         if (checkoutToken) {
           // Try to fetch existing checkout
           try {
@@ -99,7 +102,7 @@ export const useSaleorCheckoutStore = create<SaleorCheckoutStore>()(
               query: GET_CHECKOUT,
               variables: { token: checkoutToken },
             });
-            
+
             if (data?.checkout) {
               set({ checkout: data.checkout });
               return;
@@ -108,8 +111,8 @@ export const useSaleorCheckoutStore = create<SaleorCheckoutStore>()(
             // Checkout not found or expired, create new one
           }
         }
-        
-        // Create new checkout
+
+        // Create new checkout with language code
         try {
           const { data } = await saleorClient.mutate<CheckoutCreateResponse>({
             mutation: CHECKOUT_CREATE,
@@ -117,10 +120,11 @@ export const useSaleorCheckoutStore = create<SaleorCheckoutStore>()(
               input: {
                 channel: CHANNEL,
                 lines: [],
+                languageCode: languageCode ? languageCode.toUpperCase() : undefined,
               },
             },
           });
-          
+
           if (data?.checkoutCreate?.checkout) {
             set({
               checkout: data.checkoutCreate.checkout,
@@ -294,6 +298,7 @@ export const useSaleorCheckoutStore = create<SaleorCheckoutStore>()(
       openCart: () => set({ isOpen: true }),
       closeCart: () => set({ isOpen: false }),
       clearError: () => set({ error: null }),
+      setLanguageCode: (languageCode: string) => set({ languageCode }),
 
       getLineCount: () => {
         const { checkout } = get();