Replace session picker modal with instance welcome view

Transform the session picker from a modal into a comprehensive welcome screen that displays instance metadata, session history, and creation options. The new view provides full keyboard navigation, shows MCP server status, OpenCode binary path, and project information in a compact, space-efficient layout.

Key features:
- Instance metadata sidebar showing folder, project, VCS, version, binary path, MCP status, and server info
- Session list with keyboard navigation (↑↓, PgUp/PgDn, Home/End, Enter)
- Cmd+Enter shortcut to create new session from anywhere
- Compact design with efficient space usage
- Visual MCP server status indicators (running/stopped/error)
- Scrollable layout that keeps "New Session" section accessible
This commit is contained in:
Shantur Rathore
2025-10-24 15:41:59 +01:00
parent a1a5c4b396
commit 6f31ffc467
8 changed files with 571 additions and 54 deletions

View File

@@ -3,7 +3,6 @@ import type { Instance, LogEntry } from "../types/instance"
import { sdkManager } from "../lib/sdk-manager"
import { sseManager } from "../lib/sse-manager"
import { fetchSessions, fetchAgents, fetchProviders } from "./sessions"
import { showSessionPicker } from "./ui"
const [instances, setInstances] = createSignal<Map<string, Instance>>(new Map())
const [activeInstanceId, setActiveInstanceId] = createSignal<string | null>(null)
@@ -57,7 +56,7 @@ async function createInstance(folder: string): Promise<string> {
addInstance(instance)
try {
const { id: returnedId, port, pid } = await window.electronAPI.createInstance(id, folder)
const { id: returnedId, port, pid, binaryPath } = await window.electronAPI.createInstance(id, folder)
const client = sdkManager.createClient(port)
@@ -66,6 +65,7 @@ async function createInstance(folder: string): Promise<string> {
pid,
client,
status: "ready",
binaryPath,
})
setActiveInstanceId(id)
@@ -79,8 +79,6 @@ async function createInstance(folder: string): Promise<string> {
console.error("Failed to fetch initial data:", error)
}
showSessionPicker(id)
return id
} catch (error) {
updateInstance(id, {

View File

@@ -3,19 +3,10 @@ import { createSignal } from "solid-js"
const [hasInstances, setHasInstances] = createSignal(false)
const [selectedFolder, setSelectedFolder] = createSignal<string | null>(null)
const [isSelectingFolder, setIsSelectingFolder] = createSignal(false)
const [sessionPickerInstance, setSessionPickerInstance] = createSignal<string | null>(null)
const [instanceTabOrder, setInstanceTabOrder] = createSignal<string[]>([])
const [sessionTabOrder, setSessionTabOrder] = createSignal<Map<string, string[]>>(new Map())
function showSessionPicker(instanceId: string) {
setSessionPickerInstance(instanceId)
}
function hideSessionPicker() {
setSessionPickerInstance(null)
}
function reorderInstanceTabs(newOrder: string[]) {
setInstanceTabOrder(newOrder)
}
@@ -35,9 +26,6 @@ export {
setSelectedFolder,
isSelectingFolder,
setIsSelectingFolder,
sessionPickerInstance,
showSessionPicker,
hideSessionPicker,
instanceTabOrder,
setInstanceTabOrder,
sessionTabOrder,