From c96e178629cd2b94a8ad36f734789b0ba54d44e5 Mon Sep 17 00:00:00 2001
From: Lan_zhijiang <lanzhijiang@foxmail.com>
Date: Thu, 1 Oct 2026 21:58:08 +0800
Subject: [PATCH 1/2] =?UTF-8?q?fix(client):=20=E4=BF=AE=E5=A4=8D=20Graph?=
 =?UTF-8?q?=20=E5=B8=83=E5=B1=80=E4=B8=8E=E7=AE=A1=E7=90=86=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E4=BA=A4=E4=BA=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 按实测尺寸布局 Graph 并保留用户拖动与相机操作
- 增加匿名 Peer 就绪诊断，改善扩展、数据源和任务表单
- 同步检索恢复提示与运行时、信息库行为文档
---
 apps/client-web/src/App.vue                   |   5 +
 .../extension/extensionCard/extensionCard.vue |  54 +++--
 .../BlockInspectorPopup.vue                   |   1 +
 .../RelationInspectorPopup.vue                |   1 +
 .../SolvedContentPopup/SolvedContentPopup.vue |   1 +
 .../components/obsrv/LogEntry/LogEntry.scss   |   5 +-
 .../components/peer/peerCard/peerCard.scss    |  18 +-
 .../src/components/peer/peerCard/peerCard.ts  |   3 +-
 .../src/components/peer/peerCard/peerCard.vue |  42 +++-
 .../components/peer/peerList/peerList.scss    |  11 +-
 .../src/components/peer/peerList/peerList.vue |  14 +-
 .../src/components/recall/RecallSearch.vue    |  14 +-
 apps/client-web/src/locales/messages/en.json  |  27 ++-
 .../src/locales/messages/zh-CN.json           |  27 ++-
 .../src/views/extensions/extensions.vue       |   7 +-
 .../src/views/info-base/graph/graph.vue       | 208 +++++++++++++-----
 .../src/views/info-base/list/list.vue         |   9 +-
 apps/client-web/src/views/jobs/job/job.scss   |   7 +-
 apps/client-web/src/views/jobs/job/job.vue    |  11 +-
 .../src/views/sources/source/source.scss      |   2 +-
 .../src/views/sources/source/source.vue       |  14 +-
 .../client-runtime-and-delegation.md          |  14 ++
 docs/30-unit-tdd/info-base.md                 |  10 +-
 packages/core/src/index.ts                    |   4 +
 packages/core/src/peer/index.ts               |   1 +
 packages/core/src/peer/readiness.ts           |  83 +++++++
 26 files changed, 454 insertions(+), 139 deletions(-)
 create mode 100644 packages/core/src/peer/readiness.ts

diff --git a/apps/client-web/src/App.vue b/apps/client-web/src/App.vue
index e40cd170..66e8bc3d 100644
--- a/apps/client-web/src/App.vue
+++ b/apps/client-web/src/App.vue
@@ -162,6 +162,11 @@ const sidebarExpanded = ref(false)
 </style>
 
 <style>
