🍎 feat: Apple auth (#5473)

* implemented Apple Auth login.

Closes: #3438

TODO:
- write config Doc

* removed some comments

* removed comment

* Add unit tests for Apple login strategy

Introduce comprehensive tests for the Apple login strategy, covering new user creation, existing user updates, and error handling scenarios during the authentication flow. Mocks implemented for external dependencies to ensure isolated testing.

* Remove unnecessary blank line in socialLogins.js

client/src/components/Auth/SocialLoginRender.tsx

@@ -1,4 +1,4 @@
-import { GoogleIcon, FacebookIcon, OpenIDIcon, GithubIcon, DiscordIcon } from '~/components';
+import { GoogleIcon, FacebookIcon, OpenIDIcon, GithubIcon, DiscordIcon, AppleIcon } from '~/components';
 
 import SocialButton from './SocialButton';
 
@@ -18,7 +18,7 @@ function SocialLoginRender({
   }
 
   const providerComponents = {
-    discord: startupConfig?.discordLoginEnabled && (
+    discord: startupConfig.discordLoginEnabled && (
       <SocialButton
         key="discord"
         enabled={startupConfig.discordLoginEnabled}
@@ -29,7 +29,7 @@ function SocialLoginRender({
         id="discord"
       />
     ),
-    facebook: startupConfig?.facebookLoginEnabled && (
+    facebook: startupConfig.facebookLoginEnabled && (
       <SocialButton
         key="facebook"
         enabled={startupConfig.facebookLoginEnabled}
@@ -40,7 +40,7 @@ function SocialLoginRender({
         id="facebook"
       />
     ),
-    github: startupConfig?.githubLoginEnabled && (
+    github: startupConfig.githubLoginEnabled && (
       <SocialButton
         key="github"
         enabled={startupConfig.githubLoginEnabled}
@@ -51,7 +51,7 @@ function SocialLoginRender({
         id="github"
       />
     ),
-    google: startupConfig?.googleLoginEnabled && (
+    google: startupConfig.googleLoginEnabled && (
       <SocialButton
         key="google"
         enabled={startupConfig.googleLoginEnabled}
@@ -62,7 +62,18 @@ function SocialLoginRender({
         id="google"
       />
     ),
-    openid: startupConfig?.openidLoginEnabled && (
+    apple: startupConfig.appleLoginEnabled && (
+      <SocialButton
+        key="apple"
+        enabled={startupConfig.appleLoginEnabled}
+        serverDomain={startupConfig.serverDomain}
+        oauthPath="apple"
+        Icon={AppleIcon}
+        label={localize('com_auth_apple_login')}
+        id="apple"
+      />
+    ),
+    openid: startupConfig.openidLoginEnabled && (
       <SocialButton
         key="openid"
         enabled={startupConfig.openidLoginEnabled}

client/src/components/svg/AppleIcon.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+export default function AppleIcon() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      xmlSpace="preserve"
+      viewBox="0 0 814 1000"
+      id="apple"
+      className="h-6 w-6"
+    >
+      <path
+        d="M788.1 340.9c-5.8 4.5-108.2 62.2-108.2 190.5 0 148.4 130.3 200.9 134.2 202.2-.6 3.2-20.7 71.9-68.7 141.9-42.8 61.6-87.5 123.1-155.5 123.1s-85.5-39.5-164-39.5c-76.5 0-103.7 40.8-165.9 40.8s-105.6-57-155.5-127C46.7 790.7 0 663 0 541.8c0-194.4 126.4-297.5 250.8-297.5 66.1 0 121.2 43.4 162.7 43.4 39.5 0 101.1-46 176.3-46 28.5 0 130.9 2.6 198.3 99.2zm-234-181.5c31.1-36.9 53.1-88.1 53.1-139.3 0-7.1-.6-14.3-1.9-20.1-50.6 1.9-110.8 33.7-147.1 75.8-28.5 32.4-55.1 83.6-55.1 135.5 0 7.8 1.3 15.6 1.9 18.1 3.2.6 8.4 1.3 13.6 1.3 45.4 0 102.5-30.4 135.5-71.3z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}

client/src/components/svg/index.ts

@@ -22,6 +22,7 @@ export { default as FacebookIcon } from './FacebookIcon';
 export { default as OpenIDIcon } from './OpenIDIcon';
 export { default as GithubIcon } from './GithubIcon';
 export { default as DiscordIcon } from './DiscordIcon';
+export { default as AppleIcon } from './AppleIcon';
 export { default as AnthropicIcon } from './AnthropicIcon';
 export { default as SendIcon } from './SendIcon';
 export { default as LinkIcon } from './LinkIcon';