feat: goals navigation + UX improvements
All checks were successful
Deploy Development / deploy (push) Successful in 44s
Build Test / lint-backend (push) Successful in 0s
Build Test / build-frontend (push) Successful in 14s

Analysis Page:
- Add 'Ziele' button next to page title
- Direct navigation to /goals from analysis page
- Thematic link: goals influence AI analysis weighting

Goals Page:
- Fix text-align for text inputs (name, date, description)
- Text fields now left-aligned (numbers remain right-aligned)
- Better UX for non-numeric inputs

Navigation strategy: Goals accessible from Analysis page where
goal_mode directly impacts score calculation and interpretation.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Lars 2026-03-26 16:50:22 +01:00
parent 75f0a5dd6e
commit 5be52bcfeb
2 changed files with 16 additions and 5 deletions

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react'
import { Brain, Trash2, ChevronDown, ChevronUp } from 'lucide-react'
import { Brain, Trash2, ChevronDown, ChevronUp, Target } from 'lucide-react'
import { useNavigate } from 'react-router-dom'
import { api } from '../utils/api'
import { useAuth } from '../context/AuthContext'
import Markdown from '../utils/Markdown'
@ -277,6 +278,7 @@ function InsightCard({ ins, onDelete, defaultOpen=false, prompts=[] }) {
export default function Analysis() {
const { canUseAI } = useAuth()
const navigate = useNavigate()
const [prompts, setPrompts] = useState([])
const [allInsights, setAllInsights] = useState([])
const [loading, setLoading] = useState(null)
@ -386,7 +388,16 @@ export default function Analysis() {
return (
<div>
<h1 className="page-title">KI-Analyse</h1>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
<h1 className="page-title" style={{ margin: 0 }}>KI-Analyse</h1>
<button
className="btn btn-secondary"
onClick={() => navigate('/goals')}
style={{ fontSize: 13, padding: '6px 12px' }}
>
<Target size={14} /> Ziele
</button>
</div>
<div className="tabs">
<button className={'tab'+(tab==='run'?' active':'')} onClick={()=>setTab('run')}>Analysen starten</button>

View File

@ -509,7 +509,7 @@ export default function GoalsPage() {
<input
type="text"
className="form-input"
style={{ width: '100%' }}
style={{ width: '100%', textAlign: 'left' }}
value={formData.name}
onChange={e => setFormData(f => ({ ...f, name: e.target.value }))}
placeholder="z.B. Sommerfigur 2026"
@ -572,7 +572,7 @@ export default function GoalsPage() {
<input
type="date"
className="form-input"
style={{ width: '100%' }}
style={{ width: '100%', textAlign: 'left' }}
value={formData.target_date}
onChange={e => setFormData(f => ({ ...f, target_date: e.target.value }))}
/>
@ -591,7 +591,7 @@ export default function GoalsPage() {
</label>
<textarea
className="form-input"
style={{ width: '100%', minHeight: 80 }}
style={{ width: '100%', minHeight: 80, textAlign: 'left' }}
value={formData.description}
onChange={e => setFormData(f => ({ ...f, description: e.target.value }))}
rows={3}