diff --git a/web/app/(commonLayout)/plugins/test/card/page.tsx b/web/app/(commonLayout)/plugins/test/card/page.tsx
index 6316f40e64..a2ec11e223 100644
--- a/web/app/(commonLayout)/plugins/test/card/page.tsx
+++ b/web/app/(commonLayout)/plugins/test/card/page.tsx
@@ -1,18 +1,16 @@
 import { handleDelete } from './actions'
-import TestClientPlugin from './test-client-plugin'
 import Card from '@/app/components/plugins/card'
 import { customTool, extensionDallE, modelGPT4, toolNotion } from '@/app/components/plugins/card/card-mock'
 import PluginItem from '@/app/components/plugins/plugin-item'
 import CardMoreInfo from '@/app/components/plugins/card/card-more-info'
 import ProviderCard from '@/app/components/plugins/provider-card'
 import PluginDetailPanel from '@/app/components/plugins/plugin-detail-panel'
-import { getLocaleOnServer, useTranslation as translate } from '@/i18n/server'
+import { getLocaleOnServer } from '@/i18n/server'
 import Badge from '@/app/components/base/badge'
 
 const PluginList = async () => {
   const locale = getLocaleOnServer()
   const pluginList = [toolNotion, extensionDallE, modelGPT4, customTool]
-  const { t: pluginI8n } = await translate(locale, 'plugin')
 
   return (
     <div className='pb-3 bg-white'>
@@ -24,19 +22,14 @@ const PluginList = async () => {
               key={index}
               payload={plugin as any}
               onDelete={handleDelete}
-              pluginI8n={pluginI8n}
-              locale={locale}
             />
           ))}
         </div>
-        <h2>Client plugin item</h2>
-        <TestClientPlugin />
 
         <h2 className='my-3'>Install Plugin / Package under bundle</h2>
         <div className='w-[512px] rounded-2xl bg-background-section-burn p-2'>
           <Card
             payload={toolNotion as any}
