feat(#42): Implement persistent Jarvis chat overlay
Add a persistent chat overlay accessible from any authenticated view. The overlay wraps the existing Chat component and adds state management, keyboard shortcuts, and responsive design. Features: - Three states: Closed (floating button), Open (full panel), Minimized (header) - Keyboard shortcuts: - Cmd/Ctrl + K: Open chat (when closed) - Escape: Minimize chat (when open) - Cmd/Ctrl + Shift + J: Toggle chat panel - State persistence via localStorage - Responsive design (full-width mobile, sidebar desktop) - PDA-friendly design with calm colors - 32 comprehensive tests (14 hook tests + 18 component tests) Files added: - apps/web/src/hooks/useChatOverlay.ts - apps/web/src/hooks/useChatOverlay.test.ts - apps/web/src/components/chat/ChatOverlay.tsx - apps/web/src/components/chat/ChatOverlay.test.tsx Files modified: - apps/web/src/components/chat/index.ts (added export) - apps/web/src/app/(authenticated)/layout.tsx (integrated overlay) All tests passing (490 tests, 50 test files) All lint checks passing Build succeeds Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,6 +4,7 @@ import { useEffect } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useAuth } from "@/lib/auth/auth-context";
|
||||
import { Navigation } from "@/components/layout/Navigation";
|
||||
import { ChatOverlay } from "@/components/chat";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export default function AuthenticatedLayout({
|
||||
@@ -36,6 +37,7 @@ export default function AuthenticatedLayout({
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<Navigation />
|
||||
<div className="pt-16">{children}</div>
|
||||
<ChatOverlay />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user