mirror of
				https://github.com/langgenius/dify.git
				synced 2025-10-31 19:03:09 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			51 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			51 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
| 'use client'
 | |
| import React from 'react'
 | |
| import { useContext } from 'use-context-selector'
 | |
| import Select from '@/app/components/base/select/locale'
 | |
| import Divider from '@/app/components/base/divider'
 | |
| import { languages } from '@/i18n/language'
 | |
| import type { Locale } from '@/i18n'
 | |
| import I18n from '@/context/i18n'
 | |
| import dynamic from 'next/dynamic'
 | |
| import { useGlobalPublicStore } from '@/context/global-public-context'
 | |
| 
 | |
| // Avoid rendering the logo and theme selector on the server
 | |
| const DifyLogo = dynamic(() => import('@/app/components/base/logo/dify-logo'), {
 | |
|   ssr: false,
 | |
|   loading: () => <div className='h-7 w-16 bg-transparent' />,
 | |
| })
 | |
| const ThemeSelector = dynamic(() => import('@/app/components/base/theme-selector'), {
 | |
|   ssr: false,
 | |
|   loading: () => <div className='size-8 bg-transparent' />,
 | |
| })
 | |
| 
 | |
| const Header = () => {
 | |
|   const { locale, setLocaleOnClient } = useContext(I18n)
 | |
|   const systemFeatures = useGlobalPublicStore(s => s.systemFeatures)
 | |
| 
 | |
|   return (
 | |
|     <div className='flex w-full items-center justify-between p-6'>
 | |
|       {systemFeatures.branding.enabled && systemFeatures.branding.login_page_logo
 | |
|         ? <img
 | |
|           src={systemFeatures.branding.login_page_logo}
 | |
|           className='block h-7 w-auto object-contain'
 | |
|           alt='logo'
 | |
|         />
 | |
|         : <DifyLogo size='large' />}
 | |
|       <div className='flex items-center gap-1'>
 | |
|         <Select
 | |
|           value={locale}
 | |
|           items={languages.filter(item => item.supported)}
 | |
|           onChange={(value) => {
 | |
|             setLocaleOnClient(value as Locale)
 | |
|           }}
 | |
|         />
 | |
|         <Divider type='vertical' className='mx-0 ml-2 h-4' />
 | |
|         <ThemeSelector />
 | |
|       </div>
 | |
|     </div>
 | |
|   )
 | |
| }
 | |
| 
 | |
| export default Header
 | 
