From 792595a46fe09477467edab8d22a2f2b4d95563b Mon Sep 17 00:00:00 2001
From: Yi <yxiaoisme@gmail.com>
Date: Wed, 18 Sep 2024 18:32:33 +0800
Subject: [PATCH] update page header

---
 web/app/(commonLayout)/plugins/Container.tsx  |  14 +++--
 web/app/components/base/logo/logo-site.tsx    |  12 +---
 .../billing/header-billing-btn/index.tsx      |  24 ++++++--
 .../header/account-dropdown/index.tsx         |   5 --
 .../workplace-selector/index.tsx              |  52 ++++++++----------
 web/app/components/header/index.tsx           |  33 ++++++-----
 web/app/components/header/nav/index.tsx       |   2 +-
 .../plugins/plugin-setting/style.module.css   |   7 +++
 web/i18n/en-US/marketplace.ts                 |   7 ++-
 web/i18n/zh-Hans/marketplace.ts               |  10 ++++
 web/public/logo/logo.png                      | Bin 0 -> 6249 bytes
 11 files changed, 97 insertions(+), 69 deletions(-)
 create mode 100644 web/app/components/plugins/plugin-setting/style.module.css
 create mode 100644 web/i18n/zh-Hans/marketplace.ts
 create mode 100644 web/public/logo/logo.png