-            locale={locale}
             descriptionLineRows={1}
             titleLeft={
               <Badge className='ml-1' text={toolNotion.version} />
@@ -47,7 +40,6 @@ const PluginList = async () => {
         <div className='w-[512px] rounded-2xl bg-background-section-burn p-2'>
           <Card
             payload={toolNotion as any}
-            locale={locale}
             descriptionLineRows={1}
             installed
           />
@@ -56,7 +48,7 @@ const PluginList = async () => {
         <h3 className='my-1'>Install model provide</h3>
         <div className='grid grid-cols-2 gap-3'>
           {pluginList.map((plugin, index) => (
-            <ProviderCard key={index} locale={locale} payload={plugin as any} />
+            <ProviderCard key={index} payload={plugin as any} />
           ))}
         </div>
 
@@ -67,7 +59,6 @@ const PluginList = async () => {
             <Card
               key={index}
               payload={plugin as any}
-              locale={locale}
               footer={
                 <CardMoreInfo downloadCount={index % 2 === 0 ? 1234 : 6} tags={index % 2 === 0 ? ['Search', 'Tag that has very very long name', 'Productivity', 'Tag2'] : []} />
               }
diff --git a/web/app/(commonLayout)/plugins/test/card/test-client-plugin.tsx b/web/app/(commonLayout)/plugins/test/card/test-client-plugin.tsx
deleted file mode 100644
index 8187428d9c..0000000000
--- a/web/app/(commonLayout)/plugins/test/card/test-client-plugin.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-'use client'
-import React from 'react'
-import { useTranslation } from 'react-i18next'
-import { useContext } from 'use-context-selector'
-import { extensionDallE } from '@/app/components/plugins/card/card-mock'
-import PluginItem from '@/app/components/plugins/plugin-item'
-import I18n from '@/context/i18n'
-
-const TestClientPlugin = () => {
-  const { locale } = useContext(I18n)
-  const { t } = useTranslation()
-  return (
-    <PluginItem
-      payload={extensionDallE as any}
-      onDelete={() => { }}
-      pluginI8n={t}
-      locale={locale}
-    />
-  )
-}
-export default React.memo(TestClientPlugin)
diff --git a/web/app/components/header/account-setting/model-provider-page/index.tsx b/web/app/components/header/account-setting/model-provider-page/index.tsx
index 70965c0b6b..6e441c3dc9 100644
--- a/web/app/components/header/account-setting/model-provider-page/index.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/index.tsx
@@ -115,7 +115,7 @@ const ModelProviderPage = () => {
           'shrink-0 relative flex items-center justify-end gap-2 p-0.5 rounded-lg border border-transparent',
           defaultModelNotConfigured && 'pl-2 bg-components-panel-bg-blur border-components-panel-border shadow-xs',
         )}>
-          {defaultModelNotConfigured && <div className='absolute top-0 bottom-0 right-0 left-0 opacity-40' style={{ background: 'linear-gradient(92deg, rgba(247, 144, 9, 0.25) 0%, rgba(255, 255, 255, 0.00) 100%)' }}/>}
+          {defaultModelNotConfigured && <div className='absolute top-0 bottom-0 right-0 left-0 opacity-40' style={{ background: 'linear-gradient(92deg, rgba(247, 144, 9, 0.25) 0%, rgba(255, 255, 255, 0.00) 100%)' }} />}
           {defaultModelNotConfigured && (
             <div className='flex items-center gap-1 text-text-primary system-xs-medium'>
               <RiAlertFill className='w-4 h-4 text-text-warning-secondary' />
@@ -185,7 +185,7 @@ const ModelProviderPage = () => {
         {!collapse && (
           <div className='grid grid-cols-2 gap-2'>
             {pluginList.map((plugin, index) => (
-              <ProviderCard key={index} installed={false} locale={locale} payload={plugin as any} />
+              <ProviderCard key={index} installed={false} payload={plugin as any} />
             ))}
           </div>
         )}
diff --git a/web/app/components/plugins/card/index.tsx b/web/app/components/plugins/card/index.tsx
index d68c410a49..ef0c146512 100644
--- a/web/app/components/plugins/card/index.tsx
+++ b/web/app/components/plugins/card/index.tsx
@@ -1,4 +1,6 @@
+'use client'
 import React from 'react'
+import { useContext } from 'use-context-selector'
 import { RiVerifiedBadgeLine } from '@remixicon/react'
 import type { Plugin } from '../types'
 import Icon from '../card/base/card-icon'
@@ -8,18 +10,16 @@ import OrgInfo from './base/org-info'
 import Description from './base/description'
 import Placeholder from './base/placeholder'
 import cn from '@/utils/classnames'
-import type { Locale } from '@/i18n'
+import I18n from '@/context/i18n'
 
 type Props = {
   className?: string
   payload: Plugin
-  locale: Locale // The component is used in both client and server side, so we can't get the locale from both side(getLocaleOnServer and useContext)
   titleLeft?: React.ReactNode
   installed?: boolean
   hideCornerMark?: boolean
   descriptionLineRows?: number
   footer?: React.ReactNode
-  serverLocale?: Locale
   isLoading?: boolean
   loadingFileName?: string
 }
@@ -32,10 +32,11 @@ const Card = ({
   hideCornerMark,
   descriptionLineRows = 2,
   footer,
-  locale,
   isLoading = false,
   loadingFileName,
 }: Props) => {
+  const { locale } = useContext(I18n)
+
   const { type, name, org, label, brief, icon } = payload
 
   const getLocalizedText = (obj: Record<string, string> | undefined) =>
@@ -80,4 +81,4 @@ const Card = ({
   )
 }
 
-export default Card
+export default React.memo(Card)
diff --git a/web/app/components/plugins/install-plugin/install-from-local-package/index.tsx b/web/app/components/plugins/install-plugin/install-from-local-package/index.tsx
index 87e470584e..6fd0feead9 100644
--- a/web/app/components/plugins/install-plugin/install-from-local-package/index.tsx
+++ b/web/app/components/plugins/install-plugin/install-from-local-package/index.tsx
@@ -69,7 +69,6 @@ const InstallFromLocalPackage: React.FC<InstallFromLocalPackageProps> = ({ onClo
         <div className='flex p-2 items-start content-start gap-1 self-stretch flex-wrap rounded-2xl bg-background-section-burn'>
           <Card
             className='w-full'
-            locale={locale}
             payload={status === 'uploading' ? { name: 'notion-sync' } as any : toolNotion as any}
             isLoading={status === 'uploading'}
             loadingFileName='notion-sync.difypkg'
@@ -85,7 +84,7 @@ const InstallFromLocalPackage: React.FC<InstallFromLocalPackageProps> = ({ onClo
           : (
             <>
               <Button variant='secondary' className='min-w-[72px]' onClick={onClose}>
-              Cancel
+                Cancel
               </Button>
               <Button
                 variant='primary'
diff --git a/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx b/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx
index 96deec4da9..ddea0c346f 100644
--- a/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx
+++ b/web/app/components/plugins/install-plugin/install-from-marketplace/index.tsx
@@ -1,7 +1,6 @@
 'use client'
 
 import React, { useMemo, useState } from 'react'
-import { useContext } from 'use-context-selector'
 import { RiInformation2Line } from '@remixicon/react'
 import Card from '../../card'
 import { extensionDallE, modelGPT4, toolNotion } from '../../card/card-mock'
@@ -9,14 +8,12 @@ import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
 import Checkbox from '@/app/components/base/checkbox'
 import Badge, { BadgeState } from '@/app/components/base/badge/index'
-import I18n from '@/context/i18n'
 
 type InstallFromMarketplaceProps = {
   onClose: () => void
 }
 
 const InstallFromMarketplace: React.FC<InstallFromMarketplaceProps> = ({ onClose }) => {
-  const { locale } = useContext(I18n)
   const plugins = useMemo(() => [toolNotion, extensionDallE, modelGPT4], [])
   const [selectedPlugins, setSelectedPlugins] = useState<Set<number>>(new Set())
   const [isInstalling, setIsInstalling] = useState(false)
@@ -40,7 +37,6 @@ const InstallFromMarketplace: React.FC<InstallFromMarketplaceProps> = ({ onClose
       key={index}
       installed={nextStep && !isInstalling}
       payload={plugin}
-      locale={locale}
       className='w-full'
       titleLeft={
         plugin.version === plugin.latest_version
@@ -115,7 +111,7 @@ const InstallFromMarketplace: React.FC<InstallFromMarketplaceProps> = ({ onClose
           : (
             <>
               <Button variant='secondary' className='min-w-[72px]' onClick={onClose}>
-              Cancel
+                Cancel
               </Button>
               <Button
                 variant='primary'
@@ -126,7 +122,7 @@ const InstallFromMarketplace: React.FC<InstallFromMarketplaceProps> = ({ onClose
                   mockInstall()
                 }}
               >
-              Install
+                Install
               </Button>
             </>
           )}
diff --git a/web/app/components/plugins/marketplace/list/index.tsx b/web/app/components/plugins/marketplace/list/index.tsx
index fa5975bb5a..c3d7ff1d24 100644
--- a/web/app/components/plugins/marketplace/list/index.tsx
+++ b/web/app/components/plugins/marketplace/list/index.tsx
@@ -13,35 +13,30 @@ const List = () => {
         <div className='system-xs-regular text-text-tertiary'>Our top picks to get you started</div>
         <div className='grid grid-cols-4 gap-3 mt-2'>
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
@@ -54,168 +49,144 @@ const List = () => {
         <div className='system-xs-regular text-text-tertiary'>Explore the library and discover the incredible work of our community</div>
         <div className='grid grid-cols-4 gap-3 mt-2'>
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
diff --git a/web/app/components/plugins/plugin-item/index.tsx b/web/app/components/plugins/plugin-item/index.tsx
index 452796c27b..08e4bf1419 100644
--- a/web/app/components/plugins/plugin-item/index.tsx
+++ b/web/app/components/plugins/plugin-item/index.tsx
@@ -1,6 +1,9 @@
+'use client'
 import type { FC } from 'react'
 import React from 'react'
+import { useContext } from 'use-context-selector'
 import { RiArrowRightUpLine, RiLoginCircleLine, RiVerifiedBadgeLine } from '@remixicon/react'
+import { useTranslation } from 'react-i18next'
 import { Github } from '../../base/icons/src/public/common'
 import Badge from '../../base/badge'
 import type { Plugin } from '../types'
@@ -11,26 +14,21 @@ import OrgInfo from '../card/base/org-info'
 import Title from '../card/base/title'
 import Action from './action'
 import cn from '@/utils/classnames'
-import type { Locale } from '@/i18n'
+import I18n from '@/context/i18n'
 
 type Props = {
   className?: string
   payload: Plugin
-  locale: Locale
   onDelete: () => void
-  pluginI8n: any
-  isClient?: boolean
 }
 
 const PluginItem: FC<Props> = ({
   className,
   payload,
   onDelete,
-  locale,
-  pluginI8n,
-  isClient,
 }) => {
-  const t = (key: string, param?: object) => pluginI8n(`${isClient ? 'plugin.' : ''}${key}`, param)
+  const { locale } = useContext(I18n)
+  const { t } = useTranslation()
 
   const { type, name, org, label } = payload
   const hasNewVersion = payload.latest_version !== payload.version
@@ -74,12 +72,12 @@ const PluginItem: FC<Props> = ({
           <div className='mx-2 text-text-quaternary system-xs-regular'>·</div>
           <div className='flex text-text-tertiary system-xs-regular space-x-1'>
             <RiLoginCircleLine className='w-4 h-4' />
-            <span>{t('endpointsEnabled', { num: 2 })}</span>
+            <span>{t('plugin.endpointsEnabled', { num: 2 })}</span>
           </div>
         </div>
 
         <div className='flex items-center'>
-          <a href='' target='_blank' className='mr-1 text-text-tertiary system-2xs-medium-uppercase'>{t('from')}</a>
+          <a href='' target='_blank' className='mr-1 text-text-tertiary system-2xs-medium-uppercase'>{t('plugin.from')}</a>
           <div className='flex items-center space-x-0.5 text-text-secondary'>
             <Github className='ml-1 w-3 h-3' />
             <div className='system-2xs-semibold-uppercase'>GitHub</div>
@@ -91,4 +89,4 @@ const PluginItem: FC<Props> = ({
   )
 }
 
-export default PluginItem
+export default React.memo(PluginItem)
diff --git a/web/app/components/plugins/provider-card.tsx b/web/app/components/plugins/provider-card.tsx
index 2445c4b9ab..7d9f21ea43 100644
--- a/web/app/components/plugins/provider-card.tsx
+++ b/web/app/components/plugins/provider-card.tsx
@@ -1,4 +1,6 @@
+'use client'
 import React from 'react'
+import { useContext } from 'use-context-selector'
 import type { FC } from 'react'
 import Link from 'next/link'
 import { RiArrowRightUpLine, RiVerifiedBadgeLine } from '@remixicon/react'
@@ -9,22 +11,21 @@ import Icon from './card/base/card-icon'
 import Title from './card/base/title'
 import DownloadCount from './card/base/download-count'
 import Button from '@/app/components/base/button'
-import type { Locale } from '@/i18n'
 import cn from '@/utils/classnames'
+import I18n from '@/context/i18n'
 
 type Props = {
   className?: string
-  locale: Locale // The component is used in both client and server side, so we can't get the locale from both side(getLocaleOnServer and useContext)
   payload: Plugin
   installed?: boolean
 }
 
 const ProviderCard: FC<Props> = ({
   className,
-  locale,
   payload,
   installed = true,
 }) => {
+  const { locale } = useContext(I18n)
   const { org, label } = payload
 
   return (
diff --git a/web/app/components/plugins/update-plugin/index.tsx b/web/app/components/plugins/update-plugin/index.tsx
index d0abd21e0c..0a358debac 100644
--- a/web/app/components/plugins/update-plugin/index.tsx
+++ b/web/app/components/plugins/update-plugin/index.tsx
@@ -1,14 +1,12 @@
 'use client'
 import type { FC } from 'react'
 import React, { useCallback, useMemo, useState } from 'react'
-import { useContext } from 'use-context-selector'
 import { RiInformation2Line } from '@remixicon/react'
 import { useTranslation } from 'react-i18next'
 import Card from '@/app/components/plugins/card'
 import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
 import Badge, { BadgeState } from '@/app/components/base/badge/index'
-import I18n from '@/context/i18n'
 import { toolNotion } from '@/app/components/plugins/card/card-mock'
 
 const i18nPrefix = 'plugin.upgrade'
@@ -26,7 +24,6 @@ enum UploadStep {
 const UpdatePluginModal: FC<Props> = ({
   onHide,
 }) => {
-  const { locale } = useContext(I18n)
   const { t } = useTranslation()
   const [uploadStep, setUploadStep] = useState<UploadStep>(UploadStep.notStarted)
   const configBtnText = useMemo(() => {
@@ -62,7 +59,6 @@ const UpdatePluginModal: FC<Props> = ({
         <Card
           installed={uploadStep === UploadStep.installed}
           payload={toolNotion as any}
-          locale={locale}
           className='w-full'
           titleLeft={
             <>
diff --git a/web/app/components/tools/marketplace.tsx b/web/app/components/tools/marketplace.tsx
index 56f85d447d..9608f4ac69 100644
--- a/web/app/components/tools/marketplace.tsx
+++ b/web/app/components/tools/marketplace.tsx
@@ -45,35 +45,30 @@ const Marketplace = ({
         <div className='system-xs-regular text-text-tertiary'>Our top picks to get you started</div>
         <div className='grid grid-cols-4 gap-3 mt-2'>
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
@@ -86,168 +81,144 @@ const Marketplace = ({
         <div className='system-xs-regular text-text-tertiary'>Explore the library and discover the incredible work of our community</div>
         <div className='grid grid-cols-4 gap-3 mt-2'>
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
             }
           />
           <Card
-            locale={locale}
             payload={toolNotion as any}
             footer={
               <CardMoreInfo downloadCount={1234} tags={['Search', 'Productivity']} />
diff --git a/web/app/components/tools/provider-list.tsx b/web/app/components/tools/provider-list.tsx
index e0ee954e62..6f8fbc76bf 100644
--- a/web/app/components/tools/provider-list.tsx
+++ b/web/app/components/tools/provider-list.tsx
@@ -112,7 +112,6 @@ const ProviderList = () => {
                   currentProvider?.id === collection.id && 'border-components-option-card-option-selected-border',
                 )}
                 hideCornerMark
-                locale={language}
                 payload={{
                   ...collection,
                   brief: collection.description,