${escapeHtmlText(p)}
`).join('') } +function cloneExerciseSkillRows(rows) { + return Array.isArray(rows) ? rows.map((s) => ({ ...s })) : [] +} + +function buildNormalizedAiSkillRowFromApi(sug) { + const sid = Number(sug.skill_id) + if (!Number.isFinite(sid)) return null + return { + skill_id: sid, + intensity: normalizeExerciseSkillIntensity(sug.intensity), + required_level: normalizeSkillLevelSlug(sug.required_level) || 'grundlagen', + target_level: + normalizeSkillLevelSlug(sug.target_level) || + normalizeSkillLevelSlug(sug.required_level) || + 'grundlagen', + is_primary: !!sug.is_primary, + ai_suggested: true, + } +} + +function buildExerciseAiSuggestionPreview({ mode, snapshotSummaryHtml, snapshotSkills, apiRes }) { + const summaryRequested = mode !== 'skills' + const skillsRequested = mode !== 'summary' + + let summaryAfterHtml = null + let summaryAfterPlain = '' + if (summaryRequested && apiRes.summary?.text) { + summaryAfterPlain = String(apiRes.summary.text).trim() + if (summaryAfterPlain) { + summaryAfterHtml = aiPlainSummaryToMinimalHtml(apiRes.summary.text) + } + } + + const skillChoices = [] + if (skillsRequested && Array.isArray(apiRes.skills)) { + for (const sug of apiRes.skills) { + const after = buildNormalizedAiSkillRowFromApi(sug) + if (!after) continue + const ix = snapshotSkills.findIndex((s) => Number(s.skill_id) === after.skill_id) + const before = ix >= 0 ? { ...snapshotSkills[ix] } : null + skillChoices.push({ + key: String(after.skill_id), + skill_id: after.skill_id, + kind: before ? 'update' : 'add', + before, + after, + include: true, + }) + } + } + + const hasSummaryProposal = !!(summaryRequested && summaryAfterHtml) + const hasSkillChoices = skillChoices.length > 0 + + return { + mode, + applySummary: hasSummaryProposal, + summaryBeforePlain: stripHtmlToText(snapshotSummaryHtml || '').trim(), + summaryAfterPlain, + summaryAfterHtml, + skillChoices, + hasSummaryProposal, + hasSkillChoices, + summaryRequested, + skillsRequested, + } +} + +function describeExerciseSkillRowForPreview(row, skillsCatalog) { + if (!row) return '' + const sk = skillsCatalog.find((x) => Number(x.id) === Number(row.skill_id)) + const name = sk?.name || `Fähigkeit #${row.skill_id}` + const int = formatExerciseSkillIntensityLabel(row.intensity) + const from = formatSkillLevelSlug(row.required_level) || '—' + const to = formatSkillLevelSlug(row.target_level) || '—' + const prim = row.is_primary ? ' · Primär' : '' + return `${name}: Intensität ${int}, Niveau ${from} → ${to}${prim}` +} + function emptyComboSlotRow() { return { title: '', @@ -524,6 +604,7 @@ function ExerciseFormPageRoot() { const [variantSavingId, setVariantSavingId] = useState(null) const [variantBusy, setVariantBusy] = useState(false) const [aiSuggestBusy, setAiSuggestBusy] = useState(false) + const [aiSuggestionPreview, setAiSuggestionPreview] = useState(null) const [variantEditSelection, setVariantEditSelection] = useState(null) const [activeFormTab, setActiveFormTab] = useState('stammdaten') const variantsSavedSnapshotRef = useRef({}) @@ -896,6 +977,9 @@ function ExerciseFormPageRoot() { .filter(Boolean) .join(', ') + const snapshotSummaryHtml = formData.summary || '' + const snapshotSkills = cloneExerciseSkillRows(formData.skills) + setAiSuggestBusy(true) try { const res = await api.suggestExerciseAi({ @@ -907,45 +991,20 @@ function ExerciseFormPageRoot() { include_skills: skillsOn, }) - let applied = false + const preview = buildExerciseAiSuggestionPreview({ + mode, + snapshotSummaryHtml, + snapshotSkills, + apiRes: res, + }) - if (summaryOn && res.summary?.text) { - updateFormField('summary', aiPlainSummaryToMinimalHtml(res.summary.text)) - applied = true - } - - if (skillsOn && Array.isArray(res.skills) && res.skills.length) { - setFormDirty(true) - setFormData((prev) => { - const next = [...(prev.skills || [])] - for (const sug of res.skills) { - const sid = Number(sug.skill_id) - if (!Number.isFinite(sid)) continue - const row = { - skill_id: sid, - intensity: normalizeExerciseSkillIntensity(sug.intensity), - required_level: normalizeSkillLevelSlug(sug.required_level) || 'grundlagen', - target_level: - normalizeSkillLevelSlug(sug.target_level) || - normalizeSkillLevelSlug(sug.required_level) || - 'grundlagen', - is_primary: !!sug.is_primary, - ai_suggested: true, - } - const ix = next.findIndex((s) => Number(s.skill_id) === sid) - if (ix >= 0) next[ix] = { ...next[ix], ...row } - else next.push(row) - } - return { ...prev, skills: next } - }) - applied = true - } - - if (!applied) { + const hasSomething = preview.hasSummaryProposal || preview.hasSkillChoices + if (!hasSomething) { toast.info('Die KI lieferte keinen verwertbaren Vorschlag für die gewählten Bereiche.') - } else { - toast.success('KI-Vorschlag ins Formular übernommen — bitte prüfen und speichern.') + return } + + setAiSuggestionPreview(preview) } catch (err) { toast.error(err?.message || String(err)) } finally { @@ -953,6 +1012,52 @@ function ExerciseFormPageRoot() { } } + const applyExerciseAiSuggestionPreview = () => { + const p = aiSuggestionPreview + if (!p) return + const takeSummary = !!(p.applySummary && p.summaryAfterHtml) + const skillsToMerge = p.skillChoices.filter((c) => c.include).map((c) => c.after) + + if (!takeSummary && skillsToMerge.length === 0) { + toast.error('Bitte mindestens eine Kurzfassung oder eine Fähigkeit zur Übernahme auswählen.') + return + } + + if (takeSummary) { + updateFormField('summary', p.summaryAfterHtml) + } + if (skillsToMerge.length > 0) { + setFormDirty(true) + setFormData((prev) => { + const next = [...(prev.skills || [])] + for (const row of skillsToMerge) { + const sid = Number(row.skill_id) + const ix = next.findIndex((s) => Number(s.skill_id) === sid) + if (ix >= 0) next[ix] = { ...next[ix], ...row } + else next.push(row) + } + return { ...prev, skills: next } + }) + } + + toast.success('Ausgewählte KI-Vorschläge übernommen — bitte prüfen und speichern.') + setAiSuggestionPreview(null) + } + + const discardExerciseAiSuggestionPreview = () => setAiSuggestionPreview(null) + + useEffect(() => { + if (!aiSuggestionPreview) return undefined + const onKey = (e) => { + if (e.key === 'Escape') { + e.preventDefault() + setAiSuggestionPreview(null) + } + } + window.addEventListener('keydown', onKey) + return () => window.removeEventListener('keydown', onKey) + }, [aiSuggestionPreview]) + const refreshVariants = useCallback(async () => { if (!exerciseId) return const ex = await api.getExercise(exerciseId) @@ -1423,7 +1528,7 @@ function ExerciseFormPageRoot() { type="button" className="btn btn-secondary" style={{ fontSize: '12px' }} - disabled={aiSuggestBusy} + disabled={aiSuggestBusy || !!aiSuggestionPreview} onClick={() => runExerciseAiSuggestion('summary')} > KI: Kurzfassung @@ -2098,7 +2203,7 @@ function ExerciseFormPageRoot() { type="button" className="btn btn-secondary" style={{ fontSize: '12px' }} - disabled={aiSuggestBusy} + disabled={aiSuggestBusy || !!aiSuggestionPreview} onClick={() => runExerciseAiSuggestion('skills')} > KI: Fähigkeiten @@ -2107,7 +2212,7 @@ function ExerciseFormPageRoot() { type="button" className="btn btn-secondary" style={{ fontSize: '12px' }} - disabled={aiSuggestBusy} + disabled={aiSuggestBusy || !!aiSuggestionPreview} onClick={() => runExerciseAiSuggestion('both')} > KI: Kurzfassung und Fähigkeiten @@ -2117,7 +2222,7 @@ function ExerciseFormPageRoot() { - · Vorschläge werden ins Formular übernommen und nicht automatisch gespeichert. + · Es öffnet ein Dialogfeld mit Vorschau; Übernahme wählweise pro Teil. Speichern nur über die Aktionsleiste. @@ -2615,6 +2720,258 @@ function ExerciseFormPageRoot() { )} + {aiSuggestionPreview && + (() => { + const p = aiSuggestionPreview + const summaryBoxSx = { + padding: '10px 12px', + borderRadius: '8px', + border: '1px solid var(--border)', + background: 'var(--surface2)', + fontSize: '13px', + lineHeight: 1.45, + whiteSpace: 'pre-wrap', + wordBreak: 'break-word', + minHeight: '72px', + } + const canApplySomething = + (p.applySummary && p.summaryAfterHtml) || p.skillChoices.some((c) => c.include) + return ( ++ Vergleichen und nur die gewünschten Teile übernehmen. Es werden keine Daten automatisch gespeichert. +
+ + {p.hasSummaryProposal ? ( ++ Keine passenden Fähigkeiten — der Katalog-Vorschlag war leer oder enthielt nur ungültige IDs. +
+ ) : ( +suggestExerciseAi / regenerateExerciseAi). Übernahme nur im Formular; Speichern
+ (suggestExerciseAi / regenerateExerciseAi). Übernahme im Dialog ins Formular; Speichern
wie gewohnt.