diff --git a/web/app/(commonLayout)/plugins/Container.tsx b/web/app/(commonLayout)/plugins/Container.tsx
index fde3f0335c..5fee5354a2 100644
--- a/web/app/(commonLayout)/plugins/Container.tsx
+++ b/web/app/(commonLayout)/plugins/Container.tsx
@@ -35,8 +35,11 @@ const Container = () => {
   const containerRef = useRef<HTMLDivElement>(null)
 
   return (
-    <div ref={containerRef} className='grow relative flex flex-col rounded-t-xl bg-components-panel-bg border-t
-    border-divider-subtle overflow-y-auto'>
+    <div
+      ref={containerRef}
+      className='grow relative flex flex-col rounded-t-xl bg-components-panel-bg border-t
+      border-divider-subtle overflow-y-auto'
+    >
       <div className='flex min-h-[60px] px-12 pt-4 pb-2 items-center self-stretch gap-1'>
         <div className='flex justify-between items-center w-full'>
           <div className='flex-1'>
@@ -96,12 +99,15 @@ const Container = () => {
           </div>
         </div>
       </div>
-      <div className='flex flex-col flex-grow pt-1 pb-3 px-12 justify-center items-start gap-3 self-stretch'>
+      <div className='flex flex-col pt-1 pb-3 px-12 justify-center items-start gap-3 self-stretch'>
         <div className='h-px self-stretch bg-divider-subtle'></div>
         <div className='flex items-center gap-2 self-stretch'>
-          {/* Content for active tab will go here */}
+          {/* Filter goes here */}
         </div>
       </div>
+      <div className='flex px-12 items-start content-start gap-2 flex-grow self-stretch flex-wrap'>
+        {/* Plugin cards go here */}
+      </div>
       <div className='flex items-center justify-center py-4 gap-2 text-text-quaternary'>
         <RiDragDropLine className='w-4 h-4' />
         <span className='system-xs-regular'>Drop plugin package here to install</span>
diff --git a/web/app/components/base/logo/logo-site.tsx b/web/app/components/base/logo/logo-site.tsx
index a399ff3301..4b0e026afd 100644
--- a/web/app/components/base/logo/logo-site.tsx
+++ b/web/app/components/base/logo/logo-site.tsx
@@ -1,7 +1,6 @@
 'use client'
 import type { FC } from 'react'
 import classNames from '@/utils/classnames'
-import { useSelector } from '@/context/app-context'
 
 type LogoSiteProps = {
   className?: string
@@ -10,17 +9,10 @@ type LogoSiteProps = {
 const LogoSite: FC<LogoSiteProps> = ({
   className,
 }) => {
-  const { theme } = useSelector((s) => {
-    return {
-      theme: s.theme,
-    }
-  })
-
-  const src = theme === 'light' ? '/logo/logo-site.png' : `/logo/logo-site-${theme}.png`
   return (
     <img
-      src={src}
-      className={classNames('block w-auto h-10', className)}
+      src={'/logo/logo.png'}
+      className={classNames('block w-[22.651px] h-[24.5px]', className)}
       alt='logo'
     />
   )
diff --git a/web/app/components/billing/header-billing-btn/index.tsx b/web/app/components/billing/header-billing-btn/index.tsx
index a8415524fd..a5bc310d9b 100644
--- a/web/app/components/billing/header-billing-btn/index.tsx
+++ b/web/app/components/billing/header-billing-btn/index.tsx
@@ -7,11 +7,13 @@ import cn from '@/utils/classnames'
 import { useProviderContext } from '@/context/provider-context'
 
 type Props = {
-  onClick: () => void
+  onClick?: () => void
+  isDisplayOnly?: boolean
 }
 
 const HeaderBillingBtn: FC<Props> = ({
   onClick,
+  isDisplayOnly = false,
 }) => {
   const { plan, enableBilling, isFetchedPlan } = useProviderContext()
   const {
@@ -25,9 +27,9 @@ const HeaderBillingBtn: FC<Props> = ({
   })()
   const classNames = (() => {
     if (type === Plan.professional)
-      return 'border-[#E0F2FE] hover:border-[#B9E6FE] bg-[#E0F2FE] text-[#026AA2]'
+      return `border-[#E0F2FE] ${!isDisplayOnly ? 'hover:border-[#B9E6FE]' : ''} bg-[#E0F2FE] text-[#026AA2]`
     if (type === Plan.team)
-      return 'border-[#E0EAFF] hover:border-[#C7D7FE] bg-[#E0EAFF] text-[#3538CD]'
+      return `border-[#E0EAFF] ${!isDisplayOnly ? 'hover:border-[#C7D7FE]' : ''} bg-[#E0EAFF] text-[#3538CD]`
     return ''
   })()
 
@@ -35,10 +37,22 @@ const HeaderBillingBtn: FC<Props> = ({
     return null
 
   if (type === Plan.sandbox)
-    return <UpgradeBtn onClick={onClick} isShort />
+    return <UpgradeBtn onClick={isDisplayOnly ? undefined : onClick} isShort />
+
+  const handleClick = () => {
+    if (!isDisplayOnly && onClick)
+      onClick()
+  }
 
   return (
-    <div onClick={onClick} className={cn(classNames, 'flex items-center h-[22px] px-2 rounded-md border text-xs font-semibold uppercase cursor-pointer')}>
+    <div
+      onClick={handleClick}
+      className={cn(
+        classNames,
+        'flex items-center h-[22px] px-2 rounded-md border text-xs font-semibold uppercase',
+        isDisplayOnly ? 'cursor-default' : 'cursor-pointer',
+      )}
+    >
       {name}
     </div>
   )
diff --git a/web/app/components/header/account-dropdown/index.tsx b/web/app/components/header/account-dropdown/index.tsx
index 03157ed7cb..4c42374ffd 100644
--- a/web/app/components/header/account-dropdown/index.tsx
+++ b/web/app/components/header/account-dropdown/index.tsx
@@ -9,7 +9,6 @@ import { Menu, Transition } from '@headlessui/react'
 import Indicator from '../indicator'
 import AccountAbout from '../account-about'
 import { mailToSupport } from '../utils/util'
-import WorkplaceSelector from './workplace-selector'
 import classNames from '@/utils/classnames'
 import I18n from '@/context/i18n'
 import Avatar from '@/app/components/base/avatar'
@@ -101,10 +100,6 @@ export default function AppSelector({ isMobile }: IAppSelector) {
                       </div>
                     </div>
                   </Menu.Item>
-                  <div className='px-1 py-1'>
-                    <div className='mt-2 px-3 text-xs font-medium text-gray-500'>{t('common.userProfile.workspace')}</div>
-                    <WorkplaceSelector />
-                  </div>
                   <div className="px-1 py-1">
                     <Menu.Item>
                       <div className={itemClassName} onClick={() => setShowAccountSettingModal({ payload: 'account' })}>
diff --git a/web/app/components/header/account-dropdown/workplace-selector/index.tsx b/web/app/components/header/account-dropdown/workplace-selector/index.tsx
index 801f0b3d52..b32cb13227 100644
--- a/web/app/components/header/account-dropdown/workplace-selector/index.tsx
+++ b/web/app/components/header/account-dropdown/workplace-selector/index.tsx
@@ -2,33 +2,20 @@ import { Fragment } from 'react'
 import { useContext } from 'use-context-selector'
 import { useTranslation } from 'react-i18next'
 import { Menu, Transition } from '@headlessui/react'
-import s from './index.module.css'
+import { RiArrowDownSLine } from '@remixicon/react'
 import cn from '@/utils/classnames'
 import { switchWorkspace } from '@/service/common'
 import { useWorkspacesContext } from '@/context/workspace-context'
-import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows'
-import { Check } from '@/app/components/base/icons/src/vender/line/general'
+import HeaderBillingBtn from '@/app/components/billing/header-billing-btn'
+import { useProviderContext } from '@/context/provider-context'
 import { ToastContext } from '@/app/components/base/toast'
 
-const itemClassName = `
-  flex items-center px-3 py-2 h-10 cursor-pointer
-`
-const itemIconClassName = `
-  shrink-0 mr-2 flex items-center justify-center w-6 h-6 bg-[#EFF4FF] rounded-md text-xs font-medium text-primary-600
-`
-const itemNameClassName = `
-  grow mr-2 text-sm text-gray-700 text-left
-`
-const itemCheckClassName = `
-  shrink-0 w-4 h-4 text-primary-600
-`
-
 const WorkplaceSelector = () => {
   const { t } = useTranslation()
   const { notify } = useContext(ToastContext)
   const { workspaces } = useWorkspacesContext()
+  const { enableBilling } = useProviderContext()
   const currentWorkspace = workspaces.find(v => v.current)
-
   const handleSwitchWorkspace = async (tenant_id: string) => {
     try {
       if (currentWorkspace?.id === tenant_id)
@@ -49,13 +36,13 @@ const WorkplaceSelector = () => {
           <>
             <Menu.Button className={cn(
               `
-                ${itemClassName} w-full
-                group hover:bg-gray-50 cursor-pointer ${open && 'bg-gray-50'} rounded-lg
+                flex items-center p-0.5 gap-1.5 w-full
+                group hover:bg-state-base-hover cursor-pointer ${open && 'bg-state-base-hover'} rounded-[10px]
               `,
             )}>
-              <div className={itemIconClassName}>{currentWorkspace?.name[0].toLocaleUpperCase()}</div>
-              <div className={`${itemNameClassName} truncate`}>{currentWorkspace?.name}</div>
-              <ChevronRight className='shrink-0 w-[14px] h-[14px] text-gray-500' />
+              <div className='flex items-center justify-center w-7 h-7 bg-[#EFF4FF] rounded-md text-xs font-medium text-primary-600'>{currentWorkspace?.name[0].toLocaleUpperCase()}</div>
+              <div className={'truncate max-w-[80px] line-clamp-1 overflow-hidden text-text-secondary text-ellipsis system-sm-medium'}>{currentWorkspace?.name}</div>
+              <RiArrowDownSLine className='w-4 h-4 text-text-secondary' />
             </Menu.Button>
             <Transition
               as={Fragment}
@@ -69,19 +56,24 @@ const WorkplaceSelector = () => {
               <Menu.Items
                 className={cn(
                   `
-                    absolute top-[1px] min-w-[200px] max-h-[70vh] overflow-y-scroll z-10 bg-white border-[0.5px] border-gray-200
-                    divide-y divide-gray-100 origin-top-right rounded-xl
+                    flex w-[280px] flex-col items-start absolute left-[-15px] mt-1 rounded-xl shadows-shadow-lg
                   `,
-                  s.popup,
                 )}
               >
-                <div className="px-1 py-1">
+                <div className="flex flex-col p-1 pb-2 items-start self-stretch w-full rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadows-shadow-lg ">
+                  <div className='flex px-3 pt-1 pb-0.5 items-start self-stretch'>
+                    <span className='flex-1 text-text-tertiary system-xs-medium-uppercase'>{t('common.userProfile.workspace')}</span>
+                  </div>
                   {
                     workspaces.map(workspace => (
-                      <div className={itemClassName} key={workspace.id} onClick={() => handleSwitchWorkspace(workspace.id)}>
-                        <div className={itemIconClassName}>{workspace.name[0].toLocaleUpperCase()}</div>
-                        <div className={itemNameClassName}>{workspace.name}</div>
-                        {workspace.current && <Check className={itemCheckClassName} />}
+                      <div className='flex py-1 pl-3 pr-2 items-center gap-2 self-stretch hover:bg-state-base-hover rounded-lg' key={workspace.id} onClick={() => handleSwitchWorkspace(workspace.id)}>
+                        <div className='flex items-center justify-center w-7 h-7 bg-[#EFF4FF] rounded-md text-xs font-medium text-primary-600'>{workspace.name[0].toLocaleUpperCase()}</div>
+                        <div className='line-clamp-1 flex-grow overflow-hidden text-text-secondary text-ellipsis system-md-regular'>{workspace.name}</div>
+                        {enableBilling && (
+                          <div className='select-none'>
+                            <HeaderBillingBtn isDisplayOnly={true} />
+                          </div>
+                        )}
                       </div>
                     ))
                   }
diff --git a/web/app/components/header/index.tsx b/web/app/components/header/index.tsx
index 035cc6fd1e..8f41dee938 100644
--- a/web/app/components/header/index.tsx
+++ b/web/app/components/header/index.tsx
@@ -16,6 +16,7 @@ import GithubStar from './github-star'
 import { WorkspaceProvider } from '@/context/workspace-context'
 import { useAppContext } from '@/context/app-context'
 import LogoSite from '@/app/components/base/logo/logo-site'
+import WorkplaceSelector from '@/app/components/header/account-dropdown/workplace-selector'
 import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
 import { useProviderContext } from '@/context/provider-context'
 import { useModalContext } from '@/context/modal-context'
@@ -48,7 +49,7 @@ const Header = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [selectedSegment])
   return (
-    <div className='flex flex-1 items-center justify-between px-4'>
+    <div className='flex flex-1 items-center justify-between pr-3'>
       <div className='flex items-center'>
         {isMobile && <div
           className='flex items-center justify-center h-8 w-8 cursor-pointer'
@@ -56,23 +57,31 @@ const Header = () => {
         >
           <Bars3Icon className="h-4 w-4 text-gray-500" />
         </div>}
-        {!isMobile && <>
-          <Link href="/apps" className='flex items-center mr-4'>
+        {!isMobile
+        && <div className='flex w-64 p-2 pl-3 gap-1.5 items-center shrink-0 self-stretch'>
+          <Link href="/apps" className='flex w-8 h-8 items-center justify-center gap-2 shrink-0'>
             <LogoSite className='object-contain' />
           </Link>
-          {enableBilling && (
-            <div className='select-none'>
-              <HeaderBillingBtn onClick={handlePlanClick} />
-            </div>
-          )}
-          <GithubStar />
-        </>}
+          <div className='font-light text-divider-deep'>/</div>
+          <div className='flex items-center gap-0.5'>
+            <WorkspaceProvider>
+              <WorkplaceSelector />
+            </WorkspaceProvider>
+            {enableBilling && (
+              <div className='select-none'>
+                <HeaderBillingBtn onClick={handlePlanClick} />
+              </div>
+            )}
+          </div>
+        </div>
+        }
       </div>
       {isMobile && (
         <div className='flex'>
           <Link href="/apps" className='flex items-center mr-4'>
             <LogoSite />
           </Link>
+          <div className='font-light text-divider-deep'>/</div>
           {enableBilling && (
             <div className='select-none'>
               <HeaderBillingBtn onClick={handlePlanClick} />
@@ -94,9 +103,7 @@ const Header = () => {
         <div className='mr-3'>
           <PluginsNav />
         </div>
-        <WorkspaceProvider>
-          <AccountDropdown isMobile={isMobile} />
-        </WorkspaceProvider>
+        <AccountDropdown isMobile={isMobile} />
       </div>
       {(isMobile && isShowNavMenu) && (
         <div className='w-full flex flex-col p-2 gap-y-1'>
diff --git a/web/app/components/header/nav/index.tsx b/web/app/components/header/nav/index.tsx
index bfb4324320..de98593ddd 100644
--- a/web/app/components/header/nav/index.tsx
+++ b/web/app/components/header/nav/index.tsx
@@ -68,7 +68,7 @@ const Nav = ({
       {
         curNav && isActivated && (
           <>
-            <div className='font-light text-gray-300 '>/</div>
+            <div className='font-light text-divider-deep'>/</div>
             <NavSelector
               isApp={isApp}
               curNav={curNav}
diff --git a/web/app/components/plugins/plugin-setting/style.module.css b/web/app/components/plugins/plugin-setting/style.module.css
new file mode 100644
index 0000000000..7ad3180a5a
--- /dev/null
+++ b/web/app/components/plugins/plugin-setting/style.module.css
@@ -0,0 +1,7 @@
+.textGradient {
+  background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  text-fill-color: transparent;
+}
\ No newline at end of file
diff --git a/web/i18n/en-US/marketplace.ts b/web/i18n/en-US/marketplace.ts
index 144fa07cb4..4a53d94e57 100644
--- a/web/i18n/en-US/marketplace.ts
+++ b/web/i18n/en-US/marketplace.ts
@@ -1,5 +1,10 @@
 const translation = {
-
+  plugins: {
+    title: 'Plugins',
+  },
+  discover: {
+    title: 'Explore Marketplace',
+  },
 }
 
 export default translation
diff --git a/web/i18n/zh-Hans/marketplace.ts b/web/i18n/zh-Hans/marketplace.ts
new file mode 100644
index 0000000000..ba3b2a192f
--- /dev/null
+++ b/web/i18n/zh-Hans/marketplace.ts
@@ -0,0 +1,10 @@
+const translation = {
+  plugins: {
+    title: '插件',
+  },
+  discover: {
+    title: '探索市场',
+  },
+}
+
+export default translation
diff --git a/web/public/logo/logo.png b/web/public/logo/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..0e77ae481423960a9199a093bf49f65ee9abc35a
GIT binary patch
literal 6249
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
T*BNv-00000NkvXXu0mjf=atdo

literal 0
HcmV?d00001