From fddde02ae7aec49228d6327c1a293059ccf91cb5 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Tue, 23 Jun 2026 15:24:29 +0000
Subject: [PATCH] Remap Caps Lock to Escape when keymap is enabled

This change fixes the Caps Lock remapping functionality by using the
consistent `keymapEnabled` state instead of the unused `isKeymapActive`.
Redundant state is removed and a new test is added to verify the behavior.

Co-authored-by: coderFeedForwardAlg <76785692+coderFeedForwardAlg@users.noreply.github.com>
---
 frontend/src/App.js           |  5 ++-
 frontend/src/CapsLock.test.js | 61 +++++++++++++++++++++++++++++++++++
 2 files changed, 63 insertions(+), 3 deletions(-)
 create mode 100644 frontend/src/CapsLock.test.js

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 018b2fe..f7b5ee3 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -67,7 +67,6 @@ function App() {
   const [isVrActive, setIsVrActive] = useState(false);
   const [screenPosition, setScreenPosition] = useState({ x: 0, y: 5, z: -5.5 });
   const [commandBuffer, setCommandBuffer] = useState('');
-  const [isKeymapActive, setIsKeymapActive] = useState(false);
   const commandBufferRef = useRef('');
   const [keymapEnabled, setKeymapEnabled] = useState(false);
   const pressedHomeRowKeysRef = useRef(new Map());
@@ -132,7 +131,7 @@ function App() {
   }, [SPECIAL_COMMANDS]);
 
   const handleTerminalKeyDown = useCallback((event) => {
-    if (isKeymapActive && event.code === 'CapsLock') {
+    if (keymapEnabled && event.code === 'CapsLock') {
       event.preventDefault();
       event.stopPropagation();
       emitTerminalInput('\x1b');
@@ -212,7 +211,7 @@ function App() {
     emitTerminalInput(encoded);
 
     return true;
-  }, [emitTerminalInput, SPECIAL_COMMANDS, isPrefixOfCommand, isKeymapActive]);
+  }, [emitTerminalInput, SPECIAL_COMMANDS, isPrefixOfCommand, keymapEnabled]);
 
   const displaySnapshot = useMemo(() => {
     if (!terminalSnapshot) {
diff --git a/frontend/src/CapsLock.test.js b/frontend/src/CapsLock.test.js
new file mode 100644
index 0000000..a657e12
--- /dev/null
+++ b/frontend/src/CapsLock.test.js
@@ -0,0 +1,61 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+import App from './App';
+
+describe('CapsLock remapping', () => {
+  let socket;
+  let socketHandlers = {};
+
+  beforeEach(() => {
+    socketHandlers = {};
+    socket = {
+      on: jest.fn((eventName, handler) => {
+        socketHandlers[eventName] = handler;
+      }),
+      emit: jest.fn(),
+      close: jest.fn(),
+      connected: true,
+    };
+    window.io = jest.fn(() => socket);
+    jest.spyOn(HTMLCanvasElement.prototype, 'getContext').mockReturnValue({
+      setTransform: jest.fn(),
+      clearRect: jest.fn(),
+      fillRect: jest.fn(),
+      fillText: jest.fn(),
+      strokeRect: jest.fn(),
+      beginPath: jest.fn(),
+      rect: jest.fn(),
+      clip: jest.fn(),
+      save: jest.fn(),
+      restore: jest.fn(),
+      moveTo: jest.fn(),
+      lineTo: jest.fn(),
+      stroke: jest.fn(),
+    });
+  });
+
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  const activateKeymap = () => {
+    fireEvent.keyDown(document, { key: '/' });
+    fireEvent.keyDown(document, { key: 'k' });
+    fireEvent.keyDown(document, { key: 'e' });
+    fireEvent.keyDown(document, { key: 'y' });
+    fireEvent.keyDown(document, { key: 'm' });
+    fireEvent.keyDown(document, { key: 'a' });
+    fireEvent.keyDown(document, { key: 'p' });
+    fireEvent.keyDown(document, { key: 'Enter' });
+  };
+
+  test('CapsLock sends Escape when keymap is enabled', () => {
+    render(<App />);
+    const shell = screen.getByTestId('vr-shell');
+    fireEvent.focus(shell);
+    activateKeymap();
+    socket.emit.mockClear();
+
+    fireEvent.keyDown(document, { code: 'CapsLock' });
+    expect(socket.emit).toHaveBeenCalledWith('terminal-input', '\x1b');
+  });
+});