From ecfaff6bbd118526b380adb655ecde803e4629eb Mon Sep 17 00:00:00 2001 From: Atash03 Date: Mon, 6 Apr 2026 19:25:53 +0500 Subject: [PATCH] refactor: centralize Accept-Language header via axios interceptor Add a request interceptor to the axios instance that automatically sets the Accept-Language header from the Zustand language store, ensuring all requests (including POST) send the locale. Remove redundant lang params from service functions and hooks, and refactor B2B form to use the shared service layer instead of raw axios with a hardcoded URL. --- src/components/shared/forms/b2b-form.tsx | 14 +-- src/components/shared/home/home-news.tsx | 2 +- src/hooks/tanstack/use-contacts.ts | 2 +- src/hooks/tanstack/use-designers.ts | 2 +- src/hooks/tanstack/use-exhibition-time.ts | 2 +- src/hooks/tanstack/use-home-contacts.ts | 2 +- src/hooks/tanstack/use-industries.ts | 2 +- src/hooks/tanstack/use-news-inner.ts | 7 +- src/hooks/tanstack/use-news.ts | 7 +- src/hooks/tanstack/use-participants.ts | 2 +- src/hooks/tanstack/use-partners.ts | 2 +- src/hooks/tanstack/use-sponsors.ts | 2 +- src/hooks/tanstack/use-static-words.ts | 2 +- src/hooks/tanstack/use-stats.ts | 2 +- src/pages/news-inner.tsx | 4 +- src/pages/news.tsx | 2 +- src/services/service.ts | 104 +++++++--------------- 17 files changed, 58 insertions(+), 102 deletions(-) diff --git a/src/components/shared/forms/b2b-form.tsx b/src/components/shared/forms/b2b-form.tsx index f687c13..61b61a3 100644 --- a/src/components/shared/forms/b2b-form.tsx +++ b/src/components/shared/forms/b2b-form.tsx @@ -2,12 +2,12 @@ import { AnimatePresence } from "motion/react"; import { FC, useMemo } from "react"; import { useForm } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; -import axios from "axios"; import { defaultValuesOfB2b, createFormSchema, FormType, } from "@/lib/get-b2b-form-details"; +import { postB2b } from "@/services/service"; import { Form } from "@/components/ui/form"; import { FormSuccesStatus } from "../form-succes-status"; import { Stage1, Stage2, Stage3 } from "../b2b"; @@ -96,17 +96,9 @@ export const B2bForm: FC = ({ } }); - const res = await axios.post( - "https://turkmentextile.turkmenexpo.com/app/api/v1/form", - formData, - { - headers: { - "Content-Type": "multipart/form-data", - }, - } - ); + const success = await postB2b(formData); - if (res.status === 201) { + if (success) { setSuccess(true); } } catch (error) { diff --git a/src/components/shared/home/home-news.tsx b/src/components/shared/home/home-news.tsx index 3fb1719..388a77e 100644 --- a/src/components/shared/home/home-news.tsx +++ b/src/components/shared/home/home-news.tsx @@ -9,7 +9,7 @@ import { Container } from "@/components/layout"; export const HomeNews: FC = () => { const lang = useLangStore((state) => state.lang); - const { data, isPending } = useNews(lang); + const { data, isPending } = useNews(); if (isPending) return ; diff --git a/src/hooks/tanstack/use-contacts.ts b/src/hooks/tanstack/use-contacts.ts index f32aa23..0e1edd4 100644 --- a/src/hooks/tanstack/use-contacts.ts +++ b/src/hooks/tanstack/use-contacts.ts @@ -7,7 +7,7 @@ export const useContacts = () => { const { data, isPending } = useQuery({ queryKey: ["contacts", lang], - queryFn: () => getContacts(lang), + queryFn: () => getContacts(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-designers.ts b/src/hooks/tanstack/use-designers.ts index fa59145..c1cfe33 100644 --- a/src/hooks/tanstack/use-designers.ts +++ b/src/hooks/tanstack/use-designers.ts @@ -7,7 +7,7 @@ export const useDesigners = (id: number) => { const { data, isPending } = useQuery({ queryKey: ["designers", lang], - queryFn: () => getDesigners(lang, id), + queryFn: () => getDesigners(id), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-exhibition-time.ts b/src/hooks/tanstack/use-exhibition-time.ts index 3ecbccc..d8b3985 100644 --- a/src/hooks/tanstack/use-exhibition-time.ts +++ b/src/hooks/tanstack/use-exhibition-time.ts @@ -20,7 +20,7 @@ export const useExhibitionTime = () => { const { data, isPending } = useQuery({ queryKey: ["exhibiton-time", lang], - queryFn: () => getExhibitionTime(lang), + queryFn: () => getExhibitionTime(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-home-contacts.ts b/src/hooks/tanstack/use-home-contacts.ts index 02f1c98..ff22c62 100644 --- a/src/hooks/tanstack/use-home-contacts.ts +++ b/src/hooks/tanstack/use-home-contacts.ts @@ -7,7 +7,7 @@ export const useHomeContacts = () => { const { data, isPending } = useQuery({ queryKey: ["home-contacts", lang], - queryFn: () => getHomeContacts(lang), + queryFn: () => getHomeContacts(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-industries.ts b/src/hooks/tanstack/use-industries.ts index 0389c9a..536fec4 100644 --- a/src/hooks/tanstack/use-industries.ts +++ b/src/hooks/tanstack/use-industries.ts @@ -24,7 +24,7 @@ export const useIndustries = () => { const { data, isPending } = useQuery({ queryKey: ["industries", lang], - queryFn: () => getIndustries(lang), + queryFn: () => getIndustries(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-news-inner.ts b/src/hooks/tanstack/use-news-inner.ts index 8f91dbe..e8d9dad 100644 --- a/src/hooks/tanstack/use-news-inner.ts +++ b/src/hooks/tanstack/use-news-inner.ts @@ -1,10 +1,13 @@ import { getNewsInner } from "@/services/service"; +import { useLangStore } from "@/store/lang"; import { useQuery } from "@tanstack/react-query"; -export const useNewsInner = (id: number, lang: string) => { +export const useNewsInner = (id: number) => { + const lang = useLangStore((state) => state.lang); + const { data, isPending } = useQuery({ queryKey: ["news-inner", id, lang], - queryFn: () => getNewsInner(id, lang), + queryFn: () => getNewsInner(id), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-news.ts b/src/hooks/tanstack/use-news.ts index 4bd7508..63166b0 100644 --- a/src/hooks/tanstack/use-news.ts +++ b/src/hooks/tanstack/use-news.ts @@ -1,10 +1,13 @@ import { getNews } from "@/services/service"; +import { useLangStore } from "@/store/lang"; import { useQuery } from "@tanstack/react-query"; -export const useNews = (lang: "ru" | "en" | "tm") => { +export const useNews = () => { + const lang = useLangStore((state) => state.lang); + const { data, isPending } = useQuery({ queryKey: ["news", lang], - queryFn: () => getNews(lang), + queryFn: () => getNews(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-participants.ts b/src/hooks/tanstack/use-participants.ts index 68f22f1..cdb9196 100644 --- a/src/hooks/tanstack/use-participants.ts +++ b/src/hooks/tanstack/use-participants.ts @@ -7,7 +7,7 @@ export const useParticipants = () => { const { data, isPending } = useQuery({ queryKey: ["participants", lang], - queryFn: () => getParticipants(lang), + queryFn: () => getParticipants(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-partners.ts b/src/hooks/tanstack/use-partners.ts index d30d1ad..d805c98 100644 --- a/src/hooks/tanstack/use-partners.ts +++ b/src/hooks/tanstack/use-partners.ts @@ -23,7 +23,7 @@ export const usePartners = () => { const { data, isPending } = useQuery({ queryKey: ["partners", lang], - queryFn: () => getPartners(lang), + queryFn: () => getPartners(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-sponsors.ts b/src/hooks/tanstack/use-sponsors.ts index 06e017c..c4eeda1 100644 --- a/src/hooks/tanstack/use-sponsors.ts +++ b/src/hooks/tanstack/use-sponsors.ts @@ -7,7 +7,7 @@ export const useSponsors = () => { const { data, isPending } = useQuery({ queryKey: ["sponsors", lang], - queryFn: () => getSponsors(lang), + queryFn: () => getSponsors(), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-static-words.ts b/src/hooks/tanstack/use-static-words.ts index 115d4a6..925af99 100644 --- a/src/hooks/tanstack/use-static-words.ts +++ b/src/hooks/tanstack/use-static-words.ts @@ -37,7 +37,7 @@ export const useStaticWords = (id: string) => { const { data, isPending } = useQuery({ queryKey: ["static-words", lang, id], - queryFn: () => getStaticWords(lang, id), + queryFn: () => getStaticWords(id), select: ({ data }) => data.data, }); diff --git a/src/hooks/tanstack/use-stats.ts b/src/hooks/tanstack/use-stats.ts index 5cc1e9d..f8d068f 100644 --- a/src/hooks/tanstack/use-stats.ts +++ b/src/hooks/tanstack/use-stats.ts @@ -20,7 +20,7 @@ export const useStats = () => { const { data, isPending } = useQuery({ queryKey: ["stats", lang], - queryFn: () => getStats(lang), + queryFn: () => getStats(), select: ({ data }) => data.data, }); diff --git a/src/pages/news-inner.tsx b/src/pages/news-inner.tsx index 39123bf..bbb2fcb 100644 --- a/src/pages/news-inner.tsx +++ b/src/pages/news-inner.tsx @@ -15,8 +15,8 @@ export default function NewsInner() { const pageId = Number(id); useScrollTop(pageId); - const { data, isPending } = useNewsInner(pageId, lang); - const { data: news } = useNews(lang); + const { data, isPending } = useNewsInner(pageId); + const { data: news } = useNews(); if (isPending) return ; diff --git a/src/pages/news.tsx b/src/pages/news.tsx index 47d1020..d1cf27b 100644 --- a/src/pages/news.tsx +++ b/src/pages/news.tsx @@ -11,7 +11,7 @@ export default function News() { const lang = useLangStore((state) => state.lang); - const { data, isPending } = useNews(lang); + const { data, isPending } = useNews(); if (isPending) return ; diff --git a/src/services/service.ts b/src/services/service.ts index 7868062..e4d252c 100644 --- a/src/services/service.ts +++ b/src/services/service.ts @@ -3,7 +3,6 @@ import { SponsorFormType } from "@/lib/get-sponsor-form-details"; import { StandFormType } from "@/lib/get-stend-form-details"; import axios from "axios"; import { ContactsPageType } from "./types/contacts.type"; -import { LangState } from "@/store/lang"; import { StatsType } from "@/hooks/tanstack/use-stats"; import { HomeContactsType } from "./types/home-contacts.type"; import { StaticType } from "@/hooks/tanstack/use-static-words"; @@ -15,11 +14,18 @@ import { ParticipantsType } from "./types/participants.type"; import { PhotoTypes } from "./types/photo.type"; import { DesignersType } from "./types/designers.type"; import { VideoTypes } from "./types/videos.type"; +import { useLangStore } from "@/store/lang"; const axios_url = axios.create({ baseURL: "https://turkmentextile.turkmenexpo.com/app/api/v1/", }); +axios_url.interceptors.request.use((config) => { + const lang = useLangStore.getState().lang; + config.headers["Accept-Language"] = lang; + return config; +}); + export const postStend = async (data: StandFormType): Promise => { const res = axios_url.post(`book_stand_form`, data); @@ -50,102 +56,62 @@ export const postSubscribe = async (data: { email: string }) => { return (await res).status === 201; }; -export const getStaticWords = async (lang: LangState["lang"], id: string) => { - const data = axios_url.get(`pages/${id}`, { - headers: { - "Accept-Language": lang, - }, - }); +export const getStaticWords = async (id: string) => { + const data = axios_url.get(`pages/${id}`); return data; }; -export const getPartners = async (lang: LangState["lang"]) => { - const data = axios_url.get("partners", { - headers: { - "Accept-Language": lang, - }, - }); +export const getPartners = async () => { + const data = axios_url.get("partners"); return data; }; -export const getStats = async (lang: LangState["lang"]) => { - const data = axios_url.get("stats", { - headers: { - "Accept-Language": lang, - }, - }); +export const getStats = async () => { + const data = axios_url.get("stats"); return data; }; -export const getContacts = async (lang: LangState["lang"]) => { - const data = axios_url.get("contact_info", { - headers: { - "Accept-Language": lang, - }, - }); +export const getContacts = async () => { + const data = axios_url.get("contact_info"); return data; }; -export const getHomeContacts = async (lang: LangState["lang"]) => { - const data = axios_url.get("contact_data", { - headers: { - "Accept-Language": lang, - }, - }); +export const getHomeContacts = async () => { + const data = axios_url.get("contact_data"); return data; }; -export const getIndustries = async (lang: LangState["lang"]) => { - const data = axios_url.get(`industries`, { - headers: { - "Accept-Language": lang, - }, - }); +export const getIndustries = async () => { + const data = axios_url.get(`industries`); return data; }; -export const getExhibitionTime = async (lang: LangState["lang"]) => { - const data = axios_url.get(`exhibition_time`, { - headers: { - "Accept-Language": lang, - }, - }); +export const getExhibitionTime = async () => { + const data = axios_url.get(`exhibition_time`); return data; }; -export const getNews = async (lang: "ru" | "en" | "tm") => { - const data = axios_url.get(`news?per_page=100`, { - headers: { - "Accept-Language": lang, - }, - }); +export const getNews = async () => { + const data = axios_url.get(`news?per_page=100`); return data; }; -export const getNewsInner = async (id: number, lang: string) => { - const data = axios_url.get(`news/${id}`, { - headers: { - "Accept-Language": lang, - }, - }); +export const getNewsInner = async (id: number) => { + const data = axios_url.get(`news/${id}`); return data; }; -export const getParticipants = async (lang: LangState["lang"]) => { - const data = axios_url("participants", { - headers: { - "Accept-Language": lang, - }, - }); +export const getParticipants = async () => { + const data = axios_url("participants"); return data; }; @@ -162,22 +128,14 @@ export const getVideos = async (id: number) => { return data; }; -export const getSponsors = async (lang: LangState["lang"]) => { - const data = axios_url("sponsors_and_partners", { - headers: { - "Accept-Language": lang, - }, - }); +export const getSponsors = async () => { + const data = axios_url("sponsors_and_partners"); return data; }; -export const getDesigners = async (lang: LangState["lang"], id: number) => { - const data = axios_url("designers/category/" + id, { - headers: { - "Accept-Language": lang, - }, - }); +export const getDesigners = async (id: number) => { + const data = axios_url("designers/category/" + id); return data; };