chore: Convert camelCase file names to kebab-case (#5209)

Makefile

@@ -184,6 +184,10 @@ test:
 	@$(MAKE) -s test-frontend
 
 build-frontend:
+	@echo "$(YELLOW)Cleaning TypeScript build cache...$(RESET)"
+	@cd frontend && npx tsc --build --clean
+	@echo "$(YELLOW)Cleaning Git cache for casing issues...$(RESET)"
+	@cd frontend && git rm -r --cached . && git add . && git commit -m "Fix Git cache" || echo "No changes to commit"
 	@echo "$(YELLOW)Building frontend...$(RESET)"
 	@cd frontend && npm run build
 

frontend/__tests__/components/Browser.test.tsx → frontend/__tests__/components/browser.test.tsx

@@ -1,7 +1,7 @@
 import { screen } from "@testing-library/react";
 import { describe, it, expect } from "vitest";
 import { renderWithProviders } from "../../test-utils";
-import BrowserPanel from "#/components/Browser";
+import BrowserPanel from "#/components/browser";
 
 describe("Browser", () => {
   it("renders a message if no screenshotSrc is provided", () => {

frontend/__tests__/components/chat/chat-input.test.tsx

@@ -171,9 +171,9 @@ describe("ChatInput", () => {
     // Fire paste event with text data
     fireEvent.paste(input!, {
       clipboardData: {
-        getData: (type: string) => type === 'text/plain' ? 'test paste' : '',
-        files: []
-      }
+        getData: (type: string) => (type === "text/plain" ? "test paste" : ""),
+        files: [],
+      },
     });
   });
 
@@ -187,14 +187,16 @@ describe("ChatInput", () => {
     expect(input).toBeTruthy();
 
     // Create a paste event with an image file
-    const file = new File(["dummy content"], "image.png", { type: "image/png" });
+    const file = new File(["dummy content"], "image.png", {
+      type: "image/png",
+    });
 
     // Fire paste event with image data
     fireEvent.paste(input!, {
       clipboardData: {
-        getData: () => '',
-        files: [file]
-      }
+        getData: () => "",
+        files: [file],
+      },
     });
 
     // Verify image paste was handled

frontend/__tests__/components/chat/chat-interface.test.tsx

@@ -3,9 +3,9 @@ import { act, screen, waitFor, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { renderWithProviders } from "test-utils";
 import { ChatInterface } from "#/components/chat-interface";
-import { addUserMessage } from "#/state/chatSlice";
+import { addUserMessage } from "#/state/chat-slice";
 import { SUGGESTIONS } from "#/utils/suggestions";
-import * as ChatSlice from "#/state/chatSlice";
+import * as ChatSlice from "#/state/chat-slice";
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const renderChatInterface = (messages: (Message | ErrorMessage)[]) =>

frontend/__tests__/components/file-explorer/ExplorerTree.test.tsx → frontend/__tests__/components/file-explorer/explorer-tree.test.tsx

@@ -1,7 +1,7 @@
 import { screen } from "@testing-library/react";
 import { renderWithProviders } from "test-utils";
 import { describe, afterEach, vi, it, expect } from "vitest";
-import ExplorerTree from "#/components/file-explorer/ExplorerTree";
+import ExplorerTree from "#/components/file-explorer/explorer-tree";
 
 const FILES = ["file-1-1.ts", "folder-1-2"];
 

frontend/__tests__/components/file-explorer/FileExplorer.test.tsx → frontend/__tests__/components/file-explorer/file-explorer.test.tsx

@@ -3,8 +3,8 @@ import userEvent from "@testing-library/user-event";
 import { renderWithProviders } from "test-utils";
 import { describe, it, expect, vi, Mock, afterEach } from "vitest";
 import toast from "#/utils/toast";
-import AgentState from "#/types/AgentState";
-import FileExplorer from "#/components/file-explorer/FileExplorer";
+import AgentState from "#/types/agent-state";
+import FileExplorer from "#/components/file-explorer/file-explorer";
 import OpenHands from "#/api/open-hands";
 
 const toastSpy = vi.spyOn(toast, "error");

frontend/__tests__/components/file-explorer/TreeNode.test.tsx → frontend/__tests__/components/file-explorer/tree-node.test.tsx

@@ -2,7 +2,7 @@ import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { renderWithProviders } from "test-utils";
 import { vi, describe, afterEach, it, expect } from "vitest";
-import TreeNode from "#/components/file-explorer/TreeNode";
+import TreeNode from "#/components/file-explorer/tree-node";
 import OpenHands from "#/api/open-hands";
 
 const getFileSpy = vi.spyOn(OpenHands, "getFile");

frontend/__tests__/components/modals/base-modal/BaseModal.test.tsx → frontend/__tests__/components/modals/base-modal/base-modal.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen, act } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, it, vi, expect } from "vitest";
-import BaseModal from "#/components/modals/base-modal/BaseModal";
+import BaseModal from "#/components/modals/base-modal/base-modal";
 
 describe("BaseModal", () => {
   it("should render if the modal is open", () => {

frontend/__tests__/components/modals/settings/ModelSelector.test.tsx → frontend/__tests__/components/modals/settings/model-selector.test.tsx

@@ -1,7 +1,7 @@
 import { describe, it, expect } from "vitest";
 import { render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { ModelSelector } from "#/components/modals/settings/ModelSelector";
+import { ModelSelector } from "#/components/modals/settings/model-selector";
 
 describe("ModelSelector", () => {
   const models = {

frontend/__tests__/components/terminal/Terminal.test.tsx → frontend/__tests__/components/terminal/terminal.test.tsx

@@ -1,8 +1,8 @@
 import { act, screen } from "@testing-library/react";
 import { renderWithProviders } from "test-utils";
 import { vi, describe, afterEach, it, expect } from "vitest";
-import { Command, appendInput, appendOutput } from "#/state/commandSlice";
-import Terminal from "#/components/terminal/Terminal";
+import { Command, appendInput, appendOutput } from "#/state/command-slice";
+import Terminal from "#/components/terminal/terminal";
 
 global.ResizeObserver = vi.fn().mockImplementation(() => ({
   observe: vi.fn(),

frontend/__tests__/hooks/use-click-outside-element.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { expect, test, vi } from "vitest";
-import { useClickOutsideElement } from "#/hooks/useClickOutsideElement";
+import { useClickOutsideElement } from "#/hooks/use-click-outside-element";
 
 interface ClickOutsideTestComponentProps {
   callback: () => void;

frontend/__tests__/hooks/use-rate.test.ts

@@ -55,8 +55,8 @@ describe("useRate", () => {
     expect(result.current.isUnderThreshold).toBe(true);
 
     act(() => {
-       // not sure if fake timers is buggy with intervals,
-       // but I need to call it twice to register
+      // not sure if fake timers is buggy with intervals,
+      // but I need to call it twice to register
       vi.advanceTimersToNextTimer();
       vi.advanceTimersToNextTimer();
     });

frontend/__tests__/hooks/use-terminal.test.tsx

@@ -1,10 +1,10 @@
 import { beforeAll, describe, expect, it, vi } from "vitest";
 import { render } from "@testing-library/react";
 import { afterEach } from "node:test";
-import { useTerminal } from "#/hooks/useTerminal";
-import { Command } from "#/state/commandSlice";
-import { WsClientProvider } from "#/context/ws-client-provider";
 import { ReactNode } from "react";
+import { useTerminal } from "#/hooks/use-terminal";
+import { Command } from "#/state/command-slice";
+import { WsClientProvider } from "#/context/ws-client-provider";
 
 interface TestTerminalComponentProps {
   commands: Command[];
@@ -23,11 +23,17 @@ interface WrapperProps {
   children: ReactNode;
 }
 
-
-function Wrapper({children}: WrapperProps) {
+function Wrapper({ children }: WrapperProps) {
   return (
-    <WsClientProvider enabled={true} token="NO_JWT" ghToken="NO_GITHUB" settings={null}>{children}</WsClientProvider>
-  )
+    <WsClientProvider
+      enabled
+      token="NO_JWT"
+      ghToken="NO_GITHUB"
+      settings={null}
+    >
+      {children}
+    </WsClientProvider>
+  );
 }
 
 describe("useTerminal", () => {

frontend/__tests__/initial-query.test.tsx

@@ -1,6 +1,9 @@
 import { describe, it, expect } from "vitest";
 import store from "../src/store";
-import { setInitialQuery, clearInitialQuery } from "../src/state/initial-query-slice";
+import {
+  setInitialQuery,
+  clearInitialQuery,
+} from "../src/state/initial-query-slice";
 
 describe("Initial Query Behavior", () => {
   it("should clear initial query when clearInitialQuery is dispatched", () => {

frontend/__tests__/utils/extractModelAndProvider.test.ts → frontend/__tests__/utils/extract-model-and-provider.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from "vitest";
-import { extractModelAndProvider } from "../../src/utils/extractModelAndProvider";
+import { extractModelAndProvider } from "../../src/utils/extract-model-and-provider";
 
 describe("extractModelAndProvider", () => {
   it("should work", () => {

frontend/__tests__/utils/formatMs.test.ts → frontend/__tests__/utils/format-ms.test.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "vitest";
-import { formatMs } from "../../src/utils/formatMs";
+import { formatMs } from "../../src/utils/format-ms";
 
 test("formatMs", () => {
   expect(formatMs(1000)).toBe("00:01");

frontend/__tests__/utils/isNumber.test.ts → frontend/__tests__/utils/is-number.test.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "vitest";
-import { isNumber } from "../../src/utils/isNumber";
+import { isNumber } from "../../src/utils/is-number";
 
 test("isNumber", () => {
   expect(isNumber(1)).toBe(true);

frontend/__tests__/utils/mapProvider.test.ts → frontend/__tests__/utils/map-provider.test.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "vitest";
-import { mapProvider } from "../../src/utils/mapProvider";
+import { mapProvider } from "../../src/utils/map-provider";
 
 test("mapProvider", () => {
   expect(mapProvider("azure")).toBe("Azure");

frontend/__tests__/utils/organizeModelsAndProviders.test.ts → frontend/__tests__/utils/organize-models-and-providers.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from "vitest";
-import { organizeModelsAndProviders } from "../../src/utils/organizeModelsAndProviders";
+import { organizeModelsAndProviders } from "../../src/utils/organize-models-and-providers";
 
 test("organizeModelsAndProviders", () => {
   const models = [

frontend/__tests__/utils/parseGithubUrl.test.ts → frontend/__tests__/utils/parse-github-url.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from "vitest";
-import { parseGithubUrl } from "../../src/utils/parseGithubUrl";
+import { parseGithubUrl } from "../../src/utils/parse-github-url";
 
 test("parseGithubUrl", () => {
   expect(

frontend/__tests__/utils/parseTerminalOutput.test.ts → frontend/__tests__/utils/parse-terminal-output.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from "vitest";
-import { parseTerminalOutput } from "../../src/utils/parseTerminalOutput";
+import { parseTerminalOutput } from "../../src/utils/parse-terminal-output";
 
 describe("parseTerminalOutput", () => {
   it("should parse the command, env, and symbol", () => {