feat: filter title

web/app/components/explore/app-list/index.tsx

@@ -23,6 +23,7 @@ import {
 import { useImportDSL } from '@/hooks/use-import-dsl'
 import DSLConfirmModal from '@/app/components/app/create-from-dsl-modal/dsl-confirm-modal'
 import Banner from '../banner'
+import Button from '../../base/button'
 
 type AppsProps = {
   onSuccess?: () => void
@@ -43,6 +44,12 @@ const Apps = ({
   const [keywords, setKeywords] = useState('')
   const [searchKeywords, setSearchKeywords] = useState('')
 
+  const hasFilterCondition = !!keywords
+  const handleResetFilter = useCallback(() => {
+    setKeywords('')
+    setSearchKeywords('')
+  }, [])
+
   const { run: handleSearch } = useDebounceFn(() => {
     setSearchKeywords(keywords)
   }, { wait: 500 })
@@ -150,7 +157,15 @@ const Apps = ({
       <div className={cn(
         'mt-6 flex items-center justify-between px-12',
       )}>
-        <div className={'system-xl-semibold grow truncate text-text-primary'}>{t('explore.apps.title')}</div>
+        <div className='flex items-center'>
+          <div className={'system-xl-semibold grow truncate text-text-primary'}>{!hasFilterCondition ? t('explore.apps.title') : t('explore.apps.resultNum', { num: searchFilteredList.length })}</div>
+          {hasFilterCondition && (
+            <>
+              <div className='mx-3 h-4 w-px bg-divider-regular'></div>
+              <Button size='medium' onClick={handleResetFilter}>{t('explore.apps.resetFilter')}</Button>
+            </>
+          )}
+        </div>
         <Input
           showLeftIcon
           showClearIcon

web/i18n/en-US/explore.ts

@@ -18,6 +18,8 @@ const translation = {
   apps: {
     title: 'Try Dify\'s curated apps to find AI solutions for your business',
     allCategories: 'All',
+    resultNum: '{{num}} results',
+    resetFilter: 'Clear filter',
   },
   appCard: {
     addToWorkspace: 'Add to Workspace',

web/i18n/ja-JP/explore.ts

@@ -18,6 +18,8 @@ const translation = {
   apps: {
     title: 'Difyの厳選アプリを試して、ビジネス向けのAIソリューションを見つけましょう',
     allCategories: '全て',
+    resultNum: '{{num}}件の結果',
+    resetFilter: 'クリア',
   },
   appCard: {
     addToWorkspace: 'ワークスペースに追加',

web/i18n/zh-Hans/explore.ts

@@ -18,6 +18,8 @@ const translation = {
   apps: {
     title: '试用 Dify 精选示例应用，为您的业务寻找 AI 解决方案',
     allCategories: '所有',
+    resultNum: '{{num}} 个结果',
+    resetFilter: '清除筛选',
   },
   appCard: {
     addToWorkspace: '添加到工作区',