+If you already have Cursor installed: [Click here to install Axon Code](cursor:extension/matterai.axon-code)
:::
diff --git a/apps/kilocode-docs/docs/seats/getting-started.md b/apps/kilocode-docs/docs/seats/getting-started.md
index d28f91c3d9..93154be8f1 100644
--- a/apps/kilocode-docs/docs/seats/getting-started.md
+++ b/apps/kilocode-docs/docs/seats/getting-started.md
@@ -49,7 +49,7 @@ seats for Kilo in the Teams or Enterprise subscription brings transparent AI cod
Team members receive invitation emails with these steps:
1. Accept the team invitation
-2. Install Axon Code from [VS Code Marketplace](vscode:extension/kilocode.kilo-code)
+2. Install Axon Code from [VS Code Marketplace](vscode:extension/matterai.axon-code)
3. Sign in with their invited email
4. Start coding with AI assistance
diff --git a/apps/kilocode-docs/i18n/zh-CN/docusaurus-plugin-content-docs/current/getting-started/installing.md b/apps/kilocode-docs/i18n/zh-CN/docusaurus-plugin-content-docs/current/getting-started/installing.md
index 9552fcc097..d97874c94f 100644
--- a/apps/kilocode-docs/i18n/zh-CN/docusaurus-plugin-content-docs/current/getting-started/installing.md
+++ b/apps/kilocode-docs/i18n/zh-CN/docusaurus-plugin-content-docs/current/getting-started/installing.md
@@ -15,7 +15,7 @@ Kilo Code是一款VS Code扩展，可将AI编程助手直接集成到编辑器
:::tip
-若已安装VS Code：[点击此处直接安装Kilo Code](vscode:extension/kilocode.Kilo-Code)
+若已安装VS Code：[点击此处直接安装Kilo Code](vscode:extension/matterai.axon-code)
:::
@@ -36,7 +36,7 @@ Kilo Code是一款VS Code扩展，可将AI编程助手直接集成到编辑器
:::tip
-若已安装Cursor：[点击此处直接安装Kilo Code](cursor:extension/kilocode.Kilo-Code)
+若已安装Cursor：[点击此处直接安装Kilo Code](cursor:extension/matterai.axon-code)
:::
diff --git a/apps/kilocode-docs/i18n/zh-CN/docusaurus-theme-classic/footer.json b/apps/kilocode-docs/i18n/zh-CN/docusaurus-theme-classic/footer.json
index 9362bae1ae..286d6c3309 100644
--- a/apps/kilocode-docs/i18n/zh-CN/docusaurus-theme-classic/footer.json
+++ b/apps/kilocode-docs/i18n/zh-CN/docusaurus-theme-classic/footer.json
@@ -37,7 +37,7 @@
},
)
{
const webviewFrameEl = workbox.frameLocator(
- 'iframe[src*="extensionId=kilocode.kilo-code"][src*="purpose=webviewView"]',
+ 'iframe[src*="extensionId=matterai.axon-code"][src*="purpose=webviewView"]',
)
await webviewFrameEl.locator("#active-frame")
return webviewFrameEl.frameLocator("#active-frame")
diff --git a/apps/playwright-e2e/tests/playwright-base-test.ts b/apps/playwright-e2e/tests/playwright-base-test.ts
index 52c958ed45..cfc3498a5c 100644
--- a/apps/playwright-e2e/tests/playwright-base-test.ts
+++ b/apps/playwright-e2e/tests/playwright-base-test.ts
@@ -69,7 +69,7 @@ export const test = base.extend
+
{/*
@@ -1501,7 +1502,7 @@ export const ChatRowContent = ({
{
if (!isStreaming) {
handleEditClick()
diff --git a/webview-ui/src/components/chat/ChatView.tsx b/webview-ui/src/components/chat/ChatView.tsx
index 7141a57d88..ff71dcc755 100644
--- a/webview-ui/src/components/chat/ChatView.tsx
+++ b/webview-ui/src/components/chat/ChatView.tsx
@@ -64,6 +64,7 @@ import { ChatTextArea } from "./ChatTextArea"
import { showSystemNotification } from "@/kilocode/helpers" // kilocode_change
import BottomControls from "../kilocode/BottomControls" // kilocode_change
import KiloTaskHeader from "../kilocode/KiloTaskHeader" // kilocode_change
+import StickyUserMessage from "../kilocode/StickyUserMessage" // kilocode_change
import AutoApproveMenu from "./AutoApproveMenu"
import SystemPromptWarning from "./SystemPromptWarning"
// import ProfileViolationWarning from "./ProfileViolationWarning" kilocode_change: unused
@@ -257,6 +258,12 @@ const ChatViewComponent: React.ForwardRefRenderFunction(null)
const userRespondedRef = useRef(false)
const [currentFollowUpTs, setCurrentFollowUpTs] = useState(null)
+ // kilocode_change start: Sticky user message state
+ const [stickyMessageIndex, setStickyMessageIndex] = useState(null)
+ const stickyHeaderRef = useRef(null)
+ const virtuosoScrollerRef = useRef(null)
+ const [stickyHeaderHeight, setStickyHeaderHeight] = useState(0)
+ // kilocode_change end
const [iconsBaseUri] = useState(() => {
const w = window as any
return w.ICONS_BASE_URI || ""
@@ -1743,6 +1750,88 @@ const ChatViewComponent: React.ForwardRefRenderFunction {
+ const indices: number[] = []
+ groupedMessages.forEach((msg, i) => {
+ if (!Array.isArray(msg) && msg.type === "say" && msg.say === "user_feedback") {
+ indices.push(i)
+ }
+ })
+ return indices
+ }, [groupedMessages])
+
+ useEffect(() => {
+ const scroller = virtuosoScrollerRef.current
+ if (!scroller) return
+
+ const handleScroll = () => {
+ if (userFeedbackIndices.length === 0) {
+ setStickyMessageIndex(null)
+ return
+ }
+
+ const stickyHeight = stickyHeaderRef.current?.offsetHeight ?? 40
+ const scrollerRect = scroller.getBoundingClientRect()
+ const threshold = scrollerRect.top + stickyHeight
+
+ // Find the first rendered item to determine our position relative to the virtual list
+ const firstRenderedEl = scroller.querySelector("[data-item-index]")
+ const firstRenderedIndex = firstRenderedEl
+ ? parseInt(firstRenderedEl.getAttribute("data-item-index") || "0", 10)
+ : 0
+
+ let bestIndex: number | null = null
+
+ for (const idx of userFeedbackIndices) {
+ const el = scroller.querySelector(`[data-item-index="${idx}"]`) as HTMLElement | null
+
+ if (!el) {
+ if (idx < firstRenderedIndex) {
+ // Not in DOM and index is lower than first rendered -> Above viewport
+ bestIndex = idx
+ continue
+ } else {
+ // Not in DOM and index is higher -> Below viewport
+ break
+ }
+ }
+
+ const elTop = el.getBoundingClientRect().top
+ if (elTop <= threshold) {
+ bestIndex = idx
+ } else {
+ // Below the threshold, everything after will be too
+ break
+ }
+ }
+
+ setStickyMessageIndex(bestIndex)
+ }
+
+ scroller.addEventListener("scroll", handleScroll, { passive: true })
+ handleScroll() // Initial check
+ return () => scroller.removeEventListener("scroll", handleScroll)
+ }, [userFeedbackIndices])
+
+ // Track sticky header height with ResizeObserver so list items don't hide behind it
+ useEffect(() => {
+ const el = stickyHeaderRef.current
+ if (!el) {
+ setStickyHeaderHeight(0)
+ return
+ }
+
+ const updateHeight = () => setStickyHeaderHeight(el.offsetHeight)
+ updateHeight()
+
+ const observer = new ResizeObserver(updateHeight)
+ observer.observe(el)
+ return () => observer.disconnect()
+ }, [task?.ts]) // re-run when task mounts/changes
+ // kilocode_change end
+
// Effect to handle showing the checkpoint warning after a delay
useEffect(() => {
// Only show the warning when there's a task but no visible messages yet
@@ -2174,7 +2263,6 @@ const ChatViewComponent: React.ForwardRefRenderFunction
@@ -2243,7 +2331,7 @@ const ChatViewComponent: React.ForwardRefRenderFunction
![]()
-
- Setup Automated PR Reviews + Setup Agentic PR Reviews
+
+ {/* kilocode_change: Sticky user message - positioned outside Virtuoso for true sticky behavior */}
+ ,
+ }}
atBottomStateChange={(isAtBottom: boolean) => {
setIsAtBottom(isAtBottom)
if (isAtBottom) {
@@ -2353,6 +2457,12 @@ const ChatViewComponent: React.ForwardRefRenderFunction {
+ if (ref instanceof HTMLElement) {
+ virtuosoScrollerRef.current = ref
+ }
+ }}
/>
+
+
+
diff --git a/webview-ui/src/components/chat/CodebaseSearchResult.tsx b/webview-ui/src/components/chat/CodebaseSearchResult.tsx
index 363ae4eba0..e1670e4164 100644
--- a/webview-ui/src/components/chat/CodebaseSearchResult.tsx
+++ b/webview-ui/src/components/chat/CodebaseSearchResult.tsx
@@ -11,7 +11,12 @@ interface CodebaseSearchResultProps {
language: string
}
-const CodebaseSearchResult: React.FC = ({ filePath, score, startLine, endLine }) => {
+const CodebaseSearchResult: React.FC = ({
+ filePath,
+ // score,
+ startLine,
+ endLine,
+}) => {
// const { _t } = useTranslation("chat")
const handleClick = () => {
@@ -29,7 +34,7 @@ const CodebaseSearchResult: React.FC = ({ filePath, s
//
diff --git a/webview-ui/src/components/chat/CodebaseSearchResultsDisplay.tsx b/webview-ui/src/components/chat/CodebaseSearchResultsDisplay.tsx
index eb594af100..c14e8dc291 100644
--- a/webview-ui/src/components/chat/CodebaseSearchResultsDisplay.tsx
+++ b/webview-ui/src/components/chat/CodebaseSearchResultsDisplay.tsx
@@ -19,7 +19,7 @@ const CodebaseSearchResultsDisplay: React.FC
+ className="px-2 py-1 rounded-md text-sm cursor-pointer hover:bg-[var(--color-matterai-background-dark)] hover:text-white">
//
{filePath.split("/").at(-1)}:{startLine === endLine ? startLine : `${startLine}-${endLine}`}
@@ -37,9 +42,9 @@ const CodebaseSearchResult: React.FC = ({ filePath, s
{filePath.split("/").slice(0, -1).join("/")}
-
+ {/*
{score.toFixed(3)}
-
+ */}
setCodebaseSearchResultsExpanded(!codebaseSearchResultsExpanded)}
- className="cursor-pointer flex items-center justify-between px-2 py-2 border bg-[var(--vscode-editor-background)] border-[var(--vscode-editorGroup-border)] rounded-lg">
+ className="cursor-pointer flex items-center justify-between px-2 py-1.5 bg-[var(--vscode-editor-background)] rounded-lg">
{
+ const [currentIndex, setCurrentIndex] = useState(0)
+ const [opacity, setOpacity] = useState(1)
+
+ useEffect(() => {
+ const interval = setInterval(() => {
+ setOpacity(0)
+ setTimeout(() => {
+ setCurrentIndex((prev) => (prev + 1) % LOADING_STATES.length)
+ setOpacity(1)
+ }, 300)
+ }, 3000)
+
+ return () => clearInterval(interval)
+ }, [])
+
+ return (
+
+ {LOADING_STATES[currentIndex]}
+
+ )
+}
interface FileChange {
relPath: string
@@ -80,6 +107,7 @@ export const SourceControlPanel: React.FC = ({
vscode.postMessage({
type: "openFile",
text: comment.path,
+ values: { line: comment.startLine },
})
}
@@ -155,7 +183,7 @@ ${comment.suggestion}`
},
})
// We can't close the panel directly from here as state is in parent,
- // but typically "Apply All" implies we are done with this review session.
+ // but typically "Fix All" implies we are done with this review session.
// For now, we just apply.
// If we want to close, we should call onClose(), but maybe user wants to see confirmation.
// Let's just apply for now.
@@ -235,8 +263,8 @@ ${comment.suggestion}
{fileChanges.length > 0 && isLoading && (
)}
@@ -351,10 +379,10 @@ ${comment.suggestion}
{/* Review Header */}
-
- Analyzing...
+
-
- Review Results
+
-
+
-
- Apply All
+
) : (
-
-
+
+
)}
@@ -385,7 +411,7 @@ ${comment.suggestion}
{/* Review Summary */}
{codeReviewResult.reviewBody && (
-
+
{
isSelected={selectedTaskIds.includes(item.id)}
onToggleSelection={toggleTaskSelection}
onDelete={setDeleteTaskId}
- className="m-2"
/>
)}
/>
diff --git a/webview-ui/src/components/kilocode/KiloTaskHeader.tsx b/webview-ui/src/components/kilocode/KiloTaskHeader.tsx
index 02549bb3cd..5d3e6213af 100644
--- a/webview-ui/src/components/kilocode/KiloTaskHeader.tsx
+++ b/webview-ui/src/components/kilocode/KiloTaskHeader.tsx
@@ -1,16 +1,11 @@
// kilocode_change: new file
-import { memo, useRef, useState } from "react"
+import { memo } from "react"
import type { ClineMessage } from "@roo-code/types"
-import { useSelectedModel } from "@/components/ui/hooks/useSelectedModel"
-import { useExtensionState } from "@src/context/ExtensionStateContext"
import { cn } from "@src/lib/utils"
-import Thumbnails from "../common/Thumbnails"
-import { ReadOnlyChatText } from "../chat/ReadOnlyChatText"
-
-import { TodoListDisplay } from "../chat/TodoListDisplay"
+// import { TodoListDisplay } from "../chat/TodoListDisplay"
export interface TaskHeaderProps {
task: ClineMessage
@@ -20,252 +15,43 @@ export interface TaskHeaderProps {
cacheReads?: number
totalCost: number
contextTokens: number
- // buttonsDisabled: boolean
handleCondenseContext: (taskId: string) => void
onClose: () => void
groupedMessages: (ClineMessage | ClineMessage[])[]
onMessageClick?: (index: number) => void
isTaskActive?: boolean
todos?: any[]
- title?: string // kilocode_change: Task title from backend
+ title?: string
}
const KiloTaskHeader = ({
- task,
- // tokensIn,
- // tokensOut,
- // cacheWrites,
- // cacheReads,
- // totalCost,
- // contextTokens,
- // buttonsDisabled,
- // handleCondenseContext,
onClose,
- // groupedMessages,
- // onMessageClick,
- // isTaskActive = false,
- todos,
+ // todos,
title,
}: TaskHeaderProps) => {
- // const { t } = useTranslation()
- // const { showTaskTimeline } = useExtensionState()
- const { apiConfiguration } = useExtensionState()
- const { info: model } = useSelectedModel(apiConfiguration)
- const [isTaskExpanded, setIsTaskExpanded] = useState(false)
-
- const textContainerRef = useRef(null)
- const textRef = useRef(null)
- const contextWindow = model?.contextWindow || 1
-
- // const { width: windowWidth } = useWindowSize()
-
- // const condenseButton = (
- //
- //
- //
- // )
-
- // const hasTodos = todos && Array.isArray(todos) && todos.length > 0
-
return (
(null)
+ const previousMessagesRef = useRef("")
+
+ // Fetch profile data on mount if token exists
+ useEffect(() => {
+ if (apiConfiguration?.kilocodeToken) {
+ vscode.postMessage({ type: "fetchProfileDataRequest" })
+ }
+ }, [apiConfiguration?.kilocodeToken])
+
+ // Listen for profile data response
+ useEffect(() => {
+ const handleMessage = (event: MessageEvent) => {
+ const message = event.data
+ if (message.type === "profileDataResponse") {
+ const payload = message.payload as any
+ if (payload?.success && payload.data) {
+ setProfileData(payload.data)
+ }
+ }
+ }
+
+ window.addEventListener("message", handleMessage)
+ return () => {
+ window.removeEventListener("message", handleMessage)
+ }
+ }, [])
+
+ // Watch for new assistant responses and fetch updated profile data
+ useEffect(() => {
+ if (!apiConfiguration?.kilocodeToken || !clineMessages) return
+
+ const currentMessagesHash = JSON.stringify(
+ clineMessages.map((msg) => ({
+ type: msg.type,
+ say: msg.say,
+ partial: msg.partial,
+ ts: msg.ts,
+ })),
+ )
+
+ if (previousMessagesRef.current !== currentMessagesHash) {
+ const hasNewAssistantResponse = clineMessages.some(
+ (msg) => msg.type === "say" && (msg.say === "text" || msg.say === "completion_result") && !msg.partial,
+ )
+
+ if (hasNewAssistantResponse && previousMessagesRef.current !== "") {
+ vscode.postMessage({ type: "fetchProfileDataRequest" })
+ }
+
+ previousMessagesRef.current = currentMessagesHash
}
- return models
- }, [routerModels, betaModelsEnabled])
+ }, [clineMessages, apiConfiguration?.kilocodeToken])
+
+ // Calculate usage percentage from profile data
+ const usagePercentage =
+ profileData?.usagePercentage !== undefined
+ ? profileData.usagePercentage
+ : profileData?.usedCredits !== undefined &&
+ profileData?.totalCredits !== undefined &&
+ profileData.totalCredits > 0
+ ? (profileData.usedCredits / profileData.totalCredits) * 100
+ : null
+
+ // Always show all models including axon-code-2-pro
+ // The model will be marked as disabled if betaModelsEnabled is false
+ const models = routerModels?.["kilocode-openrouter"] ?? {}
+
+ // List of pro model IDs which require paid plan
+ const proModelIds = ["axon-code-2-pro"]
// const handleInputChange = useCallback(
// (
@@ -78,28 +139,54 @@ export const KiloCode = ({
return (
<>
+
) : (
handleCopyPrompt(comment)}>
-
+
)}
diff --git a/webview-ui/src/components/history/HistoryView.tsx b/webview-ui/src/components/history/HistoryView.tsx
index fef1c8a792..d0515bfebc 100644
--- a/webview-ui/src/components/history/HistoryView.tsx
+++ b/webview-ui/src/components/history/HistoryView.tsx
@@ -247,7 +247,7 @@ const HistoryView = ({ onDone }: HistoryViewProps) => {
-
{codeReviewResult.reviewBody}
)}
@@ -401,8 +427,8 @@ ${comment.suggestion}
className="px-3 py-2.5 border-b border-vscode-editorWidget-border last:border-b-0 hover:bg-vscode-list-hoverBackground">
- {/* kilocode_change: Show title with X button at the top */}
- {title && (
-
)
}
diff --git a/webview-ui/src/components/kilocode/StickyUserMessage.tsx b/webview-ui/src/components/kilocode/StickyUserMessage.tsx
new file mode 100644
index 0000000000..5e93b6f8b1
--- /dev/null
+++ b/webview-ui/src/components/kilocode/StickyUserMessage.tsx
@@ -0,0 +1,126 @@
+// kilocode_change: new file - Sticky user message component for chat
+import { memo, useState } from "react"
+import type { ClineMessage } from "@roo-code/types"
+import { ReadOnlyChatText } from "../chat/ReadOnlyChatText"
+import { cn } from "@src/lib/utils"
+
+export interface StickyUserMessageProps {
+ task: ClineMessage
+ messages: (ClineMessage | ClineMessage[])[]
+ stickyIndex: number | null
+}
+
+/**
+ * StickyUserMessage - Displays the current "sticky" user message.
+ *
+ * This works like sticky headers on mobile UI:
+ * - Shows the initial prompt (task.text) by default
+ * - As user scrolls, it tracks which user message should be sticky
+ * - Uses CSS position: sticky to stay at the top of the scroll container
+ */
+const StickyUserMessage = ({ task, messages, stickyIndex }: StickyUserMessageProps) => {
+ const [isExpanded, setIsExpanded] = useState(false)
+
+ // Get the message to display based on stickyIndex
+ // stickyIndex: null = task prompt, number = index in messages array (groupedMessages)
+ const getStickyMessage = () => {
+ // If stickyIndex is null, show the initial task prompt
+ if (stickyIndex === null) {
+ return {
+ text: task?.text,
+ images: task?.images,
+ }
+ }
+
+ // Find the user_feedback message at the given index in groupedMessages
+ const msg = messages[stickyIndex]
+
+ if (!msg || Array.isArray(msg)) {
+ return {
+ text: task?.text,
+ images: task?.images,
+ }
+ }
+
+ if (msg.type === "say" && msg.say === "user_feedback") {
+ return {
+ text: msg.text,
+ images: msg.images,
+ }
+ }
+
+ // Fallback to task prompt
+ return {
+ text: task?.text,
+ images: task?.images,
+ }
+ }
+
+ const stickyMessage = getStickyMessage()
+
+ if (!stickyMessage?.text && !stickyMessage?.images?.length) {
+ return null
+ }
+
+ return (
+
-
- )}
+ {/* Title with close button */}
- {title}
-
-
-
-
- setIsTaskExpanded(!isTaskExpanded)}>
- {/*
-
- */}
+
- {/* Collapsed state: Track context and cost if we have any */}
- {!isTaskExpanded && contextWindow > 0 && (
-
-
-
*/}
-
- {/*
- {t("chat:task.title")}
- {!isTaskExpanded && ":"}
- */}
- {!isTaskExpanded && (
-
+
-
- )}
-
+ {title || "New task"}
- {/*
- {/* {showTaskTimeline && (
-
- )}
- {/* Expanded state: Show task text and images */}
- {isTaskExpanded && (
- <>
-
-
*/}
- setIsTaskExpanded(!isTaskExpanded)}
- ref={textContainerRef}
- className="text-vscode-font-size overflow-y-auto break-words break-anywhere relative">
-
- {task.images && task.images.length > 0 &&
-
-
- {isTaskExpanded && contextWindow > 0 && (
-
*/}
-
- )}
-
- )}
-
-
- {t("chat:task.contextWindow")}
-
-
-
-
-
- {((typeof cacheReads === "number" && cacheReads > 0) ||
- (typeof cacheWrites === "number" && cacheWrites > 0)) && (
-
- {t("chat:task.tokens")}
- {typeof tokensIn === "number" && tokensIn > 0 && (
-
-
- {formatLargeNumber(tokensIn)}
-
- )}
- {typeof tokensOut === "number" && tokensOut > 0 && (
-
-
- {formatLargeNumber(tokensOut)}
-
- )}
-
- {!totalCost &&
- {t("chat:task.cache")}
- {typeof cacheWrites === "number" && cacheWrites > 0 && (
-
-
- )}
-
- {!!totalCost && (
-
-
- )}
-
- {t("chat:task.apiCost")}
- ${totalCost?.toFixed(2)}
-
-
+
+ )
+}
+
+export default memo(StickyUserMessage)
diff --git a/webview-ui/src/components/kilocode/chat/ModelSelector.tsx b/webview-ui/src/components/kilocode/chat/ModelSelector.tsx
index e9db7171ca..8b27e43ecd 100644
--- a/webview-ui/src/components/kilocode/chat/ModelSelector.tsx
+++ b/webview-ui/src/components/kilocode/chat/ModelSelector.tsx
@@ -1,13 +1,14 @@
-import { useMemo } from "react"
-import { SelectDropdown, DropdownOptionType } from "@/components/ui"
+import { DropdownOption, DropdownOptionType, SelectDropdown, StandardTooltip } from "@/components/ui"
+import { usePreferredModels } from "@/components/ui/hooks/kilocode/usePreferredModels"
+import { Alert02Icon, Brain01Icon } from "@/utils/customIcons"
import { OPENROUTER_DEFAULT_PROVIDER_NAME, type ProviderSettings } from "@roo-code/types"
-import { vscode } from "@src/utils/vscode"
import { useAppTranslation } from "@src/i18n/TranslationContext"
import { cn } from "@src/lib/utils"
-import { prettyModelName, getModelCredits } from "../../../utils/prettyModelName"
+import { vscode } from "@src/utils/vscode"
+import { useMemo } from "react"
+import { prettyModelName } from "../../../utils/prettyModelName"
import { useProviderModels } from "../hooks/useProviderModels"
import { getModelIdKey, getSelectedModelId } from "../hooks/useSelectedModel"
-import { usePreferredModels } from "@/components/ui/hooks/kilocode/usePreferredModels"
interface ModelSelectorProps {
currentApiConfigName?: string
@@ -17,7 +18,8 @@ interface ModelSelectorProps {
export const ModelSelector = ({ currentApiConfigName, apiConfiguration, fallbackText }: ModelSelectorProps) => {
const { t } = useAppTranslation()
- const { provider, providerModels, providerDefaultModel, isLoading, isError } = useProviderModels(apiConfiguration)
+ const { provider, providerModels, providerDefaultModel, isLoading, isError, proModelIds, proModelsEnabled } =
+ useProviderModels(apiConfiguration)
const selectedModelId = getSelectedModelId({
provider,
apiConfiguration,
@@ -30,15 +32,22 @@ export const ModelSelector = ({ currentApiConfigName, apiConfiguration, fallback
const missingModelIds = modelsIds.indexOf(selectedModelId) >= 0 ? [] : [selectedModelId]
return missingModelIds.concat(modelsIds).map((modelId) => {
const baseLabel = providerModels[modelId]?.displayName ?? prettyModelName(modelId)
- const credits = getModelCredits(modelId)
- const label = credits ? `${baseLabel} ${credits}` : baseLabel
+ // const credits = getModelCredits(modelId)
+ // const label = credits ? `${baseLabel} ${credits}` : baseLabel
+ const label = baseLabel
+ // kilocode_change: Check if this is a pro model that's disabled
+ const isProModel = proModelIds?.includes(modelId)
+ const isProModelDisabled = isProModel && !proModelsEnabled
+
return {
value: modelId,
label,
type: DropdownOptionType.ITEM,
+ disabled: isProModelDisabled,
+ isProModelDisabled,
}
})
- }, [modelsIds, providerModels, selectedModelId])
+ }, [modelsIds, providerModels, selectedModelId, proModelIds, proModelsEnabled])
const disabled = isLoading || isError
@@ -61,6 +70,40 @@ export const ModelSelector = ({ currentApiConfigName, apiConfiguration, fallback
})
}
+ const renderItem = (option: DropdownOption & { isProModelDisabled?: boolean }) => {
+ return (
+ setIsExpanded(!isExpanded)}>
+
+ {isExpanded && stickyMessage.images && stickyMessage.images.length > 0 && (
+
+ {!isExpanded ? (
+
+
+
+ ) : (
+
+
+ )}
+
+ {stickyMessage.images.slice(0, 4).map((img, i) => (
+ 
+ ))}
+ {stickyMessage.images.length > 4 && (
+ +{stickyMessage.images.length - 4} more
+ )}
+
+ )}
+
+
+ Pro models are only available on the Paid Plan
+
+
+ }>
+
+
+
+ {option.label}
+
-
+
{!hideKiloCodeButton &&
(apiConfiguration.kilocodeToken ? (
-
-
+ = {
- "axon-code": {
- id: "axon-code",
- name: "Axon Code",
- description: "Axon Code is super intelligent LLM model for coding tasks",
+ "axon-auto": {
+ id: "axon-auto",
+ name: "Auto",
+ description: "Auto is a model that automatically selects the best model for the task",
input_modalities: ["text"],
context_length: 200000,
max_output_length: 32768,
@@ -64,22 +64,21 @@ const KILO_CODE_MODELS: Record = {
created: 1750426201,
owned_by: "matterai",
pricing: {
- prompt: "0.000001",
- completion: "0.000004",
+ prompt: "0.0",
+ completion: "0.0",
image: "0",
request: "0",
input_cache_reads: "0",
input_cache_writes: "0",
},
},
- "axon-code-2": {
- id: "axon-code-2",
- name: "Axon Code 2",
- description:
- "Axon Code 2 is the next-generation of Axon Code for coding tasks, currently in experimental stage.",
+ "axon-code": {
+ id: "axon-code",
+ name: "Axon Code 1.3",
+ description: "Axon Code is super intelligent LLM model for coding tasks",
input_modalities: ["text"],
context_length: 200000,
- max_output_length: 64000,
+ max_output_length: 32768,
output_modalities: ["text"],
supported_sampling_parameters: [
"temperature",
@@ -99,22 +98,22 @@ const KILO_CODE_MODELS: Record = {
created: 1750426201,
owned_by: "matterai",
pricing: {
- prompt: "0.0000012",
- completion: "0.0000048",
+ prompt: "0.0",
+ completion: "0.0",
image: "0",
request: "0",
input_cache_reads: "0",
input_cache_writes: "0",
},
},
- "axon-mini": {
- id: "axon-mini",
- name: "Axon Mini",
+ "axon-code-2": {
+ id: "axon-code-2",
+ name: "Axon Code 2.1",
description:
- "Axon Mini is an general purpose super intelligent LLM coding model for low-effort day-to-day tasks",
+ "Axon Code 2.1 is the next-generation of Axon Code for coding tasks, currently in experimental stage.",
input_modalities: ["text"],
context_length: 200000,
- max_output_length: 16384,
+ max_output_length: 64000,
output_modalities: ["text"],
supported_sampling_parameters: [
"temperature",
@@ -134,8 +133,8 @@ const KILO_CODE_MODELS: Record = {
created: 1750426201,
owned_by: "matterai",
pricing: {
- prompt: "2.5e-7",
- completion: "0.000001",
+ prompt: "0.0000012",
+ completion: "0.0000048",
image: "0",
request: "0",
input_cache_reads: "0",
@@ -144,9 +143,9 @@ const KILO_CODE_MODELS: Record = {
},
"axon-code-2-pro": {
id: "axon-code-2-pro",
- name: "Axon Code 2 Pro",
+ name: "Axon Code 2.1 Pro",
description:
- "Axon Code 2 Pro is the next-generation of Axon Code for coding tasks, currently in experimental stage.",
+ "Axon Code 2.1 Pro is the next-generation of Axon Code for coding tasks, currently in experimental stage.",
input_modalities: ["text"],
context_length: 200000,
max_output_length: 64000,
@@ -177,75 +176,6 @@ const KILO_CODE_MODELS: Record = {
input_cache_writes: "0",
},
},
- // "gemini-3-flash-preview": {
- // id: "gemini-3-flash-preview",
- // name: "Gemini 3 Flash Preview",
- // description:
- // "Gemini 3 Flash Preview model is built for speed, combining frontier intelligence with superior search and grounding.",
- // input_modalities: ["text"],
- // context_length: 256000,
- // max_output_length: 32768,
- // output_modalities: ["text"],
- // supported_sampling_parameters: [
- // "temperature",
- // "top_p",
- // "top_k",
- // "repetition_penalty",
- // "frequency_penalty",
- // "presence_penalty",
- // "seed",
- // "stop",
- // ],
- // supported_features: ["tools", "structured_outputs", "web_search"],
- // openrouter: {
- // slug: "google/gemini-3-flash-preview",
- // },
- // datacenters: [{ country_code: "US" }],
- // created: 1750426201,
- // owned_by: "google",
- // pricing: {
- // prompt: "0.000001",
- // completion: "0.000004",
- // image: "0",
- // request: "0",
- // input_cache_reads: "0",
- // input_cache_writes: "0",
- // },
- // },
- // "gemini-3-pro-preview": {
- // id: "gemini-3-pro-preview",
- // name: "Gemini 3 Pro Preview",
- // description: "Gemini 3 Pro Preview model is an agentic and vibe-coding model by Google",
- // input_modalities: ["text"],
- // context_length: 256000,
- // max_output_length: 32768,
- // output_modalities: ["text"],
- // supported_sampling_parameters: [
- // "temperature",
- // "top_p",
- // "top_k",
- // "repetition_penalty",
- // "frequency_penalty",
- // "presence_penalty",
- // "seed",
- // "stop",
- // ],
- // supported_features: ["tools", "structured_outputs", "web_search"],
- // openrouter: {
- // slug: "google/gemini-3-pro-preview",
- // },
- // datacenters: [{ country_code: "US" }],
- // created: 1750426201,
- // owned_by: "google",
- // pricing: {
- // prompt: "0.000001",
- // completion: "0.000004",
- // image: "0",
- // request: "0",
- // input_cache_reads: "0",
- // input_cache_writes: "0",
- // },
- // },
}
const parsePrice = (value?: string): number | undefined => {
diff --git a/webview-ui/src/i18n/locales/en/chat.json b/webview-ui/src/i18n/locales/en/chat.json
index deb06dd807..ffc2560c75 100644
--- a/webview-ui/src/i18n/locales/en/chat.json
+++ b/webview-ui/src/i18n/locales/en/chat.json
@@ -222,8 +222,8 @@
"didSearchOutsideWorkspace": "searched this directory(outside of the workspace) for ) => (
/>
)
+
+export const Alert02Icon = (props: React.SVGProps) => (
+
+)
+
+export const Brain01Icon = (props: React.SVGProps) => (
+
+)
+
+export const ChatSpark01Icon = (props: React.SVGProps) => (
+
+)
+
+export const Copy01Icon = (props: React.SVGProps) => (
+
+)
+
+export const TickDouble02Icon = (props: React.SVGProps) => (
+
+)
+
+export const Tick02Icon = (props: React.SVGProps) => (
+
+)
diff --git a/webview-ui/src/utils/prettyModelName.ts b/webview-ui/src/utils/prettyModelName.ts
index ec643686cc..09266e46c4 100644
--- a/webview-ui/src/utils/prettyModelName.ts
+++ b/webview-ui/src/utils/prettyModelName.ts
@@ -1,7 +1,7 @@
// Hardcoded credits information for Axon models
const AXON_MODEL_CREDITS: Record = {
- "axon-mini": "(0.5x)",
- "axon-code": "(0.8x)",
+ "axon-auto": "(0.25x)",
+ "axon-code": "(0.5x)",
"axon-code-2": "(1x)",
"axon-code-2-pro": "(1.5x)",
}
+ {/* Usage info */}
+ {profileData && (
+
+ Manage/Upgrade plan
+
) : (
+
+ )}
+
+ {/* Manage plan button */}
+
+
+
+ Current Plan
+
+
+ {profileData.plan?.toLocaleUpperCase()}
+
+
+
+ {profileData.remainingReviews !== undefined && (
+
+ Monthly Credits
+
+
+ ${(profileData.remainingCredits || 0).toFixed(1)} / $
+ {(profileData.totalCredits || 0).toFixed(1)} remaining (
+ {usagePercentage !== null
+ ? `${usagePercentage.toFixed(0)}% used`
+ : "loading..."}
+ )
+
+
+
+ )}
+
+ Monthly Reviews
+
+
+ {profileData.remainingReviews.toFixed(0)} reviews remaining
+
+
-
+
+ }>
+
+ {{regex}}"
},
"codebaseSearch": {
- "wantsToSearch": "searching codebase for {{query}}",
- "wantsToSearchWithPath": "searching codebase for {{query}} in {{path}}",
+ "wantsToSearch": "Exploring {{query}}",
+ "wantsToSearchWithPath": "Exploring {{query}} in {{path}}",
"didSearch_one": "Found 1 result",
"didSearch_other": "Found {{count}} results",
"resultTooltip": "Similarity score: {{score}} (click to open file)"
diff --git a/webview-ui/src/index.css b/webview-ui/src/index.css
index ba2762b4b2..78f5b0388c 100644
--- a/webview-ui/src/index.css
+++ b/webview-ui/src/index.css
@@ -152,6 +152,7 @@
--color-matterai-chip-blue: #8bf4f720;
--color-matterai-yellow: #fff0ac;
--color-matterai-blue-dark: #1a3b59;
+ --color-matterai-background-dark: #15181c;
}
@layer base {
diff --git a/webview-ui/src/utils/customIcons.tsx b/webview-ui/src/utils/customIcons.tsx
index bde89a4ff4..34dcc6f78b 100644
--- a/webview-ui/src/utils/customIcons.tsx
+++ b/webview-ui/src/utils/customIcons.tsx
@@ -188,3 +188,151 @@ export const PlayIcon = (props: React.SVGProps