krao/fourge-portal
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Group amendments inside their parent version box in timeline

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Krao Hasanee
2026-03-27 00:18:28 -04:00
parent f4a1b7c25e
commit 92ab0601ae
1 changed files with 32 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/client/RequestDetail.jsx
+32 -17
View File
@@ -305,35 +305,50 @@ export default function RequestDetail() {
<div className="card-title">Version History</div>
<div className="version-timeline">
{submissions.map(sub => {
const delivery = sub.delivery;
{Object.values(
submissions.reduce((groups, sub) => {
const key = sub.version_number;
if (!groups[key]) groups[key] = [];
groups[key].push(sub);
return groups;
}, {})
).map(group => {
const primary = group.find(s => s.type !== 'amendment') || group[0];
const amendments = group.filter(s => s.type === 'amendment');
const delivery = primary.delivery;
return (
<div key={sub.id} className="version-item">
{sub.type === 'amendment' && (
<div style={{ fontSize: 11, fontWeight: 700, textTransform: 'uppercase', color: 'var(--accent)', marginBottom: 8, letterSpacing: 0.5 }}>
Amended Request
</div>
)}
<div key={primary.id} className="version-item">
<div className="version-header">
<div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
{sub.type !== 'amendment' && (
<div className="version-number">{vLabel(sub.version_number - 1)}</div>
)}
<StatusBadge status={sub.type} />
<div className="version-number">{vLabel(primary.version_number - 1)}</div>
<StatusBadge status={primary.type} />
</div>
<div style={{ fontSize: 12, color: 'var(--text-secondary)' }}>
{sub.submitted_by_name && <span>{sub.submitted_by_name} · </span>}
{new Date(sub.submitted_at).toLocaleDateString()}
{primary.submitted_by_name && <span>{primary.submitted_by_name} · </span>}
{new Date(primary.submitted_at).toLocaleDateString()}
</div>
</div>
<div className="detail-grid">
<div className="detail-item"><label>Service</label><p>{sub.service_type}</p></div>
<div className="detail-item"><label>Deadline</label><p>{sub.deadline || '—'}</p></div>
<div className="detail-item"><label>Service</label><p>{primary.service_type}</p></div>
<div className="detail-item"><label>Deadline</label><p>{primary.deadline || '—'}</p></div>
</div>
<div className="detail-item">
<label>Description</label>
<p style={{ marginTop: 4, lineHeight: 1.6, color: 'var(--text-secondary)', whiteSpace: 'pre-wrap' }}>{sub.description}</p>
<p style={{ marginTop: 4, lineHeight: 1.6, color: 'var(--text-secondary)', whiteSpace: 'pre-wrap' }}>{primary.description}</p>
</div>
{amendments.map(amendment => (
<div key={amendment.id} style={{ marginTop: 12, padding: '12px 14px', background: 'var(--bg)', borderRadius: 8, border: '1px solid var(--border)' }}>
<div style={{ fontSize: 11, fontWeight: 700, textTransform: 'uppercase', color: 'var(--accent)', marginBottom: 8, letterSpacing: 0.5 }}>
Amended Request
</div>
<div style={{ fontSize: 12, color: 'var(--text-muted)', marginBottom: 6 }}>
{amendment.submitted_by_name} · {new Date(amendment.submitted_at).toLocaleDateString()}
</div>
<p style={{ fontSize: 13, lineHeight: 1.6, color: 'var(--text-secondary)', whiteSpace: 'pre-wrap', margin: 0 }}>{amendment.description}</p>
</div>
))}
{delivery && delivery.files && delivery.files.length > 0 && (
<div style={{ marginTop: 12, padding: '10px 14px', background: '#f0fdf4', borderRadius: 8, border: '1px solid #bbf7d0' }}>
<div style={{ fontSize: 11, fontWeight: 600, textTransform: 'uppercase', color: '#16a34a', marginBottom: 8 }}>