diff --git a/web/app/components/app/configuration/config/agent/agent-tools/index.tsx b/web/app/components/app/configuration/config/agent/agent-tools/index.tsx
index d83fcb3637..35cee8eefc 100644
--- a/web/app/components/app/configuration/config/agent/agent-tools/index.tsx
+++ b/web/app/components/app/configuration/config/agent/agent-tools/index.tsx
@@ -92,7 +92,7 @@ const AgentTools: FC = () => {
         tool_name: tool.tool_name,
         tool_label: tool.tool_label,
         tool_parameters: tool.params,
-        notAuthor: !(tool as ToolDefaultValue & { is_team_authorization: boolean }).is_team_authorization,
+        notAuthor: !tool.is_team_authorization,
         enabled: true,
       })
     })
diff --git a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
index b1788b89bc..e6ce15d696 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-modal/Form.tsx
@@ -114,7 +114,7 @@ const Form: FC<FormProps> = ({
       const disabled = readonly || (isEditMode && (variable === '__model_type' || variable === '__model_name'))
       return (
         <div key={variable} className={cn(itemClassName, 'py-3')}>
-          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-regular text-text-secondary')}>
+          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-semibold text-text-secondary')}>
             {label[language] || label.en_US}
             {
               required && (
@@ -155,7 +155,7 @@ const Form: FC<FormProps> = ({
 
       return (
         <div key={variable} className={cn(itemClassName, 'py-3')}>
-          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-regular text-text-secondary')}>
+          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-semibold text-text-secondary')}>
             {label[language] || label.en_US}
             {
               required && (
@@ -211,7 +211,7 @@ const Form: FC<FormProps> = ({
 
       return (
         <div key={variable} className={cn(itemClassName, 'py-3')}>
-          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-regular text-text-secondary')}>
+          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-semibold text-text-secondary')}>
             {label[language] || label.en_US}
 
             {
@@ -254,7 +254,7 @@ const Form: FC<FormProps> = ({
 
       return (
         <div key={variable} className={cn(itemClassName, 'py-3')}>
-          <div className='flex items-center justify-between py-2 system-sm-regular text-text-secondary'>
+          <div className='flex items-center justify-between py-2 system-sm-semibold text-text-secondary'>
             <div className='flex items-center space-x-2'>
               <span className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-regular text-text-secondary')}>{label[language] || label.en_US}</span>
               {
@@ -287,7 +287,7 @@ const Form: FC<FormProps> = ({
 
       return (
         <div key={variable} className={cn(itemClassName, 'py-3')}>
-          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-regular text-text-secondary')}>
+          <div className={cn(fieldLabelClassName, 'flex items-center py-2 system-sm-semibold text-text-secondary')}>
             {label[language] || label.en_US}
             {
               required && (
diff --git a/web/app/components/plugins/plugin-detail-panel/endpoint-modal.tsx b/web/app/components/plugins/plugin-detail-panel/endpoint-modal.tsx
index 63b580429f..342b66e948 100644
--- a/web/app/components/plugins/plugin-detail-panel/endpoint-modal.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/endpoint-modal.tsx
@@ -40,7 +40,10 @@ const EndpointModal: FC<Props> = ({
     onSaved(tempCredential)
   }
 
-  const [mockTool, setTool] = useState<any>()
+  const [mockTool, setTool] = useState<any>({
+    provider: 'langgenius/google/google',
+    tool_name: 'google_search',
+  })
 
   return (
     <Drawer
diff --git a/web/app/components/tools/tool-selector/index.tsx b/web/app/components/tools/tool-selector/index.tsx
index af78695740..2689abbbc6 100644
--- a/web/app/components/tools/tool-selector/index.tsx
+++ b/web/app/components/tools/tool-selector/index.tsx
@@ -9,14 +9,19 @@ import {
 } from '@/app/components/base/portal-to-follow-elem'
 import ToolTrigger from '@/app/components/tools/tool-selector/tool-trigger'
 import ToolPicker from '@/app/components/workflow/block-selector/tool-picker'
+import Loading from '@/app/components/base/loading'
+import Button from '@/app/components/base/button'
+import Indicator from '@/app/components/header/indicator'
 
+import { useAppContext } from '@/context/app-context'
 import { useAllBuiltInTools, useAllCustomTools, useAllWorkflowTools } from '@/service/use-tools'
-// import AddToolModal from '@/app/components/tools/add-tool-modal'
+import { CollectionType } from '@/app/components/tools/types'
 import type { ToolDefaultValue } from '@/app/components/workflow/block-selector/types'
 import type {
   OffsetOptions,
   Placement,
 } from '@floating-ui/react'
+import cn from '@/utils/classnames'
 
 type Props = {
   value?: {
@@ -36,7 +41,7 @@ const ToolSelector: FC<Props> = ({
   value,
   disabled,
   placement = 'bottom',
-  offset = 0,
+  offset = 4,
   onSelect,
 }) => {
   const { t } = useTranslation()
@@ -45,6 +50,7 @@ const ToolSelector: FC<Props> = ({
     if (disabled) return
     onShowChange(true)
   }
+
   const { data: buildInTools } = useAllBuiltInTools()
   const { data: customTools } = useAllCustomTools()
   const { data: workflowTools } = useAllWorkflowTools()
@@ -55,24 +61,29 @@ const ToolSelector: FC<Props> = ({
     })
   }, [value, buildInTools, customTools, workflowTools])
   const [isShowChooseTool, setIsShowChooseTool] = useState(false)
-  const [isShowSettingAuth, setShowSettingAuth] = useState(false)
-
-  const handleToolAuthSetting = (value: any) => {
-    // const newModelConfig = produce(modelConfig, (draft) => {
-    //   const tool = (draft.agentConfig.tools).find((item: any) => item.provider_id === value?.collection?.id && item.tool_name === value?.tool_name)
-    //   if (tool)
-    //     (tool as AgentTool).notAuthor = false
-    // })
-    // setModelConfig(newModelConfig)
-  }
-
   const handleSelectTool = (tool: ToolDefaultValue) => {
     const toolValue = {
       provider: tool.provider_id,
       tool_name: tool.tool_name,
     }
     onSelect(toolValue)
+    setIsShowChooseTool(false)
+    if (tool.provider_type === CollectionType.builtIn && tool.is_team_authorization)
+      onShowChange(false)
   }
+  const { isCurrentWorkspaceManager } = useAppContext()
+  const [authLoading, setAuthLoading] = useState(false)
+
+  // const [isShowSettingAuth, setShowSettingAuth] = useState(false)
+
+  // const handleToolAuthSetting = (value: any) => {
+  //   const newModelConfig = produce(modelConfig, (draft) => {
+  //     const tool = (draft.agentConfig.tools).find((item: any) => item.provider_id === value?.collection?.id && item.tool_name === value?.tool_name)
+  //     if (tool)
+  //       (tool as AgentTool).notAuthor = false
+  //   })
+  //   setModelConfig(newModelConfig)
+  // }
 
   return (
     <>
@@ -86,15 +97,26 @@ const ToolSelector: FC<Props> = ({
           className='w-full'
           onClick={handleTriggerClick}
         >
-          <ToolTrigger open={isShow} provider={currentProvider} />
+          <ToolTrigger
+            open={isShow}
+            value={value}
+            provider={currentProvider}
+          />
         </PortalToFollowElemTrigger>
         <PortalToFollowElemContent className='z-[1000]'>
           <div className="relative w-[389px] min-h-20 rounded-xl bg-components-panel-bg-blur border-[0.5px] border-components-panel-border shadow-lg">
             <div className='px-4 py-3 flex flex-col gap-1'>
-              <div className='h-6 flex items-center system-sm-regular text-text-secondary'>Tool</div>
+              <div className='h-6 flex items-center system-sm-semibold text-text-secondary'>{t('tools.toolSelector.label')}</div>
               <ToolPicker
                 placement='bottom'
-                trigger={<ToolTrigger open={isShowChooseTool} provider={currentProvider} />}
+                offset={offset}
+                trigger={
+                  <ToolTrigger
+                    open={isShowChooseTool}
+                    value={value}
+                    provider={currentProvider}
+                  />
+                }
                 isShow={isShowChooseTool}
                 onShowChange={setIsShowChooseTool}
                 disabled={false}
@@ -102,6 +124,37 @@ const ToolSelector: FC<Props> = ({
                 onSelect={handleSelectTool}
               />
             </div>
+            {/* authorization panel */}
+            {authLoading && (
+              <div className='px-4 py-3 flex items-center justify-center'><Loading type='app' /></div>
+            )}
+            {!authLoading && currentProvider && currentProvider.type === CollectionType.builtIn && currentProvider.is_team_authorization && currentProvider.allow_delete && (
+              <div className='px-4 py-3 flex items-center border-t border-divider-subtle'>
+                <div className='grow mr-3 h-6 flex items-center system-sm-semibold text-text-secondary'>{t('tools.toolSelector.auth')}</div>
+                {isCurrentWorkspaceManager && (
+                  <Button
+                    variant='secondary'
+                    size='small'
+                    onClick={() => {}}
+                  >
+                    <Indicator className='mr-2' color={'green'} />
+                    {t('tools.auth.authorized')}
+                  </Button>
+                )}
+              </div>
+            )}
+            {!authLoading && currentProvider && currentProvider.type === CollectionType.builtIn && !currentProvider.is_team_authorization && currentProvider.allow_delete && (
+              <div className='px-4 py-3 flex items-center border-t border-divider-subtle'>
+                <Button
+                  variant='primary'
+                  className={cn('shrink-0 w-full')}
+                  onClick={() => {}}
+                  disabled={!isCurrentWorkspaceManager}
+                >
+                  {t('tools.auth.unauthorized')}
+                </Button>
+              </div>
+            )}
           </div>
         </PortalToFollowElemContent>
       </PortalToFollowElem>
diff --git a/web/app/components/tools/tool-selector/tool-trigger.tsx b/web/app/components/tools/tool-selector/tool-trigger.tsx
index 79efa4a06a..e481448bcd 100644
--- a/web/app/components/tools/tool-selector/tool-trigger.tsx
+++ b/web/app/components/tools/tool-selector/tool-trigger.tsx
@@ -1,5 +1,6 @@
 'use client'
 import React from 'react'
+import { useTranslation } from 'react-i18next'
 import {
   RiArrowDownSLine,
 } from '@remixicon/react'
@@ -22,20 +23,27 @@ const ToolTrigger = ({
   provider,
   value,
 }: Props) => {
+  const { t } = useTranslation()
   return (
-    <div className={cn('group flex items-center p-2 pl-3 bg-components-input-bg-normal rounded-lg hover:bg-state-base-hover-alt', open && 'bg-state-base-hover-alt')}>
+    <div className={cn(
+      'group flex items-center p-2 pl-3 bg-components-input-bg-normal rounded-lg cursor-pointer hover:bg-state-base-hover-alt',
+      open && 'bg-state-base-hover-alt',
+      value && 'pl-1.5 py-1.5',
+    )}>
       {value && provider && (
-        <BlockIcon
-          className='shrink-0'
-          type={BlockEnum.Tool}
-          toolIcon={provider.icon}
-        />
+        <div className='shrink-0 mr-1 p-px rounded-lg bg-components-panel-bg border border-components-panel-border'>
+          <BlockIcon
+            className='!w-4 !h-4'
+            type={BlockEnum.Tool}
+            toolIcon={provider.icon}
+          />
+        </div>
       )}
       {value && (
-        <div className='grow system-sm-regular text-text-secondary'>{value.tool_name}</div>
+        <div className='grow system-sm-regular text-components-input-text-filled'>{value.tool_name}</div>
       )}
       {!value && (
-        <div className='grow text-components-input-text-placeholder system-sm-regular'>Select a tool ...</div>
+        <div className='grow text-components-input-text-placeholder system-sm-regular'>{t('tools.toolSelector.placeholder')}</div>
       )}
       <RiArrowDownSLine className={cn('shrink-0 ml-0.5 w-4 h-4 text-text-quaternary group-hover:text-text-secondary', open && 'text-text-secondary')} />
     </div>
diff --git a/web/app/components/workflow/block-selector/tool-picker.tsx b/web/app/components/workflow/block-selector/tool-picker.tsx
index 1990c6daca..60de09d3e6 100644
--- a/web/app/components/workflow/block-selector/tool-picker.tsx
+++ b/web/app/components/workflow/block-selector/tool-picker.tsx
@@ -106,7 +106,7 @@ const ToolPicker: FC<Props> = ({
       </PortalToFollowElemTrigger>
 
       <PortalToFollowElemContent className='z-[1000]'>
-        <div className="relative w-[320px] min-h-20 rounded-xl bg-components-panel-bg-blur border-[0.5px] border-components-panel-border shadow-lg">
+        <div className="relative w-[356px] min-h-20 rounded-xl bg-components-panel-bg-blur border-[0.5px] border-components-panel-border shadow-lg">
           <div className='p-2 pb-1'>
             <SearchBox
               search={searchText}
diff --git a/web/app/components/workflow/block-selector/tool/action-item.tsx b/web/app/components/workflow/block-selector/tool/action-item.tsx
index cc49039948..7a7abe9e03 100644
--- a/web/app/components/workflow/block-selector/tool/action-item.tsx
+++ b/web/app/components/workflow/block-selector/tool/action-item.tsx
@@ -12,7 +12,7 @@ import BlockIcon from '../../block-icon'
 type Props = {
   provider: ToolWithProvider
   payload: Tool
-  onSelect: (type: BlockEnum, tool?: ToolDefaultValue & { is_team_authorization: boolean }) => void
+  onSelect: (type: BlockEnum, tool?: ToolDefaultValue) => void
 }
 
 const ToolItem: FC<Props> = ({
diff --git a/web/app/components/workflow/block-selector/types.ts b/web/app/components/workflow/block-selector/types.ts
index 9bdbf5cb3c..ffe6cc627c 100644
--- a/web/app/components/workflow/block-selector/types.ts
+++ b/web/app/components/workflow/block-selector/types.ts
@@ -25,5 +25,6 @@ export type ToolDefaultValue = {
   tool_name: string
   tool_label: string
   title: string
+  is_team_authorization: boolean
   params: Record<string, any>
 }
diff --git a/web/i18n/en-US/tools.ts b/web/i18n/en-US/tools.ts
index 9c2d22b711..37250473d6 100644
--- a/web/i18n/en-US/tools.ts
+++ b/web/i18n/en-US/tools.ts
@@ -149,6 +149,11 @@ const translation = {
   openInStudio: 'Open in Studio',
   toolNameUsageTip: 'Tool call name for agent reasoning and prompting',
   copyToolName: 'Copy Name',
+  toolSelector: {
+    label: 'TOOL',
+    placeholder: 'Select a tool...',
+    auth: 'AUTHORIZATION',
+  },
 }
 
 export default translation
diff --git a/web/i18n/zh-Hans/tools.ts b/web/i18n/zh-Hans/tools.ts
index fa1e8344a7..f3ec76aa97 100644
--- a/web/i18n/zh-Hans/tools.ts
+++ b/web/i18n/zh-Hans/tools.ts
@@ -149,6 +149,10 @@ const translation = {
   openInStudio: '在工作室中打开',
   toolNameUsageTip: '工具调用名称，用于 Agent 推理和提示词',
   copyToolName: '复制名称',
+  toolSelector: {
+    label: '工具',
+    placeholder: '选择一个工具...',
+  },
 }
 
 export default translation