| .bg { | |||||
| position: relative; | |||||
| width: 750px; | |||||
| height: 450px; | |||||
| background: #fff url(./assets/plugins-bg.png) center center no-repeat; | |||||
| background-size: contain; | |||||
| box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03); | |||||
| border-radius: 16px; | |||||
| } | |||||
| .text { | |||||
| position: absolute; | |||||
| top: 40px; | |||||
| left: 48px; | |||||
| width: 526px; | |||||
| background: linear-gradient(91.92deg, #104AE1 -1.74%, #0098EE 75.74%); | |||||
| background-clip: text; | |||||
| color: transparent; | |||||
| font-size: 24px; | |||||
| font-weight: 700; | |||||
| line-height: 32px; | |||||
| } | |||||
| .tag { | |||||
| position: absolute; | |||||
| width: 116.74px; | |||||
| height: 69.3px; | |||||
| left: -18.37px; | |||||
| top: -11.48px; | |||||
| background: url(./assets/coming-soon.png) center center no-repeat; | |||||
| background-size: contain; | |||||
| } |
| import s from './page.module.css' | |||||
| import { getLocaleOnServer } from '@/i18n/server' | |||||
| import { useTranslation } from '@/i18n/i18next-serverside-config' | |||||
| const PluginsComingSoon = async () => { | |||||
| const locale = getLocaleOnServer() | |||||
| const { t } = await useTranslation(locale, 'common') | |||||
| return ( | |||||
| <div className='flex justify-center items-center w-full h-full bg-gray-100'> | |||||
| <div className={s.bg}> | |||||
| <div className={s.tag} /> | |||||
| <div className={s.text}>{t('menus.pluginsTips')}</div> | |||||
| </div> | |||||
| </div > | |||||
| ) | |||||
| } | |||||
| export default PluginsComingSoon |
| import EnvNav from './env-nav' | import EnvNav from './env-nav' | ||||
| import ExploreNav from './explore-nav' | import ExploreNav from './explore-nav' | ||||
| import GithubStar from './github-star' | import GithubStar from './github-star' | ||||
| import PluginNav from './plugin-nav' | |||||
| import { WorkspaceProvider } from '@/context/workspace-context' | import { WorkspaceProvider } from '@/context/workspace-context' | ||||
| import { useAppContext } from '@/context/app-context' | import { useAppContext } from '@/context/app-context' | ||||
| import LogoSite from '@/app/components/base/logo/logo-site' | import LogoSite from '@/app/components/base/logo/logo-site' | ||||
| <div className='flex items-center'> | <div className='flex items-center'> | ||||
| <ExploreNav className={navClassName} /> | <ExploreNav className={navClassName} /> | ||||
| <AppNav /> | <AppNav /> | ||||
| <PluginNav className={navClassName} /> | |||||
| {isCurrentWorkspaceManager && <DatasetNav />} | {isCurrentWorkspaceManager && <DatasetNav />} | ||||
| </div> | </div> | ||||
| <div className='flex items-center flex-shrink-0'> | <div className='flex items-center flex-shrink-0'> |
| 'use client' | |||||
| import { useTranslation } from 'react-i18next' | |||||
| import Link from 'next/link' | |||||
| import { useSelectedLayoutSegment } from 'next/navigation' | |||||
| import classNames from 'classnames' | |||||
| import { PuzzlePiece01 } from '@/app/components/base/icons/src/vender/line/development' | |||||
| import { PuzzlePiece01 as PuzzlePiece01Solid } from '@/app/components/base/icons/src/vender/solid/development' | |||||
| type PluginNavProps = { | |||||
| className?: string | |||||
| } | |||||
| const PluginNav = ({ | |||||
| className, | |||||
| }: PluginNavProps) => { | |||||
| const { t } = useTranslation() | |||||
| const selectedSegment = useSelectedLayoutSegment() | |||||
| const isPluginsComingSoon = selectedSegment === 'plugins-coming-soon' | |||||
| return ( | |||||
| <Link href="/plugins-coming-soon" className={classNames( | |||||
| className, 'group', | |||||
| isPluginsComingSoon && 'bg-white shadow-md', | |||||
| isPluginsComingSoon ? 'text-primary-600' : 'text-gray-500 hover:bg-gray-200', | |||||
| )}> | |||||
| { | |||||
| isPluginsComingSoon | |||||
| ? <PuzzlePiece01Solid className='mr-2 w-4 h-4' /> | |||||
| : <PuzzlePiece01 className='mr-2 w-4 h-4' /> | |||||
| } | |||||
| {t('common.menus.plugins')} | |||||
| </Link> | |||||
| ) | |||||
| } | |||||
| export default PluginNav |