update

frontend/src/components/TopicSidebar.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed } from 'vue'
+import { ref, reactive, computed } from 'vue'
 import { useConfirm } from '../composables/useConfirm.js'
 import { fetchQuelle } from '../api.js'
 
@@ -144,6 +144,21 @@ function guideSteps(format) {
   return labels.map((label) => ({ label, state: 'pending' }))
 }
 
+// Re-Run ab Guide-Schritt (1-basierte Kugel je Format). null = voll/Resume.
+const gewaehlterStep = reactive({})
+// Kugeln klickbar, sobald der Guide (teil-)gebaut ist und gerade nicht generiert wird.
+function guideWaehlbar(format) {
+  const st = guideStatus(format)
+  return (st === 'done' || abgebrochen(format)) && st !== 'generating' && st !== 'queued'
+}
+function guideStepKlick(format, n) {
+  if (!guideWaehlbar(format)) return
+  gewaehlterStep[format] = gewaehlterStep[format] === n ? null : n
+}
+function gewaehltesStepLabel(format) {
+  return GUIDE_STEPS[(gewaehlterStep[format] || 0) - 1] || ''
+}
+
 function errorMsg(format) {
   const latest = props.latestByFormat[format]
   if (latest?.status !== 'error' || props.dismissedErrors.has(latest.id)) return ''
@@ -173,7 +188,10 @@ function playLock(format) {
 
 function handlePlay(format) {
   if (playLock(format)) return
-  emit('formatClick', { format, instructions: '' })
+  // Gewählte Kugel (1-basiert) → ab_step (0-basiert). Nur bei (teil-)gebautem Guide.
+  const abStep = guideWaehlbar(format) && gewaehlterStep[format] ? gewaehlterStep[format] - 1 : null
+  emit('formatClick', { format, instructions: '', abStep })
+  gewaehlterStep[format] = null
 }
 
 // Flash-Message-Verhalten: × blendet nur aus, nichts wird gelöscht
@@ -413,12 +431,13 @@ function saveQuelle() {
             >Pausiert</span>
             <span class="step-dots" v-if="guideSteps(f.key).length">
               <span
-                v-for="s in guideSteps(f.key)"
+                v-for="(s, i) in guideSteps(f.key)"
                 :key="s.label"
-                class="step-dot"
-                :class="s.state"
-                :title="s.state === 'active' ? (latestByFormat[f.key]?.progress || s.label) : s.label"
-              ></span>
+                class="step-pill"
+                :class="[s.state, { sel: gewaehlterStep[f.key] === i + 1, klickbar: guideWaehlbar(f.key) }]"
+                :title="(s.state === 'active' ? (latestByFormat[f.key]?.progress || s.label) : s.label) + (guideWaehlbar(f.key) ? ' — Klick: ab hier neu' : '')"
+                @click.stop="guideStepKlick(f.key, i + 1)"
+              >{{ i + 1 }}</span>
             </span>
           </button>
           <button class="panel-toggle" :class="{ open: isOpen('fmt-' + f.key) }" title="Aktionen" @click.stop="togglePanel('fmt-' + f.key)">▾</button>
@@ -433,7 +452,7 @@ function saveQuelle() {
               :title="playLock(f.key) || (abgebrochen(f.key) ? 'Fortsetzen' : 'Generieren')"
               :disabled="!!playLock(f.key)"
               @click="handlePlay(f.key)"
-            >{{ abgebrochen(f.key) ? 'Fortsetzen' : guideStatus(f.key) === 'done' ? 'Neu generieren' : 'Generieren' }}</button>
+            >{{ gewaehlterStep[f.key] ? `Ab «${gewaehltesStepLabel(f.key)}» neu` : abgebrochen(f.key) ? 'Fortsetzen' : guideStatus(f.key) === 'done' ? 'Neu generieren' : 'Generieren' }}</button>
             <button
               v-if="guideStatus(f.key) !== 'none' || abgebrochen(f.key)"
               class="panel-btn danger"