diff --git a/clients/web/src/components/groups/HistoryControls/HistoryControls.stories.tsx b/clients/web/src/components/groups/HistoryControls/HistoryControls.stories.tsx
index 14fa3df4..0e7910d8 100644
--- a/clients/web/src/components/groups/HistoryControls/HistoryControls.stories.tsx
+++ b/clients/web/src/components/groups/HistoryControls/HistoryControls.stories.tsx
@@ -15,8 +15,6 @@ export const Default: Story = {
searchText: "",
onSearchChange: fn(),
onMethodFilterChange: fn(),
- onClearAll: fn(),
- onExport: fn(),
},
};
@@ -26,7 +24,5 @@ export const WithFilters: Story = {
methodFilter: "tools/call",
onSearchChange: fn(),
onMethodFilterChange: fn(),
- onClearAll: fn(),
- onExport: fn(),
},
};
diff --git a/clients/web/src/components/groups/HistoryControls/HistoryControls.tsx b/clients/web/src/components/groups/HistoryControls/HistoryControls.tsx
index 361a3215..dacb874b 100644
--- a/clients/web/src/components/groups/HistoryControls/HistoryControls.tsx
+++ b/clients/web/src/components/groups/HistoryControls/HistoryControls.tsx
@@ -1,4 +1,4 @@
-import { Button, Group, Select, Stack, TextInput, Title } from "@mantine/core";
+import { Select, Stack, TextInput, Title } from "@mantine/core";
const METHOD_OPTIONS = [
"tools/call",
@@ -11,18 +11,11 @@ const METHOD_OPTIONS = [
"elicitation/create",
];
-const ToolbarButton = Button.withProps({
- variant: "light",
- size: "sm",
-});
-
export interface HistoryControlsProps {
searchText: string;
methodFilter?: string;
onSearchChange: (text: string) => void;
onMethodFilterChange: (method: string) => void;
- onClearAll: () => void;
- onExport: () => void;
}
export function HistoryControls({
@@ -30,14 +23,10 @@ export function HistoryControls({
methodFilter,
onSearchChange,
onMethodFilterChange,
- onClearAll,
- onExport,
}: HistoryControlsProps) {
return (
History
-
- Search
onMethodFilterChange(value ?? "")}
clearable
/>
-
-
- Export JSON
- Clear All
-
);
}
diff --git a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.stories.tsx b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.stories.tsx
index 3812150c..1acfcddb 100644
--- a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.stories.tsx
+++ b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.stories.tsx
@@ -8,6 +8,8 @@ const meta: Meta = {
component: HistoryListPanel,
args: {
searchText: "",
+ onClearAll: fn(),
+ onExport: fn(),
},
};
diff --git a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
index e6a66def..a249572d 100644
--- a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
+++ b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
@@ -1,5 +1,13 @@
import { useMemo, useState } from "react";
-import { Group, Paper, ScrollArea, Stack, Text, Title } from "@mantine/core";
+import {
+ Button,
+ Group,
+ Paper,
+ ScrollArea,
+ Stack,
+ Text,
+ Title,
+} from "@mantine/core";
import { HistoryEntry } from "../HistoryEntry/HistoryEntry";
import { ListToggle } from "../../elements/ListToggle/ListToggle";
import type { HistoryEntryProps } from "../HistoryEntry/HistoryEntry";
@@ -9,8 +17,15 @@ export interface HistoryRequestsPanelProps {
pinnedEntries: HistoryEntryProps[];
searchText: string;
methodFilter?: string;
+ onClearAll: () => void;
+ onExport: () => void;
}
+const ToolbarButton = Button.withProps({
+ variant: "light",
+ size: "sm",
+});
+
const PanelContainer = Paper.withProps({
withBorder: true,
p: "lg",
@@ -56,6 +71,8 @@ export function HistoryListPanel({
pinnedEntries,
searchText,
methodFilter,
+ onClearAll,
+ onExport,
}: HistoryRequestsPanelProps) {
const [compact, setCompact] = useState(false);
@@ -76,12 +93,16 @@ export function HistoryListPanel({
Requests
- {hasResults && (
- setCompact((c) => !c)}
- />
- )}
+
+ Export JSON
+ Clear All
+ {hasResults && (
+ setCompact((c) => !c)}
+ />
+ )}
+
{!hasResults ? (
diff --git a/clients/web/src/components/groups/LogControls/LogControls.tsx b/clients/web/src/components/groups/LogControls/LogControls.tsx
index c5cf88ef..a3655630 100644
--- a/clients/web/src/components/groups/LogControls/LogControls.tsx
+++ b/clients/web/src/components/groups/LogControls/LogControls.tsx
@@ -59,6 +59,12 @@ export function LogControls({
Logging
+ onFilterChange(e.currentTarget.value)}
+ />
+
Active Level
- Search
- onFilterChange(e.currentTarget.value)}
- />
-
Filter by Level
diff --git a/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx b/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
index fa5458af..994eff69 100644
--- a/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
+++ b/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
@@ -6,8 +6,6 @@ const meta: Meta = {
title: "Groups/ResourceControls",
component: ResourceControls,
args: {
- searchText: "",
- onSearchChange: fn(),
onRefreshList: fn(),
onSelectUri: fn(),
onSelectTemplate: fn(),
@@ -59,7 +57,6 @@ export const Default: Story = {
export const WithSearch: Story = {
args: {
...Default.args,
- searchText: "config",
},
};
diff --git a/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx b/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
index 650ae6f2..01053093 100644
--- a/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
+++ b/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
@@ -8,6 +8,7 @@ import {
Title,
} from "@mantine/core";
import { ListChangedIndicator } from "../../elements/ListChangedIndicator/ListChangedIndicator";
+import { ListToggle } from "../../elements/ListToggle/ListToggle";
import { ResourceListItem } from "../ResourceListItem/ResourceListItem";
import { ResourceSubscribedItem } from "../ResourceSubscribedItem/ResourceSubscribedItem";
import type {
@@ -21,8 +22,6 @@ export interface ResourceControlsProps {
templates: TemplateListItem[];
subscriptions: SubscriptionItem[];
listChanged: boolean;
- searchText: string;
- onSearchChange: (text: string) => void;
onRefreshList: () => void;
onSelectUri: (uri: string) => void;
onSelectTemplate: (uriTemplate: string) => void;
@@ -53,24 +52,38 @@ export function ResourceControls({
templates,
subscriptions,
listChanged,
- searchText,
- onSearchChange,
onRefreshList,
onSelectUri,
onSelectTemplate,
onUnsubscribeResource,
}: ResourceControlsProps) {
- const filteredResources = resources.filter((r) =>
- r.name.toLowerCase().includes(searchText.toLowerCase()),
+ const [searchText, setSearchText] = useState("");
+ const query = searchText.toLowerCase();
+ const filteredResources = resources.filter(
+ (r) =>
+ r.name.toLowerCase().includes(query) ||
+ r.uri.toLowerCase().includes(query),
+ );
+ const filteredTemplates = templates.filter(
+ (t) =>
+ templateDisplayName(t).toLowerCase().includes(query) ||
+ t.uriTemplate.toLowerCase().includes(query),
+ );
+ const filteredSubscriptions = subscriptions.filter(
+ (s) =>
+ s.name.toLowerCase().includes(query) ||
+ s.uri.toLowerCase().includes(query),
);
const defaultOpen = [
...(filteredResources.length > 0 ? ["resources"] : []),
- ...(templates.length > 0 ? ["templates"] : []),
- ...(subscriptions.length > 0 ? ["subscriptions"] : []),
+ ...(filteredTemplates.length > 0 ? ["templates"] : []),
+ ...(filteredSubscriptions.length > 0 ? ["subscriptions"] : []),
];
+ const allSections = ["resources", "templates", "subscriptions"];
const [openSections, setOpenSections] = useState(defaultOpen);
+ const allExpanded = openSections.length === allSections.length;
const maxHeight = panelMaxHeight(openSections.length);
return (
@@ -79,11 +92,20 @@ export function ResourceControls({
Resources
- onSearchChange(e.currentTarget.value)}
- />
+
+
+ setOpenSections(allExpanded ? [] : [...allSections])
+ }
+ />
+ setSearchText(e.currentTarget.value)}
+ />
+
@@ -108,13 +130,13 @@ export function ResourceControls({
-
- {formatSectionCount("Templates", templates.length)}
+
+ {formatSectionCount("Templates", filteredTemplates.length)}
- {templates.map((template) => (
+ {filteredTemplates.map((template) => (
-
- {formatSectionCount("Subscriptions", subscriptions.length)}
+
+ {formatSectionCount("Subscriptions", filteredSubscriptions.length)}
- {subscriptions.map((sub) => (
+ {filteredSubscriptions.map((sub) => (
setMethodFilter(value || undefined)
}
- onClearAll={onClearAll}
- onExport={onExport}
/>
@@ -58,6 +56,8 @@ export function HistoryScreen({
pinnedEntries={pinnedEntries}
searchText={searchText}
methodFilter={methodFilter}
+ onClearAll={onClearAll}
+ onExport={onExport}
/>
);
diff --git a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
index c8b2ff7a..dae741af 100644
--- a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
+++ b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
@@ -13,8 +13,6 @@ const meta: Meta = {
component: ResourcesScreen,
parameters: { layout: "fullscreen" },
args: {
- searchText: "",
- onSearchChange: fn(),
onRefreshList: fn(),
onSelectUri: fn(),
onSelectTemplate: fn(),
diff --git a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
index 8f849acd..eab11b1f 100644
--- a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
+++ b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
@@ -47,8 +47,6 @@ export interface ResourcesScreenProps {
selectedResource?: SelectedResource;
selectedTemplate?: SelectedTemplate;
listChanged: boolean;
- searchText: string;
- onSearchChange: (text: string) => void;
onRefreshList: () => void;
onSelectUri: (uri: string) => void;
onSelectTemplate: (uriTemplate: string) => void;
@@ -92,8 +90,6 @@ export function ResourcesScreen({
selectedResource,
selectedTemplate,
listChanged,
- searchText,
- onSearchChange,
onRefreshList,
onSelectUri,
onSelectTemplate,
@@ -110,8 +106,6 @@ export function ResourcesScreen({
templates={templates}
subscriptions={subscriptions}
listChanged={listChanged}
- searchText={searchText}
- onSearchChange={onSearchChange}
onRefreshList={onRefreshList}
onSelectUri={onSelectUri}
onSelectTemplate={onSelectTemplate}
diff --git a/clients/web/src/components/views/ConnectedView/ConnectedView.stories.tsx b/clients/web/src/components/views/ConnectedView/ConnectedView.stories.tsx
index 09802191..e0efa376 100644
--- a/clients/web/src/components/views/ConnectedView/ConnectedView.stories.tsx
+++ b/clients/web/src/components/views/ConnectedView/ConnectedView.stories.tsx
@@ -447,8 +447,6 @@ export const ResourcesActive: Story = {
isSubscribed: false,
}}
listChanged={true}
- searchText=""
- onSearchChange={fn()}
onRefreshList={fn()}
onSelectUri={fn()}
onSelectTemplate={fn()}