anomalyco · anduimagui · Mar 31, 2026
@@ -0,0 +1,97 @@
+import { useSDK } from "@/context/sdk"
+import { Markdown } from "@opencode-ai/ui/markdown"
+import { createResource, Show } from "solid-js"
+
+const README_ITEMS = 2
+const ROOT_CLASS = "size-full flex flex-col"
+
+function score(file: string) {
+  if (file === "README.md") return 0
+  if (file === "README.mdx") return 1
+  if (file === "README.markdown") return 2
+  if (file === "README.txt") return 3
+  if (file === "README") return 4
+  if (file === "readme.md") return 5
+  if (file === "readme.mdx") return 6
+  if (file === "readme.markdown") return 7
+  if (file === "readme.txt") return 8
+  if (file === "readme") return 9
+  return 10
+}
+
+export function findReadme(files: string[]) {
+  return files
+    .filter((file) => !file.includes("/") && /^readme(?:\.[^/]+)?$/i.test(file))
+    .sort((a, b) => score(a) - score(b))[0]
+}
+
+function clean(line: string) {
+  return line
+    .replace(/!\[[^\]]*\]\([^)]*\)/g, "")
+    .replace(/\[([^\]]+)\]\([^)]*\)/g, "$1")
+    .replace(/<img[^>]*>/gi, "")
+    .replace(/<[^>]+>/g, "")
+    .replace(/^#+\s*/, "")
+    .replace(/^>\s*/, "")
+    .replace(/[*_`~]/g, "")
+    .replace(/\s+/g, " ")
+    .trim()
+}
+
+function alt(text: string) {
+  const html = text.match(/<img[^>]*alt=["']([^"']+)["'][^>]*>/i)?.[1]?.trim()
+  if (html) return html.replace(/\s+logo$/i, "").trim()
+
+  const md = text.match(/!\[([^\]]+)\]\([^)]*\)/)?.[1]?.trim()
+  if (md) return md.replace(/\s+logo$/i, "").trim()
+}
+
+function preview(text: string) {
+  const items: string[] = []
+  const image = alt(text)
+  if (image) items.push(`# ${image}`)
+
+  for (const raw of text.split(/\r?\n/)) {
+    if (items.length >= README_ITEMS) break
+    const line = raw.trim()
+    if (!line) continue
+    if (/^[-*_]{3,}$/.test(line)) continue
+    const value = clean(line)
+    if (!value) continue
+    if (image && value.toLowerCase() === image.toLowerCase()) continue
+    items.push(items.length === 0 ? `# ${value}` : value)
+  }
+
+  if (items.length === 0) return
+  return items.slice(0, README_ITEMS).join("\n\n")
+}
+
+export function SessionNewRichPreview(props: { root: () => string; fallback: string }) {
+  const sdk = useSDK()
+  const [readme] = createResource(props.root, async () => {
+    const result = await sdk.client.find.files({ query: "README", dirs: "false", limit: 50 })
+    const files: string[] = result.data ?? []
+    const file = findReadme(files)
+
+    if (!file) return
+
+    const read = await sdk.client.file.read({ path: file })
+    const data = read.data
+    if (!data) return
+    if (data.type !== "text" || !data.content) return
+    return preview(data.content)
+  })
+
+  return (
+    <div class={ROOT_CLASS}>
+      <div class="h-12 shrink-0" aria-hidden />
+      <div class="flex-1 px-6 pb-30 flex items-center justify-center text-center">
+        <Show when={readme()} fallback={<div class="text-20-medium text-text-strong">{props.fallback}</div>}>
+          <div class="w-full max-w-160 text-center overflow-hidden">
+            <Markdown text={readme()!} class="text-20-medium text-text-strong" />
+          </div>
+        </Show>
+      </div>
+    </div>
+  )
+}
@@ -3,9 +3,11 @@ import { DateTime } from "luxon"
 import { useSync } from "@/context/sync"
 import { useSDK } from "@/context/sdk"
 import { useLanguage } from "@/context/language"
+import { useSettings } from "@/context/settings"
 import { Icon } from "@opencode-ai/ui/icon"
 import { Mark } from "@opencode-ai/ui/logo"
 import { getDirectory, getFilename } from "@opencode-ai/util/path"
+import { SessionNewRichPreview } from "./session-new-rich-preview"
 
 const MAIN_WORKTREE = "main"
 const CREATE_WORKTREE = "create"
@@ -19,6 +21,7 @@ export function NewSessionView(props: NewSessionViewProps) {
   const sync = useSync()
   const sdk = useSDK()
   const language = useLanguage()
+  const settings = useSettings()
 
   const sandboxes = createMemo(() => sync.project?.sandboxes ?? [])
   const options = createMemo(() => [MAIN_WORKTREE, ...sandboxes(), CREATE_WORKTREE])
@@ -28,6 +31,7 @@ export function NewSessionView(props: NewSessionViewProps) {
     return MAIN_WORKTREE
   })
   const projectRoot = createMemo(() => sync.project?.worktree ?? sdk.directory)
+  const rich = createMemo(() => settings.general.preview())
   const isWorktree = createMemo(() => {
     const project = sync.project
     if (!project) return false
@@ -47,6 +51,10 @@ export function NewSessionView(props: NewSessionViewProps) {
     return getFilename(value)
   }
 
+  if (rich()) {
+    return <SessionNewRichPreview root={projectRoot} fallback={language.t("session.new.title")} />
+  }
+
   return (
     <div class={ROOT_CLASS}>
       <div class="h-12 shrink-0" aria-hidden />

@@ -206,6 +206,15 @@ export const SettingsGeneral: Component = () => {
           />
         </SettingsRow>
 
+        <SettingsRow
+          title={language.t("settings.general.row.preview.title")}
+          description={language.t("settings.general.row.preview.description")}
+        >
+          <div data-action="settings-rich-preview">
+            <Switch checked={settings.general.preview()} onChange={(checked) => settings.general.setPreview(checked)} />
+          </div>
+        </SettingsRow>
+
         <SettingsRow
           title={language.t("settings.general.row.reasoningSummaries.title")}
           description={language.t("settings.general.row.reasoningSummaries.description")}

@@ -23,6 +23,7 @@ export interface Settings {
     autoSave: boolean
     releaseNotes: boolean
     followup: "queue" | "steer"
+    preview: boolean
     showReasoningSummaries: boolean
     shellToolPartsExpanded: boolean
     editToolPartsExpanded: boolean
@@ -89,6 +90,7 @@ const defaultSettings: Settings = {
     autoSave: true,
     releaseNotes: true,
     followup: "steer",
+    preview: false,
     showReasoningSummaries: false,
     shellToolPartsExpanded: false,
     editToolPartsExpanded: false,
@@ -154,6 +156,10 @@ export const { use: useSettings, provider: SettingsProvider } = createSimpleCont
         setFollowup(value: "queue" | "steer") {
           setStore("general", "followup", value)
         },
+        preview: withFallback(() => store.general?.preview, defaultSettings.general.preview),
+        setPreview(value: boolean) {
+          setStore("general", "preview", value)
+        },
         showReasoningSummaries: withFallback(
           () => store.general?.showReasoningSummaries,
           defaultSettings.general.showReasoningSummaries,

@@ -735,6 +735,9 @@ export const dict = {
   "settings.general.row.uiFont.description": "Customise the font used throughout the interface",
   "settings.general.row.followup.title": "Follow-up behavior",
   "settings.general.row.followup.description": "Choose whether follow-up prompts steer immediately or wait in a queue",
+  "settings.general.row.preview.title": "Show rich preview",
+  "settings.general.row.preview.description":
+    "Render a rich preview from the repository README in the new session view when available",
   "settings.general.row.followup.option.queue": "Queue",
   "settings.general.row.followup.option.steer": "Steer",
   "settings.general.row.reasoningSummaries.title": "Show reasoning summaries",