Left Sidebar: - Create /api/tools endpoint to fetch tools from registry - Update ToolsSidebar to fetch and display tools dynamically - Add filter input for searching tools by name/description/category - Fix interface to use packageName/exportName from search registry Right Sidebar: - Create SettingsSidebar with environment variable management - Add localStorage persistence for env vars - Implement password masking for values - Export useEnvVars() hook for accessing env vars Environment Variable Forwarding: - Update useChat hook to read and forward env vars to API - Update chat route to extract env vars from request body - Update dynamic-tool-loader to accept and forward env vars - Update Railway executor to inject env vars into Deno environment - Complete chain: localStorage → client → chat → Railway → Deno.env Bug Fixes: - Fix undefined property errors in tool detail page - Add optional chaining for npmDownloadsLastMonth and qualityScore 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
24 lines
728 B
TypeScript
24 lines
728 B
TypeScript
'use client';
|
|
|
|
import { ChatHeader } from '~/components/chat/ChatHeader';
|
|
import { ChatInterface } from '~/components/chat/ChatInterface';
|
|
import { SettingsSidebar } from '~/components/sidebar/SettingsSidebar';
|
|
import { ToolsSidebar } from '~/components/sidebar/ToolsSidebar';
|
|
|
|
export default function PlaygroundPage(): React.ReactElement {
|
|
const handleClearChat = () => {
|
|
// Refresh the page to clear chat
|
|
window.location.reload();
|
|
};
|
|
|
|
return (
|
|
<div className="flex h-screen flex-col bg-background">
|
|
<ChatHeader onClear={handleClearChat} />
|
|
<div className="flex flex-1 overflow-hidden">
|
|
<ToolsSidebar />
|
|
<ChatInterface />
|
|
<SettingsSidebar />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|