From d6db80117b3ce9fb328419df17f8a686cd196a3e Mon Sep 17 00:00:00 2001 From: Matt Rubens Date: Thu, 29 May 2025 10:34:08 -0400 Subject: [PATCH 1/4] Add missing telemetry types --- packages/types/src/telemetry.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/types/src/telemetry.ts b/packages/types/src/telemetry.ts index 967101f85d..546282e658 100644 --- a/packages/types/src/telemetry.ts +++ b/packages/types/src/telemetry.ts @@ -109,6 +109,8 @@ export const rooCodeTelemetryEventSchema = z.discriminatedUnion("type", [ TelemetryEventName.DIFF_APPLICATION_ERROR, TelemetryEventName.SHELL_INTEGRATION_ERROR, TelemetryEventName.CONSECUTIVE_MISTAKE_ERROR, + TelemetryEventName.CONTEXT_CONDENSED, + TelemetryEventName.SLIDING_WINDOW_TRUNCATION, ]), properties: telemetryPropertiesSchema, }), From 09a4f49709141f2cfab82106b0cf17245a4ff2fd Mon Sep 17 00:00:00 2001 From: Matt Rubens Date: Thu, 29 May 2025 10:34:33 -0400 Subject: [PATCH 2/4] Give IconButton the pointer cursor when enabled --- webview-ui/src/components/chat/IconButton.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/webview-ui/src/components/chat/IconButton.tsx b/webview-ui/src/components/chat/IconButton.tsx index 80f59ee74b..208b836158 100644 --- a/webview-ui/src/components/chat/IconButton.tsx +++ b/webview-ui/src/components/chat/IconButton.tsx @@ -27,6 +27,7 @@ export const IconButton: React.FC = ({ "hover:opacity-100 hover:bg-[rgba(255,255,255,0.03)] hover:border-[rgba(255,255,255,0.15)]", "focus:outline-none focus-visible:ring-1 focus-visible:ring-vscode-focusBorder", "active:bg-[rgba(255,255,255,0.1)]", + !disabled && "cursor-pointer", disabled && "opacity-40 cursor-not-allowed grayscale-[30%] hover:bg-transparent hover:border-[rgba(255,255,255,0.08)] active:bg-transparent", className, From f41c7db4cccfea5802efadc079a6a0fb0e13b512 Mon Sep 17 00:00:00 2001 From: Matt Rubens Date: Thu, 29 May 2025 10:36:09 -0400 Subject: [PATCH 3/4] Change context condensing to use a Lucide icon --- webview-ui/src/components/chat/TaskHeader.tsx | 11 +++++------ .../components/settings/ContextManagementSettings.tsx | 4 ++-- 2 files changed, 7 insertions(+), 8 deletions(-) diff --git a/webview-ui/src/components/chat/TaskHeader.tsx b/webview-ui/src/components/chat/TaskHeader.tsx index 7bad41316e..abfc6fd41e 100644 --- a/webview-ui/src/components/chat/TaskHeader.tsx +++ b/webview-ui/src/components/chat/TaskHeader.tsx @@ -2,7 +2,7 @@ import { memo, useRef, useState } from "react" import { useWindowSize } from "react-use" import { useTranslation } from "react-i18next" import { VSCodeBadge } from "@vscode/webview-ui-toolkit/react" -import { CloudUpload, CloudDownload } from "lucide-react" +import { CloudUpload, CloudDownload, FoldVertical } from "lucide-react" import type { ClineMessage } from "@roo-code/types" @@ -19,7 +19,6 @@ import Thumbnails from "../common/Thumbnails" import { TaskActions } from "./TaskActions" import { ContextWindowProgress } from "./ContextWindowProgress" import { Mention } from "./Mention" -import { IconButton } from "./IconButton" export interface TaskHeaderProps { task: ClineMessage @@ -108,13 +107,13 @@ const TaskHeader = ({ : undefined } /> - currentTaskItem && handleCondenseContext(currentTaskItem.id)} - className="shrink-0 min-h-[20px] min-w-[20px] p-[2px]" - /> + className="shrink-0 min-h-[20px] min-w-[20px] p-[2px] cursor-pointer disabled:cursor-not-allowed opacity-85 hover:opacity-100 bg-transparent border-none rounded-md"> + + {!!totalCost && ${totalCost.toFixed(2)}} )} diff --git a/webview-ui/src/components/settings/ContextManagementSettings.tsx b/webview-ui/src/components/settings/ContextManagementSettings.tsx index b4920ceb21..6b558bdfbd 100644 --- a/webview-ui/src/components/settings/ContextManagementSettings.tsx +++ b/webview-ui/src/components/settings/ContextManagementSettings.tsx @@ -1,7 +1,7 @@ import { HTMLAttributes } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" import { VSCodeCheckbox, VSCodeTextArea } from "@vscode/webview-ui-toolkit/react" -import { Database } from "lucide-react" +import { Database, FoldVertical } from "lucide-react" import { cn } from "@/lib/utils" import { Button, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Slider } from "@/components/ui" @@ -197,7 +197,7 @@ export const ContextManagementSettings = ({ {autoCondenseContext && (
- +
{t("settings:contextManagement.autoCondenseContextPercent.label")}
From a4a0bfecf77034de2cca2d7a423c18f2d7b31f10 Mon Sep 17 00:00:00 2001 From: Matt Rubens Date: Thu, 29 May 2025 10:36:41 -0400 Subject: [PATCH 4/4] Mock Lucide icons globally --- webview-ui/jest.config.cjs | 2 +- .../common/__tests__/CodeBlock.test.tsx | 16 --------------- .../modes/__tests__/ModesView.test.tsx | 16 --------------- .../ContextManagementSettings.test.tsx | 14 ------------- .../settings/__tests__/SettingsView.test.tsx | 16 --------------- .../src/{setupTests.ts => setupTests.tsx} | 20 +++++++++++++++++++ 6 files changed, 21 insertions(+), 63 deletions(-) rename webview-ui/src/{setupTests.ts => setupTests.tsx} (64%) diff --git a/webview-ui/jest.config.cjs b/webview-ui/jest.config.cjs index 4a897ef00c..0bdcf6d802 100644 --- a/webview-ui/jest.config.cjs +++ b/webview-ui/jest.config.cjs @@ -6,7 +6,7 @@ module.exports = { moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"], transform: { "^.+\\.(ts|tsx)$": ["ts-jest", { tsconfig: { jsx: "react-jsx", module: "ESNext" } }] }, testMatch: ["/src/**/__tests__/**/*.{js,jsx,ts,tsx}", "/src/**/*.{spec,test}.{js,jsx,ts,tsx}"], - setupFilesAfterEnv: ["/src/setupTests.ts"], + setupFilesAfterEnv: ["/src/setupTests.tsx"], moduleNameMapper: { "\\.(css|less|scss|sass)$": "identity-obj-proxy", "^vscrui$": "/src/__mocks__/vscrui.ts", diff --git a/webview-ui/src/components/common/__tests__/CodeBlock.test.tsx b/webview-ui/src/components/common/__tests__/CodeBlock.test.tsx index 3430a09ef0..c8f37e5dd6 100644 --- a/webview-ui/src/components/common/__tests__/CodeBlock.test.tsx +++ b/webview-ui/src/components/common/__tests__/CodeBlock.test.tsx @@ -28,22 +28,6 @@ jest.mock("shiki", () => ({ }, })) -// Mock all lucide-react icons with a proxy to handle any icon requested -jest.mock("lucide-react", () => { - return new Proxy( - {}, - { - get: function (_obj, prop) { - // Return a component factory for any icon that's requested - if (prop === "__esModule") { - return true - } - return () =>
{String(prop)}
- }, - }, - ) -}) - // Mock the highlighter utility jest.mock("../../../utils/highlighter", () => { const mockHighlighter = { diff --git a/webview-ui/src/components/modes/__tests__/ModesView.test.tsx b/webview-ui/src/components/modes/__tests__/ModesView.test.tsx index e0a9736337..ea21c72410 100644 --- a/webview-ui/src/components/modes/__tests__/ModesView.test.tsx +++ b/webview-ui/src/components/modes/__tests__/ModesView.test.tsx @@ -12,22 +12,6 @@ jest.mock("@src/utils/vscode", () => ({ }, })) -// Mock all lucide-react icons with a proxy to handle any icon requested -jest.mock("lucide-react", () => { - return new Proxy( - {}, - { - get: function (_obj, prop) { - // Return a component factory for any icon that's requested - if (prop === "__esModule") { - return true - } - return () =>
{String(prop)}
- }, - }, - ) -}) - const mockExtensionState = { customModePrompts: {}, listApiConfigMeta: [ diff --git a/webview-ui/src/components/settings/__tests__/ContextManagementSettings.test.tsx b/webview-ui/src/components/settings/__tests__/ContextManagementSettings.test.tsx index 94669516c6..fcac6ef9b2 100644 --- a/webview-ui/src/components/settings/__tests__/ContextManagementSettings.test.tsx +++ b/webview-ui/src/components/settings/__tests__/ContextManagementSettings.test.tsx @@ -13,20 +13,6 @@ class MockResizeObserver { global.ResizeObserver = MockResizeObserver -// Mock lucide-react icons - these don't work well in Jest/JSDOM environment -jest.mock("lucide-react", () => { - return { - Database: React.forwardRef((props: any, ref: any) =>
), - ChevronDown: React.forwardRef((props: any, ref: any) => ( -
- )), - ChevronUp: React.forwardRef((props: any, ref: any) => ( -
- )), - Check: React.forwardRef((props: any, ref: any) =>
), - } -}) - // Mock translation hook to return the key as the translation jest.mock("@/i18n/TranslationContext", () => ({ useAppTranslation: () => ({ diff --git a/webview-ui/src/components/settings/__tests__/SettingsView.test.tsx b/webview-ui/src/components/settings/__tests__/SettingsView.test.tsx index f53eb633b2..42bf5b299a 100644 --- a/webview-ui/src/components/settings/__tests__/SettingsView.test.tsx +++ b/webview-ui/src/components/settings/__tests__/SettingsView.test.tsx @@ -10,22 +10,6 @@ import SettingsView from "../SettingsView" // Mock vscode API jest.mock("@src/utils/vscode", () => ({ vscode: { postMessage: jest.fn() } })) -// Mock all lucide-react icons with a proxy to handle any icon requested -jest.mock("lucide-react", () => { - return new Proxy( - {}, - { - get: function (_obj, prop) { - // Return a component factory for any icon that's requested - if (prop === "__esModule") { - return true - } - return () =>
{String(prop)}
- }, - }, - ) -}) - // Mock ApiConfigManager component jest.mock("../ApiConfigManager", () => ({ __esModule: true, diff --git a/webview-ui/src/setupTests.ts b/webview-ui/src/setupTests.tsx similarity index 64% rename from webview-ui/src/setupTests.ts rename to webview-ui/src/setupTests.tsx index 01034af37f..2bacf60e3a 100644 --- a/webview-ui/src/setupTests.ts +++ b/webview-ui/src/setupTests.tsx @@ -30,3 +30,23 @@ Object.defineProperty(window, "matchMedia", { dispatchEvent: jest.fn(), })), }) + +// Mock lucide-react icons globally using Proxy for dynamic icon handling +jest.mock("lucide-react", () => { + return new Proxy( + {}, + { + get: function (_obj, prop) { + // Return a component factory for any icon that's requested + if (prop === "__esModule") { + return true + } + return (props: any) => ( +
+ {String(prop)} +
+ ) + }, + }, + ) +})