- implement disable_email_auth env var

- add sync crowdin translations github action

apps/client/src/pages/auth/_components/social-auth.tsx

@@ -2,20 +2,36 @@ import { t } from "@lingui/macro";
 import { GithubLogo, GoogleLogo } from "@phosphor-icons/react";
 import { Button } from "@reactive-resume/ui";
 
-export const SocialAuth = () => (
-  <div className="grid grid-cols-2 gap-4">
-    <Button asChild size="lg" className="w-full !bg-[#222] !text-white hover:!bg-[#222]/80">
-      <a href="/api/auth/github">
-        <GithubLogo className="mr-3 h-4 w-4" />
-        {t`GitHub`}
-      </a>
-    </Button>
+import { useAuthProviders } from "@/client/services/auth/providers";
 
-    <Button asChild size="lg" className="w-full !bg-[#4285F4] !text-white hover:!bg-[#4285F4]/80">
-      <a href="/api/auth/google">
-        <GoogleLogo className="mr-3 h-4 w-4" />
-        {t`Google`}
-      </a>
-    </Button>
-  </div>
-);
+export const SocialAuth = () => {
+  const { providers } = useAuthProviders();
+
+  if (!providers || providers.length === 0) return null;
+
+  return (
+    <div className="grid grid-cols-2 gap-4">
+      {providers.includes("github") && (
+        <Button asChild size="lg" className="w-full !bg-[#222] !text-white hover:!bg-[#222]/80">
+          <a href="/api/auth/github">
+            <GithubLogo className="mr-3 h-4 w-4" />
+            {t`GitHub`}
+          </a>
+        </Button>
+      )}
+
+      {providers.includes("google") && (
+        <Button
+          asChild
+          size="lg"
+          className="w-full !bg-[#4285F4] !text-white hover:!bg-[#4285F4]/80"
+        >
+          <a href="/api/auth/google">
+            <GoogleLogo className="mr-3 h-4 w-4" />
+            {t`Google`}
+          </a>
+        </Button>
+      )}
+    </div>
+  );
+};

apps/client/src/pages/auth/layout.tsx

@@ -1,10 +1,12 @@
 import { t } from "@lingui/macro";
+import { cn } from "@reactive-resume/utils";
 import { useMemo } from "react";
 import { Link, matchRoutes, Outlet, useLocation } from "react-router-dom";
 
 import { LocaleSwitch } from "@/client/components/locale-switch";
 import { Logo } from "@/client/components/logo";
 import { ThemeSwitch } from "@/client/components/theme-switch";
+import { useAuthProviders } from "@/client/services/auth/providers";
 
 import { SocialAuth } from "./_components/social-auth";
 
@@ -13,8 +15,13 @@ const authRoutes = [{ path: "/auth/login" }, { path: "/auth/register" }];
 export const AuthLayout = () => {
   const location = useLocation();
 
+  const { providers } = useAuthProviders();
+  const emailAuthDisabled = !providers || !providers.includes("email");
+
   const isAuthRoute = useMemo(() => matchRoutes(authRoutes, location) !== null, [location]);
 
+  if (!providers) return null;
+
   return (
     <div className="flex h-screen w-screen">
       <div className="relative flex w-full flex-col justify-center gap-y-8 px-12 sm:mx-auto sm:basis-[420px] sm:px-0 lg:basis-[480px] lg:px-12">
@@ -33,7 +40,7 @@ export const AuthLayout = () => {
 
         {isAuthRoute && (
           <>
-            <div className="flex items-center gap-x-4">
+            <div className={cn("flex items-center gap-x-4", emailAuthDisabled && "hidden")}>
               <hr className="flex-1" />
               <span className="text-xs font-medium">
                 {t({

apps/client/src/pages/auth/login/page.tsx

@@ -14,6 +14,7 @@ import {
   FormMessage,
   Input,
 } from "@reactive-resume/ui";
+import { cn } from "@reactive-resume/utils";
 import { useRef } from "react";
 import { Helmet } from "react-helmet-async";
 import { useForm } from "react-hook-form";
@@ -21,12 +22,16 @@ import { Link } from "react-router-dom";
 import { z } from "zod";
 
 import { useLogin } from "@/client/services/auth";
+import { useAuthProviders } from "@/client/services/auth/providers";
 
 type FormValues = z.infer<typeof loginSchema>;
 
 export const LoginPage = () => {
   const { login, loading } = useLogin();
 
+  const { providers } = useAuthProviders();
+  const emailAuthDisabled = !providers || !providers.includes("email");
+
   const formRef = useRef<HTMLFormElement>(null);
   usePasswordToggle(formRef);
 
@@ -53,7 +58,7 @@ export const LoginPage = () => {
 
       <div className="space-y-1.5">
         <h2 className="text-2xl font-semibold tracking-tight">{t`Sign in to your account`}</h2>
-        <h6>
+        <h6 className={cn(emailAuthDisabled && "hidden")}>
           <span className="opacity-75">{t`Don't have an account?`}</span>
           <Button asChild variant="link" className="px-1.5">
             <Link to="/auth/register">
@@ -64,7 +69,7 @@ export const LoginPage = () => {
         </h6>
       </div>
 
-      <div>
+      <div className={cn(emailAuthDisabled && "hidden")}>
         <Form {...form}>
           <form
             ref={formRef}

apps/client/src/pages/auth/register/page.tsx

@@ -14,6 +14,7 @@ import {
   FormMessage,
   Input,
 } from "@reactive-resume/ui";
+import { cn } from "@reactive-resume/utils";
 import { useRef } from "react";
 import { Helmet } from "react-helmet-async";
 import { useForm } from "react-hook-form";
@@ -21,6 +22,7 @@ import { Link, useNavigate } from "react-router-dom";
 import { z } from "zod";
 
 import { useRegister } from "@/client/services/auth";
+import { useAuthProviders } from "@/client/services/auth/providers";
 
 type FormValues = z.infer<typeof registerSchema>;
 
@@ -28,6 +30,9 @@ export const RegisterPage = () => {
   const navigate = useNavigate();
   const { register, loading } = useRegister();
 
+  const { providers } = useAuthProviders();
+  const emailAuthDisabled = !providers || !providers.includes("email");
+
   const formRef = useRef<HTMLFormElement>(null);
   usePasswordToggle(formRef);
 
@@ -62,7 +67,7 @@ export const RegisterPage = () => {
 
       <div className="space-y-1.5">
         <h2 className="text-2xl font-semibold tracking-tight">{t`Create a new account`}</h2>
-        <h6>
+        <h6 className={cn(emailAuthDisabled && "hidden")}>
           <span className="opacity-75">{t`Already have an account?`}</span>
           <Button asChild variant="link" className="px-1.5">
             <Link to="/auth/login">
@@ -72,7 +77,7 @@ export const RegisterPage = () => {
         </h6>
       </div>
 
-      <div>
+      <div className={cn(emailAuthDisabled && "hidden")}>
         <Form {...form}>
           <form
             ref={formRef}