diff --git a/src/api/api.ts b/src/api/api.ts index e73a6d5..cc8088f 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -31,6 +31,7 @@ import { Payment, UserVideos, UserPDF, + Locale, } from './resources' const api = { @@ -86,6 +87,8 @@ const api = { getUserVideos: createMethod(UserVideos.createRequest), // User PDF getUserPDFCompatibility: createMethod(UserPDF.createRequest), + // Locale + getLocale: createMethod(Locale.createRequest), } export type ApiContextValue = typeof api diff --git a/src/api/resources/Locale.ts b/src/api/resources/Locale.ts new file mode 100644 index 0000000..e633887 --- /dev/null +++ b/src/api/resources/Locale.ts @@ -0,0 +1,47 @@ +import routes from "@/routes"; +import { getBaseHeaders } from "../utils"; + +interface ResponseGetSuccess { + ip: string; + city: string; + region: string; + region_code: string; + country: string; + country_code: string; + country_code_iso3: string; + country_name: string; + country_capital: string; + country_tld: string; + country_area: string; + country_population: string; + continent_code: string; + in_eu: boolean; + postal: string; + latitude: number; + longitude: number; + latlong: string; + timezone: string; + utc_offset: string; + country_calling_code: string; + currency: string; + currency_name: string; + languages: string; + asn: string; + org: string; + hostname: string; +} + +interface ResponseGetError { + ip: "127.0.0.1", + error: true, + reason: "Reserved IP Address", + reserved?: true, + version?: "IPv4" +} + +export type ResponseGet = ResponseGetSuccess & ResponseGetError; + +export const createRequest = (): Request => { + const url = new URL(routes.server.userLocale()); + return new Request(url, { method: "GET", headers: getBaseHeaders() }); +}; diff --git a/src/api/resources/index.ts b/src/api/resources/index.ts index 7c2e4c0..f416102 100644 --- a/src/api/resources/index.ts +++ b/src/api/resources/index.ts @@ -29,3 +29,4 @@ export * as Paywall from "./Paywall"; export * as Payment from "./Payment"; export * as UserVideos from "./UserVideos"; export * as UserPDF from "./UserPDF"; +export * as Locale from "./Locale"; diff --git a/src/components/SubscriptionPage/index.tsx b/src/components/SubscriptionPage/index.tsx index 2d65ab8..7756677 100644 --- a/src/components/SubscriptionPage/index.tsx +++ b/src/components/SubscriptionPage/index.tsx @@ -13,7 +13,7 @@ import styles from "./styles.module.css"; import { useEffect, useState } from "react"; import { ApiError, extractErrorMessage, useApi } from "@/api"; import { useAuth } from "@/auth"; -import { getClientLocale, getClientTimezone } from "@/locales"; +import { getClientTimezone, language } from "@/locales"; import Loader from "../Loader"; import Title from "../Title"; import ErrorText from "../ErrorText"; @@ -21,7 +21,7 @@ import { EPlacementKeys, IPaywallProduct } from "@/api/resources/Paywall"; import { usePaywall } from "@/hooks/paywall/usePaywall"; const currency = Currency.USD; -const locale = getClientLocale() as Locale; +const locale = language as Locale; const getPrice = (product: IPaywallProduct | null) => { if (!product?.trialPrice) { diff --git a/src/hooks/paywall/usePaywall.tsx b/src/hooks/paywall/usePaywall.tsx index 0783081..cd5f134 100644 --- a/src/hooks/paywall/usePaywall.tsx +++ b/src/hooks/paywall/usePaywall.tsx @@ -6,7 +6,7 @@ import { useDispatch, useSelector } from "react-redux"; import parse from "html-react-parser"; import { defaultPaywalls } from "./defaultPaywalls"; import locales from "@/locales/locales"; -import { ELocalesPlacement, getClientLocale } from "@/locales"; +import { ELocalesPlacement, language } from "@/locales"; import { useTranslations } from "@/hooks/translations"; interface IUsePaywallProps { @@ -27,7 +27,7 @@ export function usePaywall({ placementKey, localesPlacement = ELocalesPlacement.V0, }: IUsePaywallProps) { - const locale = getClientLocale(); + const locale = language; const { translate } = useTranslations(localesPlacement); const api = useApi(); const dispatch = useDispatch(); diff --git a/src/init.tsx b/src/init.tsx index 2c79ef0..0ab5994 100755 --- a/src/init.tsx +++ b/src/init.tsx @@ -9,12 +9,12 @@ import { AuthProvider } from "./auth"; import { ApiContext, createApi } from "./api"; import { LegalContext, buildLegal } from "./legal"; import { - getClientLocale, buildResources, fallbackLng, getDefaultLocaleByLanguage, getTranslationJSON, ELocalesPlacement, + language, } from "./locales"; import App from "./components/App"; import metricService from "./services/metric/metricService"; @@ -28,7 +28,6 @@ const environments = import.meta.env; const init = async () => { const api = createApi(); - const lng = getClientLocale(); const currentPlacement = localStorage.getItem( "locales-placement" ) as ELocalesPlacement; @@ -40,9 +39,9 @@ const init = async () => { translationJSON, ] = await Promise.all([ api.getTranslations(null), - api.getElements({ locale: lng }), + api.getElements({ locale: language }), api.getAppConfig({ bundleId: "auraweb" }), - getTranslationJSON(currentPlacement, lng), + getTranslationJSON(currentPlacement, language), ]); const resources = buildResources(translationsResponse, translationJSON); @@ -53,7 +52,7 @@ const init = async () => { resources, fallbackLng, postProcess: [`reactPostprocessor`], - lng: getDefaultLocaleByLanguage(lng), + lng: getDefaultLocaleByLanguage(language), }; await i18nextInstance .use(initReactI18next) diff --git a/src/locales/index.ts b/src/locales/index.ts index b6db454..9a6badc 100644 --- a/src/locales/index.ts +++ b/src/locales/index.ts @@ -1,14 +1,29 @@ import { Translation } from '@/api/resources/Translations.ts' -import { Translations } from '../api' +import { createApi, Translations } from '../api' import dev from './dev.ts' import locales from './locales.ts' -export const getClientLocale = () => { - return navigator.language +// export const getClientLocale = () => { +// return navigator.language +// } +export const getClientLocale = async () => { + const api = createApi(); + try { + const resp = await api.getLocale(undefined) + if (resp?.error || !resp?.languages?.length) { + return navigator.language + } + if (resp.country_code === "IN") { + return "hi" + } + return resp.languages.split(',')[0] + } catch (error) { + return navigator.language + } } export const getClientTimezone = () => Intl.DateTimeFormat().resolvedOptions().timeZone -const language = getClientLocale() +export const language = await getClientLocale() export const fallbackLng = 'en' const omitKeys = ['href', 'title', 'url_slug', 'type'] diff --git a/src/routes.ts b/src/routes.ts index a3963ae..4f2490d 100755 --- a/src/routes.ts +++ b/src/routes.ts @@ -150,7 +150,7 @@ const routes = { [host, "single-payment", productId].join("/"), getInformationPartner: () => [host, "get-information-partner"].join("/"), - + mikeV1: () => [host, "v1", "mike"].join("/"), getBirthPlace: () => [host, "birthPlace"].join("/"), // ABDesignV1 @@ -205,6 +205,7 @@ const routes = { notFound: () => [host, "404"].join("/"), }, server: { + userLocale: () => ["https://ipapi.co", "json"].join("/"), appleAuth: (origin: string) => [apiHost, "auth", "apple", `gate?origin=${origin}`].join("/"), googleAuth: (origin: string) => diff --git a/src/store/user.ts b/src/store/user.ts index 1b07753..7bc8b3e 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -1,13 +1,13 @@ import { createSlice, createSelector } from '@reduxjs/toolkit' import type { PayloadAction } from '@reduxjs/toolkit' import { User } from '../api' -import { getClientLocale, getClientTimezone } from '../locales' +import { getClientTimezone, language } from '../locales' const initialState: User.User = { id: undefined, username: "", email: '', - locale: getClientLocale(), + locale: language, state: '', timezone: getClientTimezone(), new_registration: false, @@ -34,7 +34,7 @@ const userSlice = createSlice({ name: 'user', initialState, reducers: { - update(state, action: PayloadAction>) { + update(state, action: PayloadAction>) { return { ...state, ...action.payload } }, },