fix(web): get default locale data from correct place (#6351)

apps/web/src/ee/clerk/providers/EnterpriseAuthProvider.tsx

@@ -9,6 +9,7 @@ import { useNavigate } from 'react-router-dom';
 import { useQueryClient } from '@tanstack/react-query';
 import { useSegment } from '../../../components/providers/SegmentProvider';
 import { ROUTES } from '../../../constants/routes';
+import { useGetDefaultLocale } from '../../translations/hooks/useGetDefaultLocale';
 
 const asyncNoop = async () => {};
 
@@ -18,6 +19,7 @@ EnterpriseAuthContext.displayName = 'EnterpriseAuthProvider';
 
 export const EnterpriseAuthProvider = ({ children }: { children: React.ReactNode }) => {
   const { signOut, orgId } = useAuth();
+  const { defaultLocale } = useGetDefaultLocale();
   const { user: clerkUser, isLoaded: isUserLoaded } = useUser();
   const { organization: clerkOrganization, isLoaded: isOrganizationLoaded } = useOrganization();
   // TODO @ChmaraX: Can we use setActive from useSession, useSignIn, or useSignUp to avoid loading the list?
@@ -106,12 +108,12 @@ export const EnterpriseAuthProvider = ({ children }: { children: React.ReactNode
         redirectTo({ url: ROUTES.AUTH_SIGNUP_ORGANIZATION_LIST });
       }
     }
-  }, [navigate, setActive, isOrgListLoaded, clerkUser, orgId, redirectTo]);
+  }, [setActive, isOrgListLoaded, clerkUser, orgId, redirectTo]);
 
   const currentUser = useMemo(() => (clerkUser ? toUserEntity(clerkUser) : undefined), [clerkUser]);
   const currentOrganization = useMemo(
-    () => (clerkOrganization ? toOrganizationEntity(clerkOrganization) : undefined),
-    [clerkOrganization]
+    () => (clerkOrganization ? toOrganizationEntity(clerkOrganization, defaultLocale) : undefined),
+    [clerkOrganization, defaultLocale]
   );
 
   // refetch queries on organization switch
@@ -177,7 +179,10 @@ const toUserEntity = (clerkUser: UserResource): IUserEntity => {
   };
 };
 
-const toOrganizationEntity = (clerkOrganization: OrganizationResource): IOrganizationEntity => {
+const toOrganizationEntity = (
+  clerkOrganization: OrganizationResource,
+  defaultLocale: string | undefined
+): IOrganizationEntity => {
   /*
    * When mapping to IOrganizationEntity, we have 2 cases:
    *  - user exists and has signed in
@@ -197,7 +202,7 @@ const toOrganizationEntity = (clerkOrganization: OrganizationResource): IOrganiz
     name: clerkOrganization.name,
     createdAt: clerkOrganization.createdAt.toISOString(),
     updatedAt: clerkOrganization.updatedAt.toISOString(),
-    defaultLocale: clerkOrganization.publicMetadata.defaultLocale,
+    defaultLocale: defaultLocale,
     domain: clerkOrganization.publicMetadata.domain,
     productUseCases: clerkOrganization.publicMetadata.productUseCases,
     language: clerkOrganization.publicMetadata.language,

apps/web/src/ee/translations/hooks/useGetDefaultLocale.tsx

@@ -0,0 +1,12 @@
+import { useQuery } from '@tanstack/react-query';
+import { api } from '../../../api';
+
+export const useGetDefaultLocale = () => {
+  const { data } = useQuery<{ defaultLocale: string }>([`translations/defaultLocale`], () =>
+    api.get(`/v1/translations/defaultLocale`)
+  );
+
+  return {
+    defaultLocale: data?.defaultLocale,
+  };
+};