update

frontend/src/components/TopicSidebar.vue

@@ -3,6 +3,8 @@ import { ref, computed } from 'vue'
 
 const props = defineProps({
   topics: { type: Array, required: true },
+  projects: { type: Array, default: () => [] },
+  isProjectSelected: { type: Boolean, default: false },
   selectedTopic: { type: String, default: null },
   doneByFormat: { type: Object, default: () => ({}) },
   latestByFormat: { type: Object, default: () => ({}) },
@@ -11,7 +13,9 @@ const props = defineProps({
   pinned: { type: Boolean, default: true },
 })
 
-const emit = defineEmits(['select', 'create', 'formatClick', 'deleteTopic', 'cancelGuide', 'deleteGuide', 'preview', 'rework', 'showBausteine', 'addBaustein', 'togglePin', 'sidebarLeave', 'openHelp'])
+const emit = defineEmits(['select', 'create', 'formatClick', 'deleteTopic', 'deleteProject', 'cancelGuide', 'deleteGuide', 'preview', 'rework', 'showBausteine', 'addBaustein', 'togglePin', 'sidebarLeave', 'openHelp'])
+
+const reindex = ref(false)
 
 const quickBausteinTitle = ref('')
 
@@ -72,9 +76,10 @@ function toggleInput(format) {
 
 function handlePlay(format) {
   const text = activeInput.value === format ? inputText.value.trim() : ''
-  emit('formatClick', { format, instructions: text })
+  emit('formatClick', { format, instructions: text, reindex: props.isProjectSelected && reindex.value })
   activeInput.value = null
   inputText.value = ''
+  reindex.value = false
 }
 
 function handleRefresh(format) {
@@ -128,6 +133,11 @@ function confirmDeleteTopic(topic) {
   if (!confirm(`Thema "${topic}" und alle zugehörigen Guides löschen?`)) return
   emit('deleteTopic', topic)
 }
+
+function confirmDeleteProject(name) {
+  if (!confirm(`Projekt "${name}" entfernen?\n\nAchtung: Der Quellordner ./projects/${name} und der Cache werden gelöscht.`)) return
+  emit('deleteProject', name)
+}
 </script>
 
 <template>
@@ -154,6 +164,10 @@ function confirmDeleteTopic(topic) {
       <div class="progress-info" v-if="activeGenerations.length">
         <div v-for="(line, i) in activeGenerations" :key="i">{{ line }}</div>
       </div>
+      <label v-if="isProjectSelected" class="reindex-toggle">
+        <input type="checkbox" v-model="reindex" />
+        <span>Projekt neu einlesen</span>
+      </label>
       <div v-for="f in formats" :key="f.key">
         <div :class="['format-row', 'fmt-' + guideStatus(f.key)]">
           <button class="format-name" @click="handleFormatClick(f.key)">
@@ -223,6 +237,18 @@ function confirmDeleteTopic(topic) {
         <span>{{ t }}</span>
         <button class="delete-topic" @click.stop="confirmDeleteTopic(t)" title="Löschen">&times;</button>
       </li>
+      <template v-if="projects.length">
+        <li class="projects-divider">Projekte</li>
+        <li
+          v-for="p in projects"
+          :key="'project-' + p"
+          :class="{ active: p === selectedTopic, 'project-item': true }"
+          @click="emit('select', p)"
+        >
+          <span>{{ p }}</span>
+          <button class="delete-topic" @click.stop="confirmDeleteProject(p)" title="Projekt entfernen">&times;</button>
+        </li>
+      </template>
     </ul>
   </aside>
 </template>
@@ -348,6 +374,40 @@ function confirmDeleteTopic(topic) {
   display: block;
 }
 
+.projects-divider {
+  cursor: default;
+  font-size: 0.7rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #9ca3af;
+  font-weight: 700;
+  padding: 0.6rem 1rem 0.3rem;
+  margin-top: 0.4rem;
+  border-top: 1px solid #e2e5e9;
+}
+
+.projects-divider:hover {
+  background: none;
+}
+
+.topic-list li.project-item span::before {
+  content: '📁 ';
+}
+
+.reindex-toggle {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 0.4rem 0.75rem;
+  font-size: 0.8rem;
+  color: #4b5563;
+  cursor: pointer;
+}
+
+.reindex-toggle input {
+  cursor: pointer;
+}
+
 /* Format section */
 .format-section {
   flex-shrink: 0;