Merge pull request #7313 from Kilo-Org/onboarding-improvement

packages/opencode/src/cli/cmd/tui/component/dialog-model.tsx

@@ -10,8 +10,11 @@ import * as fuzzysort from "fuzzysort"
 
 export function useConnected() {
   const sync = useSync()
+  // kilocode_change - exclude "kilo" (anonymous autoload) alongside "opencode"
   return createMemo(() =>
-    sync.data.provider.some((x) => x.id !== "opencode" || Object.values(x.models).some((y) => y.cost?.input !== 0)),
+    sync.data.provider.some(
+      (x) => (x.id !== "opencode" && x.id !== "kilo") || Object.values(x.models).some((y) => y.cost?.input !== 0),
+    ),
   )
 }
 

packages/opencode/src/cli/cmd/tui/component/dialog-status.tsx

@@ -5,6 +5,7 @@ import { useDialog } from "@tui/ui/dialog"
 import { useSync } from "@tui/context/sync"
 import { For, Match, Switch, Show, createMemo } from "solid-js"
 import { Installation } from "../../../../installation"
+import { Global } from "@/global" // kilocode_change
 
 export type DialogStatusProps = {}
 
@@ -53,6 +54,21 @@ export function DialogStatus() {
       {/* kilocode_change start */}
       <text fg={theme.textMuted}>Kilo v{Installation.VERSION}</text>
       {/* kilocode_change end */}
+      {/* kilocode_change start */}
+      <box>
+        <text fg={theme.text}>Paths</text>
+        <text fg={theme.textMuted}>
+          Global config {"  "}
+          {Global.Path.config.replace(Global.Path.home, "~")}
+        </text>
+        <Show when={sync.data.path.directory}>
+          <text fg={theme.textMuted}>
+            Project {"       "}
+            {sync.data.path.directory.replace(Global.Path.home, "~")}
+          </text>
+        </Show>
+      </box>
+      {/* kilocode_change end */}
       <Show when={Object.keys(sync.data.mcp).length > 0} fallback={<text fg={theme.text}>No MCP Servers</text>}>
         <box>
           <text fg={theme.text}>{Object.keys(sync.data.mcp).length} MCP Servers</text>

packages/opencode/src/cli/cmd/tui/routes/home.tsx

@@ -15,6 +15,7 @@ import { Installation } from "@/installation"
 import { useKV } from "../context/kv"
 import { useCommandDialog } from "../component/dialog-command"
 import { KiloNews } from "@/kilocode/components/kilo-news" // kilocode_change
+import { useConnected } from "../component/dialog-model" // kilocode_change
 
 // TODO: what is the best way to do this?
 let once = false
@@ -38,9 +39,13 @@ export function Home() {
   const isFirstTimeUser = createMemo(() => sync.data.session.length === 0)
   const tipsHidden = createMemo(() => kv.get("tips_hidden", false))
   const newsHidden = createMemo(() => kv.get("news_hidden", false)) // kilocode_change
+  // kilocode_change start
+  const connected = useConnected()
+  const onboarding = createMemo(() => isFirstTimeUser() && !connected())
+  // kilocode_change end
   const showTips = createMemo(() => {
-    // Don't show tips for first-time users
-    if (isFirstTimeUser()) return false
+    if (onboarding()) return !tipsHidden() // kilocode_change - show onboarding tip
+    // kilocode_change - don't hide tips for connected first-time users
     return !tipsHidden()
   })
 
@@ -129,7 +134,13 @@ export function Home() {
             <KiloNews />
           </Show>
           <Show when={showTips()}>
-            <Tips />
+            <Tips
+              tip={
+                onboarding()
+                  ? "Using a free model \u2014 run {highlight}/connect{/highlight} to add your API key"
+                  : undefined
+              }
+            />
           </Show>
         </box>
         <box flexGrow={1} minHeight={0} />

packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx

@@ -64,7 +64,10 @@ export function Sidebar(props: { sessionID: string; overlay?: boolean }) {
   const kv = useKV()
 
   const hasProviders = createMemo(() =>
-    sync.data.provider.some((x) => x.id !== "opencode" || Object.values(x.models).some((y) => y.cost?.input !== 0)),
+    // kilocode_change - exclude "kilo" (anonymous autoload) alongside "opencode"
+    sync.data.provider.some(
+      (x) => (x.id !== "opencode" && x.id !== "kilo") || Object.values(x.models).some((y) => y.cost?.input !== 0),
+    ),
   )
   const gettingStartedDismissed = createMemo(() => kv.get("dismissed_getting_started", false))
 

packages/opencode/src/kilocode/components/tips.tsx

@@ -30,9 +30,9 @@ function parse(tip: string): TipPart[] {
   return parts
 }
 
-export function Tips() {
+export function Tips(props: { tip?: string }) {
   const theme = useTheme().theme
-  const parts = parse(TIPS[Math.floor(Math.random() * TIPS.length)])
+  const parts = parse(props.tip ?? TIPS[Math.floor(Math.random() * TIPS.length)])
 
   return (
     <box flexDirection="row" maxWidth="100%">
@@ -134,7 +134,7 @@ const TIPS = [
   "Run {highlight}kilo debug config{/highlight} to troubleshoot configuration",
   "Use {highlight}--print-logs{/highlight} flag to see detailed logs in stderr",
   "Press {highlight}Ctrl+X G{/highlight} or {highlight}/timeline{/highlight} to jump to specific messages",
-  "Press {highlight}Ctrl+X S{/highlight} or {highlight}/status{/highlight} to see system status info",
+  "Press {highlight}Ctrl+X S{/highlight} or {highlight}/status{/highlight} to see config paths, MCP servers, and system info",
   "Enable {highlight}tui.scroll_acceleration{/highlight} for smooth macOS-style scrolling",
   "Toggle username display in chat via command palette ({highlight}Ctrl+P{/highlight})",
   "Commit your project's {highlight}AGENTS.md{/highlight} file to Git for team sharing",