From 2442d3bf525b6d5bd4c9e83dd040c4f74f523372 Mon Sep 17 00:00:00 2001
From: Junyan Qin <rockchinq@gmail.com>
Date: Sat, 25 Apr 2026 21:51:40 +0800
Subject: [PATCH] feat(web): add Page component filter to in-app marketplace

Add Page toggle button with PanelTop icon to the in-app plugin
marketplace component filter bar.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../components/plugin-market/PluginMarketComponent.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/web/src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx b/web/src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx
index 2b898cca..1169e16b 100644
--- a/web/src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx
+++ b/web/src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx
@@ -16,6 +16,7 @@ import {
   Hash,
   Book,
   FileText,
+  PanelTop,
 } from 'lucide-react';
 import PluginMarketCardComponent from './plugin-market-card/PluginMarketCardComponent';
 import { PluginMarketCardVO } from './plugin-market-card/PluginMarketCardVO';
@@ -53,6 +54,7 @@ function MarketPageContent({
     'EventListener',
     'KnowledgeEngine',
     'Parser',
+    'Page',
   ];
 
   const [searchQuery, setSearchQuery] = useState('');
@@ -530,6 +532,14 @@ function MarketPageContent({
                   <FileText className="h-4 w-4 mr-1" />
                   {t('plugins.componentName.Parser')}
                 </ToggleGroupItem>
+                <ToggleGroupItem
+                  value="Page"
+                  aria-label="Page"
+                  className="text-xs sm:text-sm cursor-pointer"
+                >
+                  <PanelTop className="h-4 w-4 mr-1" />
+                  {t('plugins.componentName.Page')}
+                </ToggleGroupItem>
               </ToggleGroup>
             </div>
           </div>