38648ae5f4
- Add SessionManager class to handle PTY sessions with WebSocket connections. - Implement methods for creating, retrieving, and destroying sessions. - Handle PTY output and WebSocket messages for terminal interaction. - Ensure graceful session destruction and cleanup. feat: initialize web application with Next.js and Tailwind CSS - Create initial Next.js application structure with TypeScript support. - Set up Tailwind CSS for styling with custom theme configurations. - Add ESLint configuration for code quality and consistency. feat: implement chat API and UI components - Create chat API route to handle chat requests and responses. - Develop chat layout with sidebar, header, chat window, and input components. - Integrate Zustand for state management of conversations and messages. - Add utility functions for formatting dates and managing class names. chore: add environment variables and configuration files - Create .env.example for environment variable setup. - Add configuration files for PostCSS, Tailwind CSS, and TypeScript. - Set up package.json with necessary dependencies and scripts for development.
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import { useChatStore } from "@/lib/store";
|
|
import { Sidebar } from "@/components/layout/Sidebar";
|
|
import { Header } from "@/components/layout/Header";
|
|
import { ChatWindow } from "./ChatWindow";
|
|
import { ChatInput } from "./ChatInput";
|
|
|
|
export function ChatLayout() {
|
|
const { conversations, createConversation, activeConversationId } = useChatStore();
|
|
|
|
useEffect(() => {
|
|
if (conversations.length === 0) {
|
|
createConversation();
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<div className="flex h-screen bg-surface-950 text-surface-100">
|
|
<Sidebar />
|
|
<div className="flex flex-col flex-1 min-w-0">
|
|
<Header />
|
|
<main className="flex flex-col flex-1 min-h-0">
|
|
{activeConversationId ? (
|
|
<>
|
|
<ChatWindow conversationId={activeConversationId} />
|
|
<ChatInput conversationId={activeConversationId} />
|
|
</>
|
|
) : (
|
|
<div className="flex-1 flex items-center justify-center text-surface-500">
|
|
Select or create a conversation
|
|
</div>
|
|
)}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|