+.info-base-inspector-surface {
+  border: 1px solid var(--sys-color-border-base);
+  box-shadow: 0 3px 12px rgb(0 0 0 / 16%);
+}
+
 body {
   margin: 0;
   font-family: var(--sys-typo-family-sans);
diff --git a/apps/client-web/src/components/extension/extensionCard/extensionCard.vue b/apps/client-web/src/components/extension/extensionCard/extensionCard.vue
index edf50c31..cb60bee5 100644
--- a/apps/client-web/src/components/extension/extensionCard/extensionCard.vue
+++ b/apps/client-web/src/components/extension/extensionCard/extensionCard.vue
@@ -5,7 +5,6 @@ import {
   InkButton,
   InkDialog,
   InkDropdown,
-  InkJsonEditor,
   InkLoading,
   type JsonEditorValidation,
 } from '@inkcre/ui-web'
@@ -18,6 +17,7 @@ import {
 } from '@inkcre/extension-runtime-client-web'
 import { extensionCardProps, extensionCardEmits } from './extensionCard'
 import { extensionPeerControlMode, setExtensionPeerEnabled } from '@/extension-peer-control'
+import SchemaConfigEditor from '@/components/schemaConfigEditor/schemaConfigEditor.vue'
 
 const props = defineProps(extensionCardProps)
 const emit = defineEmits(extensionCardEmits)
@@ -28,6 +28,11 @@ const configPopupOpen = ref(false)
 const configSaving = ref(false)
 const configValidation = ref<JsonEditorValidation>()
 const versionPopupOpen = ref<boolean | Promise<boolean>>(false)
+const managementOpen = ref(false)
+function openManagement(): void {
+  operationError.value = null
+  managementOpen.value = true
+}
 const setupPopupOpen = ref(false)
 const setupComponent = shallowRef<Component | null>(null)
 const setupContribution = shallowRef(getExtensionSetupContribution(props.extension.name))
@@ -44,7 +49,6 @@ const versionOptions = ref<{ label: string; value: string; description?: string
 const versionLoading = ref(false)
 const versionError = ref<string | null>(null)
 const documentation = shallowRef<ExtensionDocumentationLink[]>([])
-const documentationOpen = ref(false)
 const documentationRetry = ref(0)
 const documentationStatus = ref<'loading' | 'available' | 'missing' | 'unavailable'>('loading')
 const canSaveConfig = computed(
@@ -54,15 +58,8 @@ const canSaveConfig = computed(
 
 // --- computed ---
 watch(
-  () =>
-    [
-      props.extension.name,
-      props.extension.version,
-      documentationOpen.value,
-      documentationRetry.value,
-    ] as const,
-  async ([name, version, open], _previous, onCleanup) => {
-    if (!open) return
+  () => [props.extension.name, props.extension.version, documentationRetry.value] as const,
+  async ([name, version], _previous, onCleanup) => {
     let current = true
     onCleanup(() => {
       current = false
@@ -182,6 +179,7 @@ const onSetupClick = () => {
 }
 
 const onChangeVersionClick = async () => {
+  managementOpen.value = false
   versionModel.value = props.extension.version
   versionOptions.value = []
   versionError.value = null
@@ -250,6 +248,7 @@ const onUninstall = async () => {
   isUninstalling.value = true
   try {
     await getExtensionHost().uninstall(props.extension.name)
+    managementOpen.value = false
     emit('uninstalled')
   } catch (error) {
     operationError.value = error instanceof Error ? error.message : String(error)
@@ -298,12 +297,24 @@ const onUninstall = async () => {
         @click="onSetupClick"
       />
       <InkButton @click="onEditConfigClick" :text="t('extension.editConfig')" size="sm" />
+      <InkButton
+        :text="t('extension.versionAndRemoval')"
+        size="sm"
+        theme="subtle"
+        @click="openManagement"
+      />
     </div>
     <p class="extension-card__hint">
       {{ t('extension.enabledPeerCount', { count: extension.enabled.length }) }}
     </p>
-    <details class="extension-card__details">
-      <summary>{{ t('extension.versionAndRemoval') }}</summary>
+    <InkDialog
+      v-model="managementOpen"
+      :title="t('extension.versionAndRemoval')"
+      :subtitle="`${extension.nickname ?? extension.name} · v${extension.version}`"
+      :show-confirm="false"
+      :cancel-text="t('common.close')"
+      :is-loading="isUninstalling"
+    >
       <div class="extension-card__actions">
         <InkButton
           @click="onChangeVersionClick"
@@ -324,13 +335,10 @@ const onUninstall = async () => {
       <p v-if="extension.enabled.length > 0" class="extension-card__hint">
         {{ t('extension.uninstallDisabled') }}
       </p>
-    </details>
-    <p v-if="operationError" role="alert" class="extension-card__error">{{ operationError }}</p>
-    <details
-      class="extension-card__details"
-      @toggle="documentationOpen = ($event.target as HTMLDetailsElement).open"
-    >
-      <summary>{{ t('extension.documentation') }}</summary>
+      <p v-else class="extension-card__hint">{{ t('extension.uninstallConfirm') }}</p>
+      <p v-if="operationError" role="alert" class="extension-card__error">{{ operationError }}</p>
+    </InkDialog>
+    <div class="extension-card__documentation">
       <InkLoading
         v-if="documentationStatus === 'loading'"
         variant="spinner"
@@ -350,6 +358,7 @@ const onUninstall = async () => {
           rel="noopener noreferrer"
         >
           {{ t(`extension.documentationScope.${link.scope}`) }}
+          <span aria-hidden="true"> ↗</span>
         </a>
       </nav>
       <p v-else-if="documentationStatus === 'unavailable'" class="extension-card__hint">
@@ -364,7 +373,7 @@ const onUninstall = async () => {
         size="sm"
         @click="documentationRetry++"
       />
-    </details>
+    </div>
 
     <InkDialog
       v-model="peerDialogOpen"
@@ -440,8 +449,9 @@ const onUninstall = async () => {
       v-model="configPopupOpen"
       :title="t('extension.editConfigTitle')"
       :is-loading="configSaving"
+      style="width: min(48rem, calc(100vw - 2 * var(--sys-space-md)))"
     >
-      <InkJsonEditor
+      <SchemaConfigEditor
         v-model="configModel"
         :schema="extension.config_schema ?? undefined"
         :label="t('extension.editConfigTitle')"
diff --git a/apps/client-web/src/components/info-base/BlockInspectorPopup/BlockInspectorPopup.vue b/apps/client-web/src/components/info-base/BlockInspectorPopup/BlockInspectorPopup.vue
index 8349cb5e..c4a94e76 100644
--- a/apps/client-web/src/components/info-base/BlockInspectorPopup/BlockInspectorPopup.vue
+++ b/apps/client-web/src/components/info-base/BlockInspectorPopup/BlockInspectorPopup.vue
@@ -80,6 +80,7 @@ async function ruminate(): Promise<void> {
 
 <template>
   <InkPopup
+    class="info-base-inspector-surface"
     style="width: 420px; max-width: calc(100vw - 2 * var(--sys-space-md)); padding: 0"
     :open="open"
     :scrim="false"
diff --git a/apps/client-web/src/components/info-base/RelationInspectorPopup/RelationInspectorPopup.vue b/apps/client-web/src/components/info-base/RelationInspectorPopup/RelationInspectorPopup.vue
index d84cf403..f2a6d13a 100644
--- a/apps/client-web/src/components/info-base/RelationInspectorPopup/RelationInspectorPopup.vue
+++ b/apps/client-web/src/components/info-base/RelationInspectorPopup/RelationInspectorPopup.vue
@@ -41,6 +41,7 @@ function close(): void {
 
 <template>
   <InkPopup
+    class="info-base-inspector-surface"
     style="width: 360px; max-width: calc(100vw - 2 * var(--sys-space-md))"
     :open="true"
     :scrim="false"
diff --git a/apps/client-web/src/components/info-base/SolvedContentPopup/SolvedContentPopup.vue b/apps/client-web/src/components/info-base/SolvedContentPopup/SolvedContentPopup.vue
index 66157ae2..ae67da21 100644
--- a/apps/client-web/src/components/info-base/SolvedContentPopup/SolvedContentPopup.vue
+++ b/apps/client-web/src/components/info-base/SolvedContentPopup/SolvedContentPopup.vue
@@ -75,6 +75,7 @@ function onOpenChange(value: boolean): void {
 
 <template>
   <InkPopup
+    class="info-base-inspector-surface"
     style="width: 900px; max-width: calc(100vw - 2 * var(--sys-space-md)); padding: 0"
     :open="open"
     :scrim="false"
diff --git a/apps/client-web/src/components/obsrv/LogEntry/LogEntry.scss b/apps/client-web/src/components/obsrv/LogEntry/LogEntry.scss
index ee7cf16f..bbd40eb8 100644
--- a/apps/client-web/src/components/obsrv/LogEntry/LogEntry.scss
+++ b/apps/client-web/src/components/obsrv/LogEntry/LogEntry.scss
@@ -87,14 +87,13 @@
     color: sys-var(color, text, base);
     flex: 1 1 12rem;
     min-width: 0;
-    word-break: break-all;
-    overflow-x: scroll;
+    overflow-wrap: anywhere;
 
     &--code {
       padding: sys-var(space, xs);
       border-radius: sys-var(radius, none);
       margin: 0;
-      white-space: pre;
+      white-space: pre-wrap;
     }
   }
 }
diff --git a/apps/client-web/src/components/peer/peerCard/peerCard.scss b/apps/client-web/src/components/peer/peerCard/peerCard.scss
index 3ceb8825..f716b624 100644
--- a/apps/client-web/src/components/peer/peerCard/peerCard.scss
+++ b/apps/client-web/src/components/peer/peerCard/peerCard.scss
@@ -6,8 +6,7 @@
   justify-content: space-between;
   align-items: center;
   padding: sys-var(space, md);
-  border: 1px solid sys-var(color, border, base);
-  background-color: sys-var(color, surface, base);
+  background-color: sys-var(color, surface, subtle);
 
   &__item-info {
     min-width: 0;
@@ -31,8 +30,7 @@
   }
 
   &__current {
-    padding-inline-start: sys-var(space, sm);
-    border-inline-start: 1px solid sys-var(color, border, base);
+    white-space: nowrap;
   }
 
   &__item-id {
@@ -51,6 +49,18 @@
     gap: sys-var(space, xs);
   }
 
+  &__readiness {
+    @include apply-font(body-sm);
+    max-width: 100%;
+    p {
+      margin: sys-var(space, xs) 0;
+    }
+    ul {
+      margin: sys-var(space, xs) 0;
+      padding-left: sys-var(space, md);
+    }
+  }
+
   &__details {
     @include apply-font(body-sm);
     max-width: 100%;
diff --git a/apps/client-web/src/components/peer/peerCard/peerCard.ts b/apps/client-web/src/components/peer/peerCard/peerCard.ts
index e1f6eb8b..10a84ecd 100644
--- a/apps/client-web/src/components/peer/peerCard/peerCard.ts
+++ b/apps/client-web/src/components/peer/peerCard/peerCard.ts
@@ -1,9 +1,10 @@
 import { type PropType } from 'vue'
-import { Peer } from '@inkcre/core'
+import { Peer, type PeerReadinessObservation } from '@inkcre/core'
 
 export const peerCardProps = {
   peer: { type: Object as PropType<Peer>, required: true },
   current: { type: Boolean, default: false },
+  readiness: { type: Object as PropType<PeerReadinessObservation>, default: undefined },
   status: {
     type: String as PropType<'online' | 'offline' | 'unknown'>,
     required: true,
diff --git a/apps/client-web/src/components/peer/peerCard/peerCard.vue b/apps/client-web/src/components/peer/peerCard/peerCard.vue
index c387d214..5344053d 100644
--- a/apps/client-web/src/components/peer/peerCard/peerCard.vue
+++ b/apps/client-web/src/components/peer/peerCard/peerCard.vue
@@ -19,6 +19,19 @@ const configError = ref('')
 const deleteOpen = ref(false)
 const deleting = ref(false)
 const deleteError = ref('')
+const diagnostics = computed(() =>
+  props.readiness && props.readiness.status !== 'unavailable' ? props.readiness.diagnostics : null
+)
+const databaseComponents = computed(() =>
+  diagnostics.value
+    ? Object.entries(diagnostics.value.database).filter(
+        (entry): entry is [string, { status: string; problems?: string[] }] =>
+          typeof entry[1] === 'object' &&
+          ((entry[1].status !== 'ok' && entry[1].status !== 'not_required') ||
+            !!entry[1].problems?.length)
+      )
+    : []
+)
 function openDelete() {
   deleteError.value = ''
   deleteOpen.value = true
@@ -103,6 +116,9 @@ const getStatusText = (status: 'online' | 'offline' | 'unknown') => {
     <div class="peer-card__item-info">
       <div class="peer-card__heading">
         <InkInput v-model="peer.name" type="inline" @confirm="savePeer" />
+        <span :class="['peer-card__item-status', `peer-card__item-status--${status}`]">
+          {{ getStatusText(status) }}
+        </span>
         <span class="peer-card__version">
           {{ peer.application_version ? `v${peer.application_version}` : t('peer.versionUnknown') }}
         </span>
@@ -119,6 +135,28 @@ const getStatusText = (status: 'online' | 'offline' | 'unknown') => {
           @click="openDelete"
         />
       </div>
+      <section v-if="diagnostics" class="peer-card__readiness" :aria-label="t('peer.readiness')">
+        <p>
+          <strong>{{ t(`peer.readinessStatus.${diagnostics.status}`) }}</strong> ·
+          {{ t('peer.phase') }}: <code>{{ diagnostics.runtime.phase }}</code> ·
+          {{ t('peer.reason') }}: <code>{{ diagnostics.runtime.reason }}</code>
+        </p>
+        <p v-if="diagnostics.runtime.step">
+          {{ t('peer.step') }}: <code>{{ diagnostics.runtime.step }}</code>
+        </p>
+        <p>{{ t('peer.database') }}: {{ diagnostics.database.status }}</p>
+        <ul v-if="databaseComponents.length">
+          <li v-for="[name, component] in databaseComponents" :key="name">
+            <span>{{ name }}: {{ component.status }}</span>
+            <ul v-if="component.problems?.length">
+              <li v-for="problem in component.problems" :key="problem">{{ problem }}</li>
+            </ul>
+          </li>
+        </ul>
+      </section>
+      <p v-else-if="readiness?.status === 'unavailable'" class="peer-card__readiness">
+        {{ t(`peer.readinessUnavailable.${readiness.reason}`) }}
+      </p>
       <details class="peer-card__details">
         <summary>{{ t('common.details') }}</summary>
         <code class="peer-card__item-id">{{ peer.id }}</code>
@@ -127,10 +165,6 @@ const getStatusText = (status: 'online' | 'offline' | 'unknown') => {
         <p v-if="!current && status === 'online'">{{ t('peer.deleteOnline') }}</p>
       </details>
     </div>
-    <span :class="['peer-card__item-status', `peer-card__item-status--${status}`]">
-      {{ getStatusText(status) }}
-    </span>
-
     <InkDialog v-model="configPopupOpen" :title="t('peer.editConfig')" :is-loading="savingConfig">
       <SchemaConfigEditor
         v-model="configModel"
diff --git a/apps/client-web/src/components/peer/peerList/peerList.scss b/apps/client-web/src/components/peer/peerList/peerList.scss
index 6c637662..8ba51e24 100644
--- a/apps/client-web/src/components/peer/peerList/peerList.scss
+++ b/apps/client-web/src/components/peer/peerList/peerList.scss
@@ -5,16 +5,19 @@
 
   &__header {
     display: flex;
-    justify-content: flex-end;
+    justify-content: space-between;
     align-items: center;
-    padding-bottom: sys-var(space, md);
-    border-bottom: 1px solid sys-var(color, border, base);
+    gap: sys-var(space, md);
+    h1 {
+      @include apply-font(title-lg);
+      margin: 0;
+    }
   }
 
   &__list {
     display: flex;
     flex-direction: column;
-    gap: sys-var(space, sm);
+    gap: sys-var(space, lg);
   }
   &__skeleton {
     display: grid;
diff --git a/apps/client-web/src/components/peer/peerList/peerList.vue b/apps/client-web/src/components/peer/peerList/peerList.vue
index 41ed8e08..2efa245f 100644
--- a/apps/client-web/src/components/peer/peerList/peerList.vue
+++ b/apps/client-web/src/components/peer/peerList/peerList.vue
@@ -4,12 +4,19 @@ import { useI18n } from 'vue-i18n'
 import { InkButton, InkSkeleton, InkPlaceholder } from '@inkcre/ui-web'
 import { RouterLink } from 'vue-router'
 import { currentWebPeer } from '@/core'
-import { configStore, Peer, PeerManager } from '@inkcre/core'
+import {
+  configStore,
+  Peer,
+  PeerManager,
+  probePeerReadiness,
+  type PeerReadinessObservation,
+} from '@inkcre/core'
 import PeerCard from '../peerCard/peerCard.vue'
 
 const { t } = useI18n()
 const peers = ref<Peer[]>([])
 const livePeers = ref(new Set<string>())
+const readiness = ref(new Map<string, PeerReadinessObservation>())
 const loading = ref(false)
 const error = ref('')
 const currentPeerId = configStore.metaConfig.INKCRE_PEER_ID
@@ -27,6 +34,9 @@ const refreshPeers = async () => {
     livePeers.value = new Set(live.map((peer) => peer.id))
     const self = all.find((peer) => peer.id === currentPeerId)
     if (self) currentWebPeer.value = { id: self.id, name: self.name }
+    readiness.value = new Map(
+      await Promise.all(all.map(async (peer) => [peer.id, await probePeerReadiness(peer)] as const))
+    )
   } catch (cause) {
     error.value = cause instanceof Error ? cause.message : String(cause)
   } finally {
@@ -45,6 +55,7 @@ onMounted(refreshPeers)
 <template>
   <section class="peer-list">
     <div v-if="connected" class="peer-list__header">
+      <h1>{{ t('peer.title') }}</h1>
       <InkButton :text="t('peer.refresh')" size="sm" :is-loading="loading" @click="refreshPeers" />
     </div>
 
@@ -81,6 +92,7 @@ onMounted(refreshPeers)
         :peer="peer"
         :status="getPeerStatus(peer)"
         :current="peer.id === currentPeerId"
+        :readiness="readiness.get(peer.id)"
         @updated="refreshPeers"
       />
     </div>
diff --git a/apps/client-web/src/components/recall/RecallSearch.vue b/apps/client-web/src/components/recall/RecallSearch.vue
index fff03d9d..97894b0f 100644
--- a/apps/client-web/src/components/recall/RecallSearch.vue
+++ b/apps/client-web/src/components/recall/RecallSearch.vue
@@ -3,7 +3,12 @@ import { computed, onMounted, onUnmounted, ref, shallowRef, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRoute } from 'vue-router'
 import { InkButton, InkInput, InkPopup, InkSkeleton, InkTabs } from '@inkcre/ui-web'
-import { LexicalRetrievalManager, type BlockRef, type LexicalRetrievalMatch } from '@inkcre/core'
+import {
+  CapabilityDelegationUnavailable,
+  LexicalRetrievalManager,
+  type BlockRef,
+  type LexicalRetrievalMatch,
+} from '@inkcre/core'
 
 import router from '@/router'
 import { closeRecallSearch, openRecallSearch, recallSearchOpen } from './recall-search'
@@ -19,6 +24,7 @@ const mode = ref<'recall' | 'path'>('recall')
 const status = ref<'idle' | 'loading' | 'ready' | 'error'>('idle')
 const matches = shallowRef<LexicalRetrievalMatch[]>([])
 const selected = ref<BlockRef[]>([])
+const delegationUnavailable = ref(false)
 let generation = 0
 
 const isGraphActive = computed(() => String(route.name ?? '').startsWith('InfoBaseGraph'))
@@ -46,6 +52,7 @@ async function search(): Promise<void> {
   }
   const current = ++generation
   status.value = 'loading'
+  delegationUnavailable.value = false
   matches.value = []
   try {
     const result = await LexicalRetrievalManager.retrieve({ query: value, limit: 20 })
@@ -55,6 +62,7 @@ async function search(): Promise<void> {
   } catch (cause) {
     if (current !== generation) return
     console.error('[Recall] Search failed.', cause)
+    delegationUnavailable.value = cause instanceof CapabilityDelegationUnavailable
     status.value = 'error'
   }
 }
@@ -144,7 +152,9 @@ watch(
           </div>
         </div>
         <div v-else-if="status === 'error'" class="recall-search__feedback" role="alert">
-          <p>{{ t('infoBase.list.error') }}</p>
+          <p>
+            {{ t(delegationUnavailable ? 'infoBase.list.unavailable' : 'infoBase.list.error') }}
+          </p>
           <InkButton :text="t('common.retry')" @click="search" />
         </div>
         <p v-else-if="status === 'ready' && matches.length === 0" role="status">
diff --git a/apps/client-web/src/locales/messages/en.json b/apps/client-web/src/locales/messages/en.json
index c410e687..be3759e5 100644
--- a/apps/client-web/src/locales/messages/en.json
+++ b/apps/client-web/src/locales/messages/en.json
@@ -126,7 +126,8 @@
     "collectionIntent": "Collection intent",
     "typesLoading": "Loading source types…",
     "typesFailed": "Unable to load source types. Configuration cannot be saved until its schema is available.",
-    "typeUnavailable": "This source type is unavailable. Check installed extensions or choose an available type."
+    "typeUnavailable": "This source type is unavailable. Check installed extensions or choose an available type.",
+    "backToSources": "Back to Sources"
   },
   "extension": {
     "versionAndRemoval": "Version and removal",
@@ -176,7 +177,8 @@
     "noneInstalled": "No Extensions installed",
     "noneInstalledDescription": "Browse the Registry to add an Extension.",
     "enabledPeerCount": "Enabled on {count} Peer(s).",
-    "uninstallDisabled": "Disable every Peer before uninstalling or changing the shared version."
+    "uninstallDisabled": "Disable every Peer before uninstalling or changing the shared version.",
+    "uninstallConfirm": "Uninstall removes this extension from the deployment. Its configuration will be deleted."
   },
   "job": {
     "loadFailed": "Unable to load this job.",
@@ -222,7 +224,23 @@
     "delete": "Delete Peer",
     "deleteConfirm": "This removes the Peer and its extension enablement from this deployment. A running Peer may register again when it reconnects.",
     "deleteOnline": "Stop this Peer and wait for it to go offline before deleting it.",
-    "deleteFailed": "Unable to delete this Peer. Please try again."
+    "deleteFailed": "Unable to delete this Peer. Please try again.",
+    "readiness": "Runtime readiness",
+    "phase": "Phase",
+    "reason": "Reason",
+    "step": "Bootstrap step",
+    "database": "Database",
+    "readinessStatus": {
+      "ready": "Ready",
+      "not_ready": "Not ready"
+    },
+    "readinessUnavailable": {
+      "no_endpoint": "No public readiness endpoint is configured.",
+      "invalid_endpoint": "The public readiness URL is invalid.",
+      "transport_error": "Readiness could not be reached. Refresh to check again.",
+      "http_error": "Readiness returned an unexpected HTTP status.",
+      "invalid_response": "Readiness returned an unsupported response."
+    }
   },
   "infoBase": {
     "relationLoadFailed": "Unable to load this Relation.",
@@ -241,7 +259,8 @@
         "label_substring": "Label fragment",
         "text_substring": "Text fragment",
         "terms": "Matching terms"
-      }
+      },
+      "unavailable": "No retrieval Peer is available right now. Your query is preserved. Wait for a Peer to become ready, then retry to check live Peers again."
     },
     "blockInspector": {
       "loadFailed": "Unable to load this Block.",
diff --git a/apps/client-web/src/locales/messages/zh-CN.json b/apps/client-web/src/locales/messages/zh-CN.json
index 7edc012e..e2d1946d 100644
--- a/apps/client-web/src/locales/messages/zh-CN.json
+++ b/apps/client-web/src/locales/messages/zh-CN.json
@@ -127,7 +127,8 @@
     "collectionIntent": "采集方式",
     "typesLoading": "正在读取数据源类型…",
     "typesFailed": "无法读取数据源类型。取得对应配置规则后才能保存。",
-    "typeUnavailable": "当前数据源类型不可用，请检查已安装的扩展或选择可用类型。"
+    "typeUnavailable": "当前数据源类型不可用，请检查已安装的扩展或选择可用类型。",
+    "backToSources": "返回数据源"
   },
   "extension": {
     "versionAndRemoval": "版本与卸载",
@@ -177,7 +178,8 @@
     "noneInstalled": "还没有安装扩展",
     "noneInstalledDescription": "浏览 Registry，选择要安装的扩展。",
     "enabledPeerCount": "已在 {count} 个 Peer 上启用。",
-    "uninstallDisabled": "卸载或变更共享版本前，必须先禁用所有 Peer。"
+    "uninstallDisabled": "卸载或变更共享版本前，必须先禁用所有 Peer。",
+    "uninstallConfirm": "卸载会从此部署移除扩展，并删除其配置。"
   },
   "job": {
     "loadFailed": "无法读取此任务。",
@@ -223,7 +225,23 @@
     "delete": "删除 Peer",
     "deleteConfirm": "这会从当前部署中移除该 Peer 及其扩展启用记录。若它重新连接，可能会再次注册。",
     "deleteOnline": "请先停止该 Peer，待它离线后再删除。",
-    "deleteFailed": "无法删除该 Peer，请重试。"
+    "deleteFailed": "无法删除该 Peer，请重试。",
+    "readiness": "Runtime 就绪状态",
+    "phase": "阶段",
+    "reason": "原因",
+    "step": "启动步骤",
+    "database": "数据库",
+    "readinessStatus": {
+      "ready": "已就绪",
+      "not_ready": "未就绪"
+    },
+    "readinessUnavailable": {
+      "no_endpoint": "未配置公开就绪检查端点。",
+      "invalid_endpoint": "公开就绪检查 URL 无效。",
+      "transport_error": "无法连接就绪检查端点，可刷新后重新检查。",
+      "http_error": "就绪检查返回了意外的 HTTP 状态。",
+      "invalid_response": "就绪检查返回了不支持的响应。"
+    }
   },
   "infoBase": {
     "relationLoadFailed": "无法读取此关系。",
@@ -242,7 +260,8 @@
         "label_substring": "标签片段匹配",
         "text_substring": "正文片段匹配",
         "terms": "词语匹配"
-      }
+      },
+      "unavailable": "当前没有可用的检索 Peer。查询已保留；等待 Peer 就绪后重试，将重新检查在线 Peer。"
     },
     "blockInspector": {
       "loadFailed": "无法读取此区块。",
diff --git a/apps/client-web/src/views/extensions/extensions.vue b/apps/client-web/src/views/extensions/extensions.vue
index 87b7a272..674694e4 100644
--- a/apps/client-web/src/views/extensions/extensions.vue
+++ b/apps/client-web/src/views/extensions/extensions.vue
@@ -2,7 +2,7 @@
 import { computed, onMounted, ref, watch } from 'vue'
 import { RouterLink, useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
-import { InkButton, InkLoading, InkSkeleton, InkPlaceholder } from '@inkcre/ui-web'
+import { InkButton, InkSkeleton, InkPlaceholder } from '@inkcre/ui-web'
 import { usePageObjectTitle } from '@/composables/use-page-object-title'
 import { configStore, Peer, PeerManager, type InstalledExtension } from '@inkcre/core'
 import type { ReleaseRecord } from '@inkcre/extension-runtime-client-web'
@@ -269,9 +269,8 @@ onMounted(() => {
     </InkPlaceholder>
 
     <template v-else>
-      <section v-if="peersLoading || peerError" class="extensions-view__peer-status">
-        <InkLoading v-if="peersLoading" variant="spinner" size="xs" :label="t('common.loading')" />
-        <p v-else role="alert" class="extensions-view__error">
+      <section v-if="peerError" class="extensions-view__peer-status">
+        <p role="alert" class="extensions-view__error">
           {{ t('extension.peerListUnavailable', { error: peerError }) }}
         </p>
         <InkButton v-if="peerError" :text="t('common.retry')" size="sm" @click="refreshPeers" />
diff --git a/apps/client-web/src/views/info-base/graph/graph.vue b/apps/client-web/src/views/info-base/graph/graph.vue
index fb03ada1..2ac555db 100644
--- a/apps/client-web/src/views/info-base/graph/graph.vue
+++ b/apps/client-web/src/views/info-base/graph/graph.vue
@@ -1,14 +1,9 @@
 <script setup lang="ts">
 import { computed, nextTick, ref, shallowRef, watch } from 'vue'
-import {
-  VueFlow,
-  useNodesInitialized,
-  useVueFlow,
-  type GraphNode,
-  type NodeDragEvent,
-} from '@vue-flow/core'
+import { VueFlow, useNodesInitialized, useVueFlow, type NodeDragEvent } from '@vue-flow/core'
 import { InkButton, InkDropdown, InkForm, InkLoading } from '@inkcre/ui-web'
 import {
+  CapabilityDelegationUnavailable,
   getInfoBaseRouter,
   GraphNavigationRetrievalManager,
   LexicalRetrievalManager,
@@ -38,14 +33,18 @@ const currentRoute = computed(() => infoBaseRouter.current.value)
 const nodes = shallowRef<BlockNode[]>([])
 const edges = shallowRef<RelationEdge[]>([])
 const status = ref<SceneStatus>('loading')
+const delegationUnavailable = ref(false)
 const scale = ref<SceneScale>('standard')
 const direction = ref<GraphDirection>('both')
 const previewReady = ref(false)
 const pendingCamera = ref(false)
 const positionCache = new Map<string, { x: number; y: number }>()
+const draggedNodes = new Set<string>()
 let generation = 0
+let realizing = false
+let realizationRequested = false
 
-const { fitView, zoomIn, zoomOut, getNodes, onMoveStart } = useVueFlow()
+const { fitView, zoomIn, zoomOut, getNodes, onMoveStart, updateNodeInternals } = useVueFlow()
 const nodesInitialized = useNodesInitialized()
 onMoveStart(() => {
   pendingCamera.value = false
@@ -199,6 +198,7 @@ async function loadPreviews(
 async function loadScene(): Promise<void> {
   const current = ++generation
   status.value = 'loading'
+  delegationUnavailable.value = false
   previewReady.value = false
   pendingCamera.value = true
   try {
@@ -252,6 +252,7 @@ async function loadScene(): Promise<void> {
     console.error('[InfoBase] Failed to load Graph scene.', cause)
     nodes.value = []
     edges.value = []
+    delegationUnavailable.value = cause instanceof CapabilityDelegationUnavailable
     status.value = 'error'
   }
 }
@@ -260,37 +261,82 @@ function layoutMeasuredNodes(): void {
   const measured = getNodes.value
   if (measured.length === 0) return
   const byId = new Map(measured.map((node) => [node.id, node]))
-  const focalId =
-    focalBlock.value !== null
-      ? String(focalBlock.value)
-      : (measured.find((node) => !positionCache.has(node.id))?.id ?? measured[0]!.id)
-  const focalPosition = positionCache.get(focalId) ?? { x: 0, y: 0 }
-  const neighbors = [...nodes.value]
-    .filter((node) => node.id !== focalId && !positionCache.has(node.id))
-    .sort((left, right) => Number(left.id) - Number(right.id))
-  const measuredWidth = (node: GraphNode): number => {
-    if (node.dimensions.width > 0) return node.dimensions.width
-    return typeof node.width === 'number' ? node.width : 180
+  const focalId = focalBlock.value !== null ? String(focalBlock.value) : measured[0]!.id
+  const dimensions = (id: string) => {
+    const node = byId.get(id)!
+    return { width: node.dimensions.width, height: node.dimensions.height }
   }
-  const maxWidth = Math.max(180, ...measured.map(measuredWidth))
-  const radius = Math.max(280, (neighbors.length * maxWidth) / (Math.PI * 2))
-  nodes.value = nodes.value.map((node) => {
-    const cached = positionCache.get(node.id)
-    if (cached) return { ...node, position: cached }
-    if (node.id === focalId) {
-      positionCache.set(node.id, focalPosition)
-      return { ...node, position: focalPosition }
-    }
-    const index = neighbors.findIndex((neighbor) => neighbor.id === node.id)
-    const angle = -Math.PI / 2 + (Math.PI * 2 * index) / Math.max(1, neighbors.length)
-    const measuredNode = byId.get(node.id)
-    const position = {
-      x: focalPosition.x + Math.cos(angle) * radius - (measuredNode?.dimensions.width ?? 0) / 2,
-      y: focalPosition.y + Math.sin(angle) * radius - (measuredNode?.dimensions.height ?? 0) / 2,
-    }
+  const gap = 32
+  const occupied: Array<{ x: number; y: number; width: number; height: number }> = []
+  const positions = new Map<string, { x: number; y: number }>()
+  const overlaps = (box: { x: number; y: number; width: number; height: number }) =>
+    occupied.some(
+      (other) =>
+        box.x < other.x + other.width + gap &&
+        box.x + box.width + gap > other.x &&
+        box.y < other.y + other.height + gap &&
+        box.y + box.height + gap > other.y
+    )
+  // User drag owns its coordinates. Keep automatic positions too unless a changed preview now collides.
+  const retained = [...nodes.value].sort(
+    (left, right) => Number(draggedNodes.has(right.id)) - Number(draggedNodes.has(left.id))
+  )
+  for (const node of retained) {
+    const position = draggedNodes.has(node.id)
+      ? byId.get(node.id)?.position
+      : positionCache.get(node.id)
+    if (!position) continue
+    const box = { ...position, ...dimensions(node.id) }
+    if (!draggedNodes.has(node.id) && overlaps(box)) continue
+    positions.set(node.id, position)
     positionCache.set(node.id, position)
-    return { ...node, position }
-  })
+    occupied.push(box)
+  }
+  const focalSize = dimensions(focalId)
+  const focalPosition = positions.get(focalId) ?? positionCache.get(focalId) ?? { x: 0, y: 0 }
+  const center = {
+    x: focalPosition.x + focalSize.width / 2,
+    y: focalPosition.y + focalSize.height / 2,
+  }
+  const largest = Math.max(
+    ...measured.map((node) => Math.hypot(node.dimensions.width, node.dimensions.height))
+  )
+  const step = Math.max(220, largest / 2 + gap)
+  const farthest = Math.max(
+    0,
+    ...occupied.map((box) => Math.hypot(box.x - center.x, box.y - center.y) + largest)
+  )
+  // Beyond existing bounds, two more rings per new rectangle always provide an empty candidate.
+  const maxRing = Math.ceil(farthest / step) + nodes.value.length * 2 + 2
+  const unplaced = nodes.value
+    .filter((node) => !positions.has(node.id))
+    .sort((left, right) =>
+      left.id === focalId ? -1 : right.id === focalId ? 1 : Number(left.id) - Number(right.id)
+    )
+  for (const node of unplaced) {
+    const size = dimensions(node.id)
+    let placed = false
+    for (let ring = node.id === focalId ? 0 : 1; ring <= maxRing && !placed; ring++) {
+      const radius = ring * step
+      const slots = ring === 0 ? 1 : Math.max(8, Math.ceil((2 * Math.PI * radius) / 212))
+      for (let slot = 0; slot < slots; slot++) {
+        const angle = -Math.PI / 2 + (2 * Math.PI * slot) / slots
+        const position = {
+          x: center.x + Math.cos(angle) * radius - size.width / 2,
+          y: center.y + Math.sin(angle) * radius - size.height / 2,
+        }
+        const box = { ...position, ...size }
+        if (overlaps(box)) continue
+        positions.set(node.id, position)
+        positionCache.set(node.id, position)
+        occupied.push(box)
+        placed = true
+        break
+      }
+    }
+    if (!placed) throw new Error('Graph layout exceeded its scene bound')
+  }
+  nodes.value = nodes.value.map((node) => ({ ...node, position: positions.get(node.id)! }))
 }
 
 function routeEdges(): void {
@@ -322,33 +368,63 @@ function routeEdges(): void {
 }
 
 async function realizeScene(): Promise<void> {
-  await nextTick()
-  layoutMeasuredNodes()
-  await nextTick()
-  routeEdges()
-  await nextTick()
-  if (!pendingCamera.value) return
-  pendingCamera.value = false
-  const narrow = (container.value?.clientWidth ?? 0) < 640
-  const focalId =
-    focalBlock.value ?? (sceneAddress.value?.type === 'path' ? sceneAddress.value.from : null)
-  // A phone-sized canvas starts with a readable focal object; panning reveals its neighborhood.
-  const visibleNodes =
-    narrow && focalId !== null ? [String(focalId)] : nodes.value.map((node) => node.id)
-  await fitView({
-    nodes: visibleNodes,
-    minZoom: 0.75,
-    padding: 0.18,
-    maxZoom: 1.25,
-    duration: window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 0 : 260,
-  })
+  if (!previewReady.value || !nodesInitialized.value) return
+  if (realizing) {
+    realizationRequested = true
+    return
+  }
+  realizing = true
+  const current = generation
+  try {
+    await nextTick()
+    updateNodeInternals(nodes.value.map((node) => node.id))
+    // VueFlow's public update schedules measurement on the next animation frame.
+    await new Promise<void>((resolve) =>
+      requestAnimationFrame(() => requestAnimationFrame(() => resolve()))
+    )
+    if (current !== generation || !previewReady.value || !nodesInitialized.value) return
+    layoutMeasuredNodes()
+    await nextTick()
+    routeEdges()
+    await nextTick()
+    if (current !== generation || !pendingCamera.value) return
+    pendingCamera.value = false
+    const narrow = (container.value?.clientWidth ?? 0) < 640
+    const focalId =
+      focalBlock.value ?? (sceneAddress.value?.type === 'path' ? sceneAddress.value.from : null)
+    const visibleNodes =
+      narrow && focalId !== null ? [String(focalId)] : nodes.value.map((node) => node.id)
+    await fitView({
+      nodes: visibleNodes,
+      minZoom: narrow && focalId !== null ? 0.75 : 0.05,
+      padding: 0.18,
+      maxZoom: 1.25,
+      duration: window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 0 : 260,
+    })
+  } finally {
+    realizing = false
+    if (realizationRequested) {
+      realizationRequested = false
+      void realizeScene()
+    }
+  }
 }
 
 watch([sceneKey, scale], () => void loadScene(), { immediate: true })
 watch(direction, applyPresentation)
-watch([nodesInitialized, previewReady], ([initialized, ready]) => {
-  if (initialized && ready) void realizeScene()
-})
+watch(
+  [
+    nodesInitialized,
+    previewReady,
+    () =>
+      getNodes.value
+        .map((node) => `${node.id}:${node.dimensions.width}:${node.dimensions.height}`)
+        .join(','),
+  ],
+  () => {
+    if (nodesInitialized.value && previewReady.value) void realizeScene()
+  }
+)
 
 function focusBlock(block: number): void {
   pendingCamera.value = true
@@ -368,6 +444,11 @@ function inspectRelation(relation: number): void {
   void infoBaseRouter.push({ name: 'relation', relation })
 }
 
+function onNodeDragStart(event: NodeDragEvent): void {
+  pendingCamera.value = false
+  draggedNodes.add(event.node.id)
+}
+
 function onNodeDragStop(event: NodeDragEvent): void {
   positionCache.set(event.node.id, { ...event.node.position })
   routeEdges()
@@ -431,6 +512,10 @@ function isRoute(route: InfoBaseRoute | null, name: InfoBaseRoute['name']): bool
         <p v-if="status === 'empty' || status === 'missing'">Search for another starting point.</p>
         <p v-else-if="status === 'limit'">Try two closer starting points.</p>
         <p v-else-if="status === 'not-found'">Try another pair of blocks.</p>
+        <p v-else-if="delegationUnavailable">
+          No retrieval Peer is available right now. Your query is preserved. Wait for a Peer to
+          become ready, then retry to check live Peers again.
+        </p>
         <p v-else>Your current location is preserved. You can try loading it again.</p>
         <InkButton v-if="status === 'error'" text="Retry" theme="primary" @click="loadScene" />
         <InkButton v-else text="Search information" theme="subtle" @click="openRecallSearch" />
@@ -442,9 +527,10 @@ function isRoute(route: InfoBaseRoute | null, name: InfoBaseRoute['name']): bool
       v-model:nodes="nodes"
       v-model:edges="edges"
       class="graph-view__flow"
-      :min-zoom="0.18"
+      :min-zoom="0.05"
       :max-zoom="2.4"
       :nodes-draggable="true"
+      @node-drag-start="onNodeDragStart"
       @node-drag-stop="onNodeDragStop"
     >
       <template #node-block="nodeProps">
diff --git a/apps/client-web/src/views/info-base/list/list.vue b/apps/client-web/src/views/info-base/list/list.vue
index 9d724451..5d45d785 100644
--- a/apps/client-web/src/views/info-base/list/list.vue
+++ b/apps/client-web/src/views/info-base/list/list.vue
@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n'
 import { useRoute } from 'vue-router'
 import { InkButton, InkSkeleton } from '@inkcre/ui-web'
 import {
+  CapabilityDelegationUnavailable,
   getInfoBaseRouter,
   LexicalRetrievalManager,
   type LexicalRetrievalMatch,
@@ -22,6 +23,7 @@ const input = ref('')
 const status = ref<'idle' | 'loading' | 'success' | 'error'>('idle')
 const matches = shallowRef<LexicalRetrievalMatch[]>([])
 const error = shallowRef<Error | null>(null)
+const delegationUnavailable = computed(() => error.value instanceof CapabilityDelegationUnavailable)
 let generation = 0
 
 const currentInfoBaseRoute = computed(() => infoBaseRouter.current.value)
@@ -97,10 +99,7 @@ function refresh(): void {
           :is-loading="status === 'loading'"
         />
       </form>
-      <details class="info-base-list-view__help">
-        <summary>{{ t('infoBase.list.help') }}</summary>
-        <p>{{ t('infoBase.list.idle') }}</p>
-      </details>
+      <p class="info-base-list-view__help">{{ t('infoBase.list.idle') }}</p>
     </header>
 
     <section class="info-base-list-view__results" aria-live="polite">
@@ -119,7 +118,7 @@ function refresh(): void {
         </div>
       </div>
       <div v-else-if="status === 'error'" class="info-base-list-view__state">
-        <p>{{ t('infoBase.list.error') }}</p>
+        <p>{{ t(delegationUnavailable ? 'infoBase.list.unavailable' : 'infoBase.list.error') }}</p>
         <details>
           <summary>{{ t('common.errorDetails') }}</summary>
           {{ error?.message }}
diff --git a/apps/client-web/src/views/jobs/job/job.scss b/apps/client-web/src/views/jobs/job/job.scss
index ee4f8034..aa696d34 100644
--- a/apps/client-web/src/views/jobs/job/job.scss
+++ b/apps/client-web/src/views/jobs/job/job.scss
@@ -33,7 +33,6 @@
     flex-direction: column;
     gap: sys-var(space, md);
     padding: sys-var(space, md);
-    border-top: 1px solid sys-var(color, border, subtle);
     box-sizing: border-box;
     min-width: 0;
     flex: 1 1 22rem;
@@ -44,7 +43,6 @@
     flex-direction: column;
     gap: sys-var(space, md);
     padding: sys-var(space, md);
-    border-top: 1px solid sys-var(color, border, subtle);
     box-sizing: border-box;
     align-self: stretch;
     flex: 2 1 28rem;
@@ -74,12 +72,15 @@
 
   &__value:is(pre) {
     @include apply-font(body-sm, $mono: true);
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+    max-width: 100%;
+    margin: 0;
   }
 
   &__value {
     @include apply-font(label-lg);
     color: sys-var(color, text, base);
-    overflow-x: auto;
 
     &.status--pending {
       color: sys-var(color, feedback, warning);
diff --git a/apps/client-web/src/views/jobs/job/job.vue b/apps/client-web/src/views/jobs/job/job.vue
index ee0f5daa..6732e3a6 100644
--- a/apps/client-web/src/views/jobs/job/job.vue
+++ b/apps/client-web/src/views/jobs/job/job.vue
@@ -144,16 +144,11 @@ watch(
         </InkField>
 
         <InkField :label="t('job.status')">
-          <div class="flex items-center gap-2">
+          <div class="flex items-center gap-2" :aria-busy="jobLoading">
             <span class="metadata__value" :class="statusColor">
               {{ job.status }}
             </span>
-            <InkLoading
-              v-if="jobLoading"
-              variant="spinner"
-              size="xs"
-              :label="t('common.loading')"
-            />
+            <InkLoading v-if="jobLoading" variant="spinner" size="xs" aria-hidden="true" />
           </div>
         </InkField>
 
@@ -193,7 +188,7 @@ watch(
         </InkField>
 
         <InkField :label="t('job.state')">
-          <pre class="metadata__value whitespace-pre">{{ formattedState }}</pre>
+          <pre class="metadata__value">{{ formattedState }}</pre>
         </InkField>
       </section>
 
diff --git a/apps/client-web/src/views/sources/source/source.scss b/apps/client-web/src/views/sources/source/source.scss
index dd3cf651..29649316 100644
--- a/apps/client-web/src/views/sources/source/source.scss
+++ b/apps/client-web/src/views/sources/source/source.scss
@@ -103,7 +103,7 @@
     outline-offset: 2px;
   }
   &__popup {
-    width: min(32rem, 80vw);
+    width: 100%;
     max-width: 100%;
     min-width: 0;
     gap: sys-var(space, md);
diff --git a/apps/client-web/src/views/sources/source/source.vue b/apps/client-web/src/views/sources/source/source.vue
index c0974372..9ca2cdf2 100644
--- a/apps/client-web/src/views/sources/source/source.vue
+++ b/apps/client-web/src/views/sources/source/source.vue
@@ -14,13 +14,13 @@ import {
   InkButton,
   InkDialog,
   InkPopup,
-  InkJsonEditor,
   InkDropdown,
   InkInput,
   InkForm,
   type JsonEditorValidation,
 } from '@inkcre/ui-web'
 import SourceForm from '@/components/source/sourceForm/sourceForm.vue'
+import SchemaConfigEditor from '@/components/schemaConfigEditor/schemaConfigEditor.vue'
 import JobCard from '@/components/job/JobCard/JobCard.vue'
 import { Cron, CronForm, Job, JobManager, Source } from '@inkcre/core'
 import { usePageObjectTitle } from '@/composables/use-page-object-title'
@@ -309,9 +309,11 @@ async function onDeleteCron() {
 
 <template>
   <main class="source-view">
-    <RouterLink :to="{ path: '/sources', hash: `#source-${sourceId}` }" class="source-view__back">{{
-      t('sidePanel.sources')
-    }}</RouterLink>
+    <nav :aria-label="t('common.back')">
+      <RouterLink :to="{ path: '/sources', hash: `#source-${sourceId}` }" class="source-view__back">
+        <span aria-hidden="true">←</span> {{ t('source.backToSources') }}
+      </RouterLink>
+    </nav>
     <div
       v-if="sourceLoading"
       class="source-view__skeleton"
@@ -467,6 +469,7 @@ async function onDeleteCron() {
   <InkPopup
     :open="newJobOpen"
     position="center"
+    style="width: min(56rem, calc(100vw - 2 * var(--sys-space-md)))"
     :aria-label="t('source.newJobTitle')"
     :close-on-scrim="!jobSaving"
     :close-on-escape="!jobSaving"
@@ -485,11 +488,10 @@ async function onDeleteCron() {
         :label="t('source.collectionIntent')"
         :disabled="jobSaving"
       />
-      <InkJsonEditor
+      <SchemaConfigEditor
         v-model="jobConfig"
         :schema="jobSchema ?? undefined"
         :label="t('job.config')"
-        :rows="6"
         :disabled="jobSaving"
         @validation="jobValidation = $event"
       />
diff --git a/docs/30-unit-tdd/client-runtime-and-delegation.md b/docs/30-unit-tdd/client-runtime-and-delegation.md
index 7a742e22..c70254fd 100644
--- a/docs/30-unit-tdd/client-runtime-and-delegation.md
+++ b/docs/30-unit-tdd/client-runtime-and-delegation.md
@@ -45,6 +45,20 @@ the manager must not retry it, the UI must distinguish it from ordinary failure,
 not report it as success. A malformed response after a readable dispatch is a protocol error, not
 proof of non-execution.
 
+## Public Readiness Observation
+
+`probePeerReadiness(Peer)` observes only the explicitly configured `http_public_base_url` and its
+`readyz` path. It sends no authentication and uses a five-second deadline. The shared core schema
+keeps ready/not_ready, runtime phase/reason, optional bootstrap step, and public database component
+status/problems. Older Peers may omit step. Missing or invalid endpoints and failed/unsupported
+responses are distinct unavailable observations; they do not imply an expired lease.
+
+PeerList refreshes this observation alongside database facts and shows public diagnostics directly.
+The probe never writes Peer state, changes advertisements, or grants routing/scheduling eligibility.
+Read-only retrieval keeps the query and offers an explicit Retry after delegation unavailability;
+that action repeats the existing live-lease selection. Outcome-unknown and exact-target safety remain
+unchanged.
+
 ## Browser Configuration and JWT
 
 Before business views mount, the browser initializes three bootstrap values owned by the current browser
diff --git a/docs/30-unit-tdd/info-base.md b/docs/30-unit-tdd/info-base.md
index c3c0351d..c7d54dcc 100644
--- a/docs/30-unit-tdd/info-base.md
+++ b/docs/30-unit-tdd/info-base.md
@@ -113,10 +113,16 @@ entity changes focal identity, while Inspect is an explicit secondary route. Blo
 and solved content are modeless route outlets whose close action delegates to browser/router `back()`.
 
 Graph shells render before bounded Resolver previews. Intrinsic DOM dimensions inform deterministic
-local layout; shared positions survive scene changes and user drag is session-only. Direction is soft
+local layout. Resolved previews explicitly refresh VueFlow internals before measurement. New nodes,
+including a new focal node, avoid occupied measured rectangles with a gap. Cached automatic positions
+survive scene changes unless changed preview dimensions collide; user-dragged coordinates stay owned
+by the user, including during preview settlement. Candidate rings expand within the current scene
+bound rather than estimating one radius from the number of new neighbors. User drag is session-only. Direction is soft
 presentation state: muted entities remain present and interactive and changing direction performs no
 retrieval. Automatic camera movement follows explicit focal/path/refocus actions only; manual movement
-cancels pending ownership.
+cancels pending ownership, including node drag start. Refocus waits for the same ready-preview and
+node-measurement boundary; later dimension changes can repair automatic positions and edge handles
+but cannot reacquire the viewport.
 
 Application Recall/Search is not part of an InfoBase View, but an active View may realize its selected
 destination. Recall defaults to List outside a View; Find path supplies two Block references to Graph.
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
index f94053b1..f06fba29 100644
--- a/packages/core/src/index.ts
+++ b/packages/core/src/index.ts
@@ -37,6 +37,10 @@ export {
   PeerManager,
   WebPeerRuntime,
   PeerHTTPOutbound,
+  PeerReadinessSchema,
+  probePeerReadiness,
+  type PeerReadiness,
+  type PeerReadinessObservation,
   CapabilityDelegationUnavailable,
   PeerOutcomeUnknown,
   PeerProtocolError,
diff --git a/packages/core/src/peer/index.ts b/packages/core/src/peer/index.ts
index c863147c..1489d65f 100644
--- a/packages/core/src/peer/index.ts
+++ b/packages/core/src/peer/index.ts
@@ -2,4 +2,5 @@ export * from './contracts'
 export * from './http'
 export * from './manager'
 export * from './peer'
+export * from './readiness'
 export * from './runtime'
diff --git a/packages/core/src/peer/readiness.ts b/packages/core/src/peer/readiness.ts
new file mode 100644
index 00000000..575dbb11
--- /dev/null
+++ b/packages/core/src/peer/readiness.ts
@@ -0,0 +1,83 @@
+import { z } from 'zod'
+import type { Peer } from './peer'
+
+const DatabaseComponentSchema = z.object({
+  status: z.string(),
+  problems: z.array(z.string()).optional(),
+})
+
+/** Public diagnostics only; lease and capability advertisements remain routing authority. */
+export const PeerReadinessSchema = z.object({
+  status: z.enum(['ready', 'not_ready']),
+  runtime: z.object({
+    phase: z.string(),
+    reason: z.string(),
+    step: z.string().nullable().optional(),
+  }),
+  database: z.object({
+    status: z.string(),
+    database: DatabaseComponentSchema.optional(),
+    migration: DatabaseComponentSchema.extend({
+      current: z.array(z.string()).optional(),
+      expected: z.array(z.string()).optional(),
+    }).optional(),
+    roles: DatabaseComponentSchema.optional(),
+    privileges: DatabaseComponentSchema.optional(),
+    catalog: DatabaseComponentSchema.optional(),
+    seed: DatabaseComponentSchema.optional(),
+  }),
+})
+
+export type PeerReadiness = z.infer<typeof PeerReadinessSchema>
+export type PeerReadinessObservation =
+  | { status: 'ready' | 'not_ready'; diagnostics: PeerReadiness }
+  | {
+      status: 'unavailable'
+      reason:
+        | 'no_endpoint'
+        | 'invalid_endpoint'
+        | 'transport_error'
+        | 'http_error'
+        | 'invalid_response'
+    }
+
+/** Observe an explicit public HTTP base without authentication or runtime mutation. */
+export async function probePeerReadiness(peer: Peer): Promise<PeerReadinessObservation> {
+  const base = peer.config.http_public_base_url
+  if (base === null || base === undefined || base === '') {
+    return { status: 'unavailable', reason: 'no_endpoint' }
+  }
+  let url: URL
+  try {
+    if (typeof base !== 'string') throw new Error('Invalid endpoint')
+    url = new URL(base)
+    if (
+      !['http:', 'https:'].includes(url.protocol) ||
+      url.username ||
+      url.password ||
+      url.search ||
+      url.hash
+    ) {
+      throw new Error('Invalid endpoint')
+    }
+    url.pathname = `${url.pathname.replace(/\/$/, '')}/readyz`
+  } catch {
+    return { status: 'unavailable', reason: 'invalid_endpoint' }
+  }
+  try {
+    const response = await fetch(url, { signal: AbortSignal.timeout(5000), credentials: 'omit' })
+    if (!response.ok && response.status !== 503)
+      return { status: 'unavailable', reason: 'http_error' }
+    let body: unknown
+    try {
+      body = await response.json()
+    } catch {
+      return { status: 'unavailable', reason: 'invalid_response' }
+    }
+    const result = PeerReadinessSchema.safeParse(body)
+    if (!result.success) return { status: 'unavailable', reason: 'invalid_response' }
+    return { status: result.data.status, diagnostics: result.data }
+  } catch {
+    return { status: 'unavailable', reason: 'transport_error' }
+  }
+}

From 5c7301f67f7f217f5741c107d86eefb5f1f49a3e Mon Sep 17 00:00:00 2001
From: Lan_zhijiang <lanzhijiang@foxmail.com>
Date: Sat, 3 Oct 2026 13:15:36 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix(job):=20=E4=BF=9D=E7=95=99=E9=94=99?=
 =?UTF-8?q?=E8=AF=AF=E8=AF=A6=E6=83=85=E7=9A=84=E5=8E=9F=E5=A7=8B=E6=8D=A2?=
 =?UTF-8?q?=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 直接展示字符串错误，同时保留完整状态 JSON
- 扩展既有 Job 行为回归，验证长 URL、字面转义与结构化错误
- 同步数据源返回链接的可访问名称和导航断言
---
 apps/client-web/src/views/jobs/job/job.vue | 12 +++++-
 tests/e2e/peer-database.spec.ts            | 45 +++++++++++++++++++++-
 2 files changed, 54 insertions(+), 3 deletions(-)

diff --git a/apps/client-web/src/views/jobs/job/job.vue b/apps/client-web/src/views/jobs/job/job.vue
index 6732e3a6..20ca40e2 100644
--- a/apps/client-web/src/views/jobs/job/job.vue
+++ b/apps/client-web/src/views/jobs/job/job.vue
@@ -55,6 +55,10 @@ const isRunning = computed(() => job.value?.status === JobStatus.RUNNING)
 const formattedState = computed(() => {
   return JSON.stringify(job.value?.state || {}, null, 2)
 })
+const jobFailureDetails = computed(() => {
+  const error = job.value?.state.error
+  return typeof error === 'string' ? error : null
+})
 
 const statusColor = computed(() => {
   if (!job.value) return ''
@@ -187,8 +191,14 @@ watch(
           <span class="metadata__value">{{ formatDate(job.closed_at) }}</span>
         </InkField>
 
+        <InkField v-if="jobFailureDetails !== null" :label="t('common.errorDetails')">
+          <pre class="metadata__value" :aria-label="t('common.errorDetails')">{{
+            jobFailureDetails
+          }}</pre>
+        </InkField>
+
         <InkField :label="t('job.state')">
-          <pre class="metadata__value">{{ formattedState }}</pre>
+          <pre class="metadata__value" :aria-label="t('job.state')">{{ formattedState }}</pre>
         </InkField>
       </section>
 
diff --git a/tests/e2e/peer-database.spec.ts b/tests/e2e/peer-database.spec.ts
index d16e2700..49ac29f5 100644
--- a/tests/e2e/peer-database.spec.ts
+++ b/tests/e2e/peer-database.spec.ts
@@ -753,7 +753,7 @@ test('an empty browser saves its connection across refresh and reads Peers', asy
   }
 })
 
-test('Job distinguishes failed and missing reads and preserves logs after a polling failure', async ({
+test('Job preserves readable errors and logs and distinguishes failed and missing reads', async ({
   page,
 }) => {
   const authorization = `Bearer ${await token()}`
@@ -836,6 +836,46 @@ test('Job distinguishes failed and missing reads and preserves logs after a poll
     await logs.getByRole('button', { name: 'Retry', exact: true }).click()
     await expect(logs.getByText('Updating automatically')).toBeVisible()
     await expect(logs.getByText('Existing log survives failure')).toHaveCount(1)
+
+    const longUrl = `https://example.invalid/${'long-path-'.repeat(30)}`
+    const failureDetails = `Validation failed\n${longUrl}\nLiteral escape: \\n\nEnd of error`
+    const failedState = { error: failureDetails, attempt: 1 }
+    const failedJob = await fetch(`${postgrestUrl}jobs?id=eq.${jobId}`, {
+      method: 'PATCH',
+      headers,
+      body: JSON.stringify({
+        status: 'failed',
+        closed_at: new Date().toISOString(),
+        state: failedState,
+      }),
+    })
+    expect(failedJob.status).toBe(204)
+    await page.reload()
+    const errorDetails = page.getByLabel('Error details', { exact: true })
+    const state = page.getByLabel('State', { exact: true })
+    await expect(errorDetails).toHaveJSProperty('textContent', failureDetails)
+    await expect(state).toHaveJSProperty('textContent', JSON.stringify(failedState, null, 2))
+    await page.setViewportSize({ width: 375, height: 812 })
+    await expect(errorDetails).toBeVisible()
+    expect(await errorDetails.evaluate((element) => getComputedStyle(element).whiteSpace)).toBe(
+      'pre-wrap'
+    )
+    expect(
+      await page.evaluate(() => document.documentElement.scrollWidth <= window.innerWidth)
+    ).toBe(true)
+    await expect(errorDetails).toHaveJSProperty('textContent', failureDetails)
+
+    const structuredFailure = { error: { message: failureDetails } }
+    const updatedState = await fetch(`${postgrestUrl}jobs?id=eq.${jobId}`, {
+      method: 'PATCH',
+      headers,
+      body: JSON.stringify({ state: structuredFailure }),
+    })
+    expect(updatedState.status).toBe(204)
+    await page.reload()
+    await expect(errorDetails).toHaveCount(0)
+    await expect(state).toHaveJSProperty('textContent', JSON.stringify(structuredFailure, null, 2))
+
     await page.goto('/jobs/-1')
     await expect(page.getByText('Job not found', { exact: true })).toBeVisible()
     await expect(page.getByRole('status', { name: 'Loading...' })).toHaveCount(0)
@@ -889,7 +929,8 @@ test('Source titles follow saved names across navigation and refresh', async ({
       page.getByRole('region', { name: 'Edit Config', exact: true }).getByRole('status')
     ).toHaveText('Changes saved.')
     await expect(page).toHaveTitle(`${savedName} - Sources - InKCre`)
-    await page.getByRole('link', { name: 'Sources', exact: true }).click()
+    await page.getByRole('link', { name: 'Back to Sources', exact: true }).click()
+    await expect(page).toHaveURL(new RegExp(`/sources#source-${sourceId}$`))
     await expect(page).toHaveTitle('Sources - InKCre')
     await page.goBack()
     await expect(page).toHaveURL(new RegExp(`/sources/${sourceId}$`))