From f02b77b99fff0969d74859a20869ca906d98cb1b Mon Sep 17 00:00:00 2001
From: NFish <douxc512@gmail.com>
Date: Thu, 20 Mar 2025 10:11:26 +0800
Subject: [PATCH] fix: Decouple login page logo component to avoid conflict
 with internal logo

---
 web/app/components/base/logo/logo-site.tsx |  2 +-
 web/app/signin/LoginLogo.tsx               | 34 ++++++++++++++++++++++
 web/app/signin/_header.tsx                 |  4 +--
 3 files changed, 37 insertions(+), 3 deletions(-)
 create mode 100644 web/app/signin/LoginLogo.tsx

diff --git a/web/app/components/base/logo/logo-site.tsx b/web/app/components/base/logo/logo-site.tsx
index 301394d46a..ff33917c34 100644
--- a/web/app/components/base/logo/logo-site.tsx
+++ b/web/app/components/base/logo/logo-site.tsx
@@ -20,7 +20,7 @@ const LogoSite: FC<LogoSiteProps> = ({
 
   let src = theme === 'light' ? '/logo/logo-site.png' : `/logo/logo-site-${theme}.png`
   if (systemFeatures.branding.enabled)
-    src = systemFeatures.branding.login_page_logo
+    src = systemFeatures.branding.workspace_logo
 
   return (
     <img
diff --git a/web/app/signin/LoginLogo.tsx b/web/app/signin/LoginLogo.tsx
new file mode 100644
index 0000000000..0753d1f98a
--- /dev/null
+++ b/web/app/signin/LoginLogo.tsx
@@ -0,0 +1,34 @@
+'use client'
+import type { FC } from 'react'
+import classNames from '@/utils/classnames'
+import { useSelector } from '@/context/app-context'
+import { useGlobalPublicStore } from '@/context/global-public-context'
+
+type LoginLogoProps = {
+  className?: string
+}
+
+const LoginLogo: FC<LoginLogoProps> = ({
+  className,
+}) => {
+  const { systemFeatures } = useGlobalPublicStore()
+  const { theme } = useSelector((s) => {
+    return {
+      theme: s.theme,
+    }
+  })
+
+  let src = theme === 'light' ? '/logo/logo-site.png' : `/logo/logo-site-${theme}.png`
+  if (systemFeatures.branding.enabled)
+    src = systemFeatures.branding.login_page_logo
+
+  return (
+    <img
+      src={src}
+      className={classNames('block w-auto h-10', className)}
+      alt='logo'
+    />
+  )
+}
+
+export default LoginLogo
diff --git a/web/app/signin/_header.tsx b/web/app/signin/_header.tsx
index a9479a3fe4..a906c82b11 100644
--- a/web/app/signin/_header.tsx
+++ b/web/app/signin/_header.tsx
@@ -1,17 +1,17 @@
 'use client'
 import React from 'react'
 import { useContext } from 'use-context-selector'
+import LoginLogo from './LoginLogo'
 import Select from '@/app/components/base/select/locale'
 import { languages } from '@/i18n/language'
 import { type Locale } from '@/i18n'
 import I18n from '@/context/i18n'
-import LogoSite from '@/app/components/base/logo/logo-site'
 
 const Header = () => {
   const { locale, setLocaleOnClient } = useContext(I18n)
 
   return <div className='flex items-center justify-between p-6 w-full'>
-    <LogoSite />
+    <LoginLogo />
     <Select
       value={locale}
       items={languages.filter(item => item.supported)}