Filter and show triggers-only toolkits in composio:

This commit is contained in:
akhisud3195 2025-08-15 12:22:54 +08:00
parent d0cd917d06
commit 8f3f264493
3 changed files with 31 additions and 9 deletions

View file

@ -22,13 +22,15 @@ interface SelectComposioToolkitProps {
tools: z.infer<typeof Workflow.shape.tools>;
onSelectToolkit: (toolkit: ToolkitType) => void;
initialToolkitSlug?: string | null;
filterByTriggers?: boolean; // New prop to filter toolkits that have triggers
}
export function SelectComposioToolkit({
projectId,
tools,
onSelectToolkit,
initialToolkitSlug
initialToolkitSlug,
filterByTriggers = false
}: SelectComposioToolkitProps) {
const [toolkits, setToolkits] = useState<ToolkitType[]>([]);
const [projectConfig, setProjectConfig] = useState<ProjectType | null>(null);
@ -69,7 +71,13 @@ export function SelectComposioToolkit({
// return noAuth || hasOAuth2;
// });
setToolkits(allToolkits);
// Filter toolkits that have triggers if filterByTriggers is true
let finalToolkits = allToolkits;
if (filterByTriggers) {
finalToolkits = allToolkits.filter(toolkit => toolkit.meta.triggers_count > 0);
}
setToolkits(finalToolkits);
setError(null);
} catch (err: any) {
setError('Unable to load all Composio toolkits. Please check your connection and try again.');
@ -78,7 +86,7 @@ export function SelectComposioToolkit({
} finally {
setLoading(false);
}
}, [projectId]);
}, [projectId, filterByTriggers]);
const handleSelectToolkit = useCallback((toolkit: ToolkitType) => {
onSelectToolkit(toolkit);
@ -125,7 +133,9 @@ export function SelectComposioToolkit({
return (
<div className="text-center py-8">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-800 dark:border-gray-200 mx-auto"></div>
<p className="mt-4 text-sm text-gray-600 dark:text-gray-400">Loading Composio toolkits...</p>
<p className="mt-4 text-sm text-gray-600 dark:text-gray-400">
{filterByTriggers ? 'Loading Composio toolkits with triggers...' : 'Loading Composio toolkits...'}
</p>
</div>
);
}
@ -161,7 +171,7 @@ export function SelectComposioToolkit({
</div>
<input
type="text"
placeholder="Search toolkits..."
placeholder={filterByTriggers ? "Search toolkits with triggers..." : "Search toolkits..."}
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
className="w-full pl-8 pr-4 py-2 text-sm border border-gray-200 dark:border-gray-700 rounded-md
@ -173,6 +183,7 @@ export function SelectComposioToolkit({
</div>
<div className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{filteredToolkits.length} {filteredToolkits.length === 1 ? 'toolkit' : 'toolkits'}
{filterByTriggers && ' with triggers'}
</div>
<div className="h-4 w-px bg-gray-200 dark:bg-gray-700" />
</div>
@ -204,6 +215,7 @@ export function SelectComposioToolkit({
isConnected={isConnected}
workflowTools={tools}
onSelectToolkit={() => handleSelectToolkit(toolkit)}
showTriggerCounts={filterByTriggers}
/>
);
})}
@ -212,7 +224,12 @@ export function SelectComposioToolkit({
{filteredToolkits.length === 0 && !loading && (
<div className="text-center py-12">
<p className="text-gray-500 dark:text-gray-400">
{searchQuery ? 'No toolkits found matching your search.' : 'No toolkits available.'}
{searchQuery
? 'No toolkits found matching your search.'
: filterByTriggers
? 'No toolkits with triggers available.'
: 'No toolkits available.'
}
</p>
</div>
)}

View file

@ -30,6 +30,7 @@ interface ToolkitCardProps {
isConnected: boolean;
onSelectToolkit: () => void;
workflowTools: z.infer<typeof Workflow.shape.tools>;
showTriggerCounts?: boolean; // New prop to show trigger counts instead of tool counts
}
export function ToolkitCard({
@ -37,6 +38,7 @@ export function ToolkitCard({
isConnected,
onSelectToolkit,
workflowTools,
showTriggerCounts = false,
}: ToolkitCardProps) {
const handleCardClick = useCallback(() => {
onSelectToolkit();
@ -69,7 +71,9 @@ export function ToolkitCard({
variant="faded"
size="sm"
>
{selectedToolsCount > 0
{showTriggerCounts
? `${toolkit.meta.triggers_count} triggers`
: selectedToolsCount > 0
? `${toolkit.meta.tools_count} tools, ${selectedToolsCount} selected`
: `${toolkit.meta.tools_count} tools`
}

View file

@ -299,6 +299,7 @@ export function TriggersModal({
tools={[]} // Empty array since we're not using this for tools
onSelectToolkit={handleSelectToolkit}
initialToolkitSlug={null}
filterByTriggers={true}
/>
</div>
);