28 lines
935 B
React
28 lines
935 B
React
|
|
import { Link } from 'react-router-dom'
|
||
|
|
|
||
|
|
export function PlanningDebtBanner({ planningDebt, hrefWithScope }) {
|
||
|
|
if (!planningDebt?.length || !hrefWithScope) {
|
||
|
|
return null
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="planning-debt-banner" role="status">
|
||
|
|
<p className="planning-debt-banner__title">Planung ausstehend</p>
|
||
|
|
<ul className="planning-debt-banner__list">
|
||
|
|
{planningDebt.map((item) => (
|
||
|
|
<li key={item.roadmap_item_id}>
|
||
|
|
<strong>{item.title || 'Zielzustand'}</strong>
|
||
|
|
<span className="muted"> — {item.message || 'Durchführungsplan fehlt'}</span>
|
||
|
|
</li>
|
||
|
|
))}
|
||
|
|
</ul>
|
||
|
|
<p className="muted planning-debt-banner__hint">
|
||
|
|
Lege Arbeitspakete unter dem aktiven Gate an —{' '}
|
||
|
|
<Link to={hrefWithScope('/plan/gates')}>Zielzustände</Link>
|
||
|
|
{' · '}
|
||
|
|
<Link to={hrefWithScope('/plan/work')}>Arbeit</Link>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|