From 246464a3255da586a2ced6709cf3e18ea0668a64 Mon Sep 17 00:00:00 2001 From: Bohdan Triapitsyn Date: Fri, 3 Apr 2026 16:44:31 +0300 Subject: [PATCH] perf: remove animated logo from idle and loading surfaces --- packages/desktop/noop-dist/index.html | 15 +-------- .../src/components/auth/SessionAuthGate.tsx | 2 +- .../ui/src/components/chat/ChatEmptyState.tsx | 33 ++----------------- .../src/components/ui/ConfigUpdateOverlay.tsx | 2 +- .../ui/src/components/ui/OpenChamberLogo.tsx | 20 +---------- packages/vscode/src/webviewHtml.ts | 10 +----- packages/web/index.html | 9 +---- 7 files changed, 8 insertions(+), 83 deletions(-) diff --git a/packages/desktop/noop-dist/index.html b/packages/desktop/noop-dist/index.html index b5972346..9d4b4ba6 100644 --- a/packages/desktop/noop-dist/index.html +++ b/packages/desktop/noop-dist/index.html @@ -61,19 +61,6 @@ font-family: system-ui, -apple-system, sans-serif; } - @keyframes logo-pulse { - 0%, - 100% { - opacity: 1; - } - 50% { - opacity: 0.4; - } - } - - .logo-pulse { - animation: logo-pulse 3s ease-in-out infinite; - } @@ -114,7 +101,7 @@ - + diff --git a/packages/ui/src/components/auth/SessionAuthGate.tsx b/packages/ui/src/components/auth/SessionAuthGate.tsx index 4fcbcadd..ef30e5ac 100644 --- a/packages/ui/src/components/auth/SessionAuthGate.tsx +++ b/packages/ui/src/components/auth/SessionAuthGate.tsx @@ -64,7 +64,7 @@ const AuthShell: React.FC<{ children: React.ReactNode }> = ({ children }) => ( const LoadingScreen: React.FC = () => (
- +
); diff --git a/packages/ui/src/components/chat/ChatEmptyState.tsx b/packages/ui/src/components/chat/ChatEmptyState.tsx index 00c30eef..a76f10cd 100644 --- a/packages/ui/src/components/chat/ChatEmptyState.tsx +++ b/packages/ui/src/components/chat/ChatEmptyState.tsx @@ -1,45 +1,16 @@ import React from 'react'; import { OpenChamberLogo } from '@/components/ui/OpenChamberLogo'; -import { TextLoop } from '@/components/ui/TextLoop'; import { useThemeSystem } from '@/contexts/useThemeSystem'; -const phrases = [ - "Fix the failing tests", - "Refactor this to be more readable", - "Add form validation", - "Optimize this function", - "Write tests for this", - "Explain how this works", - "Add a new feature", - "Help me debug this", - "Review my code", - "Simplify this logic", - "Add error handling", - "Create a new component", - "Update the documentation", - "Find the bug here", - "Improve performance", - "Add type definitions", -]; - const ChatEmptyState: React.FC = () => { const { currentTheme } = useThemeSystem(); - // Use theme's muted foreground for secondary text const textColor = currentTheme?.colors?.surface?.mutedForeground || 'var(--muted-foreground)'; return (
- - - {phrases.map((phrase) => ( - "{phrase}…" - ))} - + + Start a new chat
); }; diff --git a/packages/ui/src/components/ui/ConfigUpdateOverlay.tsx b/packages/ui/src/components/ui/ConfigUpdateOverlay.tsx index 07b4ee29..4647824c 100644 --- a/packages/ui/src/components/ui/ConfigUpdateOverlay.tsx +++ b/packages/ui/src/components/ui/ConfigUpdateOverlay.tsx @@ -18,7 +18,7 @@ export const ConfigUpdateOverlay: React.FC = () => { return (
- +

{message}

diff --git a/packages/ui/src/components/ui/OpenChamberLogo.tsx b/packages/ui/src/components/ui/OpenChamberLogo.tsx index 5c8d3063..53c1b99d 100644 --- a/packages/ui/src/components/ui/OpenChamberLogo.tsx +++ b/packages/ui/src/components/ui/OpenChamberLogo.tsx @@ -81,7 +81,6 @@ export const OpenChamberLogo: React.FC = ({ className = '', width = 70, height = 70, - isAnimated = false, }) => { const themeContext = useOptionalThemeSystem(); @@ -192,23 +191,6 @@ export const OpenChamberLogo: React.FC = ({ role="img" aria-label="OpenChamber logo" > - - {/* Left face - base fill */} = ({ /> {/* OpenCode logo on top face */} - + {/* Isometric transform for top face: OpenCode logo (32x40 viewBox) centered and projected to isometric plane diff --git a/packages/vscode/src/webviewHtml.ts b/packages/vscode/src/webviewHtml.ts index 1eb175b8..8fb61899 100644 --- a/packages/vscode/src/webviewHtml.ts +++ b/packages/vscode/src/webviewHtml.ts @@ -119,10 +119,6 @@ export function getWebviewHtml(options: WebviewHtmlOptions): string { fill: var(--vscode-foreground); opacity: 0.4; } - /* Animation on inner logo only, like OpenChamberLogo.tsx */ - #initial-loading .logo-inner { - animation: logoPulse 3s ease-in-out infinite; - } #initial-loading .status-text { font-size: 13px; color: var(--vscode-descriptionForeground, var(--vscode-foreground)); @@ -134,10 +130,6 @@ export function getWebviewHtml(options: WebviewHtmlOptions): string { text-align: center; max-width: 280px; } - @keyframes logoPulse { - 0%, 100% { opacity: 0.4; } - 50% { opacity: 1; } - } OpenChamber @@ -152,7 +144,7 @@ export function getWebviewHtml(options: WebviewHtmlOptions): string { - + diff --git a/packages/web/index.html b/packages/web/index.html index 20ef4d63..e0b7f4ea 100644 --- a/packages/web/index.html +++ b/packages/web/index.html @@ -417,13 +417,6 @@ --splash-cell-fill: color-mix(in srgb, var(--splash-stroke) 35%, transparent); } } - @keyframes logo-pulse { - 0%, 100% { opacity: 1; } - 50% { opacity: 0.4; } - } - .logo-pulse { - animation: logo-pulse 3s ease-in-out infinite; - } #initial-loading { background-color: var(--splash-background); color: var(--splash-foreground); @@ -498,7 +491,7 @@ - +