Kaynağa Gözat

fix(i18n): add functions to retrieve document and pricing page languages (#19142)

tags/1.4.0
Wu Tianwei 6 ay önce
ebeveyn
işleme
3dff21e0be
No account linked to committer's email address

+ 7
- 1
web/app/components/billing/pricing/index.tsx Dosyayı Görüntüle

import GridMask from '@/app/components/base/grid-mask' import GridMask from '@/app/components/base/grid-mask'
import { useAppContext } from '@/context/app-context' import { useAppContext } from '@/context/app-context'
import classNames from '@/utils/classnames' import classNames from '@/utils/classnames'
import { useGetPricingPageLanguage } from '@/context/i18n'


type Props = { type Props = {
onCancel: () => void onCancel: () => void


useKeyPress(['esc'], onCancel) useKeyPress(['esc'], onCancel)


const pricingPageLanguage = useGetPricingPageLanguage()
const pricingPageURL = pricingPageLanguage
? `https://dify.ai/${pricingPageLanguage}/pricing#plans-and-features`
: 'https://dify.ai/pricing#plans-and-features'

return createPortal( return createPortal(
<div <div
className='fixed inset-0 bottom-0 left-0 right-0 top-0 z-[1000] bg-background-overlay-backdrop p-4 backdrop-blur-[6px]' className='fixed inset-0 bottom-0 left-0 right-0 top-0 z-[1000] bg-background-overlay-backdrop p-4 backdrop-blur-[6px]'
</div> </div>
<div className='flex items-center justify-center py-4'> <div className='flex items-center justify-center py-4'>
<div className='flex items-center justify-center gap-x-0.5 rounded-lg px-3 py-2 text-components-button-secondary-accent-text hover:cursor-pointer hover:bg-state-accent-hover'> <div className='flex items-center justify-center gap-x-0.5 rounded-lg px-3 py-2 text-components-button-secondary-accent-text hover:cursor-pointer hover:bg-state-accent-hover'>
<Link href='https://dify.ai/pricing#plans-and-features' className='system-sm-medium'>{t('billing.plansCommon.comparePlanAndFeatures')}</Link>
<Link href={pricingPageURL} className='system-sm-medium'>{t('billing.plansCommon.comparePlanAndFeatures')}</Link>
<RiArrowRightUpLine className='size-4' /> <RiArrowRightUpLine className='size-4' />
</div> </div>
</div> </div>

+ 4
- 7
web/app/components/header/account-dropdown/index.tsx Dosyayı Görüntüle

import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { Fragment, useState } from 'react' import { Fragment, useState } from 'react'
import { useRouter } from 'next/navigation' import { useRouter } from 'next/navigation'
import { useContext, useContextSelector } from 'use-context-selector'
import { useContextSelector } from 'use-context-selector'
import { import {
RiAccountCircleLine, RiAccountCircleLine,
RiArrowRightUpLine, RiArrowRightUpLine,
import Support from './support' import Support from './support'
import Compliance from './compliance' import Compliance from './compliance'
import PremiumBadge from '@/app/components/base/premium-badge' import PremiumBadge from '@/app/components/base/premium-badge'
import I18n from '@/context/i18n'
import { useGetDocLanguage } from '@/context/i18n'
import Avatar from '@/app/components/base/avatar' import Avatar from '@/app/components/base/avatar'
import { logout } from '@/service/common' import { logout } from '@/service/common'
import AppContext, { useAppContext } from '@/context/app-context' import AppContext, { useAppContext } from '@/context/app-context'
import { useProviderContext } from '@/context/provider-context' import { useProviderContext } from '@/context/provider-context'
import { useModalContext } from '@/context/modal-context' import { useModalContext } from '@/context/modal-context'
import { LanguagesSupported } from '@/i18n/language'
import { LicenseStatus } from '@/types/feature' import { LicenseStatus } from '@/types/feature'
import { IS_CLOUD_EDITION } from '@/config' import { IS_CLOUD_EDITION } from '@/config'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
const [aboutVisible, setAboutVisible] = useState(false) const [aboutVisible, setAboutVisible] = useState(false)
const systemFeatures = useContextSelector(AppContext, v => v.systemFeatures) const systemFeatures = useContextSelector(AppContext, v => v.systemFeatures)


const { locale } = useContext(I18n)
const { t } = useTranslation() const { t } = useTranslation()
const { userProfile, langeniusVersionInfo, isCurrentWorkspaceOwner } = useAppContext() const { userProfile, langeniusVersionInfo, isCurrentWorkspaceOwner } = useAppContext()
const { isEducationAccount } = useProviderContext() const { isEducationAccount } = useProviderContext()
const { setShowAccountSettingModal } = useModalContext() const { setShowAccountSettingModal } = useModalContext()
const docLanguage = useGetDocLanguage()


const handleLogout = async () => { const handleLogout = async () => {
await logout({ await logout({
className={cn(itemClassName, 'group justify-between', className={cn(itemClassName, 'group justify-between',
'data-[active]:bg-state-base-hover', 'data-[active]:bg-state-base-hover',
)} )}
href={
locale !== LanguagesSupported[1] ? 'https://docs.dify.ai/' : `https://docs.dify.ai/v/${locale.toLowerCase()}/`
}
href={`https://docs.dify.ai/${docLanguage}/introduction`}
target='_blank' rel='noopener noreferrer'> target='_blank' rel='noopener noreferrer'>
<RiBookOpenLine className='size-4 shrink-0 text-text-tertiary' /> <RiBookOpenLine className='size-4 shrink-0 text-text-tertiary' />
<div className='system-md-regular grow px-1 text-text-secondary'>{t('common.userProfile.helpCenter')}</div> <div className='system-md-regular grow px-1 text-text-secondary'>{t('common.userProfile.helpCenter')}</div>

+ 11
- 1
web/context/i18n.ts Dosyayı Görüntüle

useContext, useContext,
} from 'use-context-selector' } from 'use-context-selector'
import type { Locale } from '@/i18n' import type { Locale } from '@/i18n'
import { getLanguage } from '@/i18n/language'
import { getDocLanguage, getLanguage, getPricingPageLanguage } from '@/i18n/language'
import { noop } from 'lodash-es' import { noop } from 'lodash-es'


type II18NContext = { type II18NContext = {


return getLanguage(locale) return getLanguage(locale)
} }
export const useGetDocLanguage = () => {
const { locale } = useI18N()

return getDocLanguage(locale)
}
export const useGetPricingPageLanguage = () => {
const { locale } = useI18N()

return getPricingPageLanguage(locale)
}


export default I18NContext export default I18NContext

+ 18
- 0
web/i18n/language.ts Dosyayı Görüntüle

return LanguagesSupported[0].replace('-', '_') return LanguagesSupported[0].replace('-', '_')
} }


const DOC_LANGUAGE: Record<string, string> = {
'zh-Hans': 'zh-hans',
'ja-JP': 'ja-jp',
'en-US': 'en',
}

export const getDocLanguage = (locale: string) => {
return DOC_LANGUAGE[locale] || 'en'
}

const PRICING_PAGE_LANGUAGE: Record<string, string> = {
'ja-JP': 'jp',
}

export const getPricingPageLanguage = (locale: string) => {
return PRICING_PAGE_LANGUAGE[locale] || ''
}

export const NOTICE_I18N = { export const NOTICE_I18N = {
title: { title: {
en_US: 'Important Notice', en_US: 'Important Notice',

Loading…
İptal
Kaydet