Remediated test #1 results

This commit is contained in:
2026-09-20 13:51:01 +02:00
parent 5829bffaa0
commit d428f6e17c
16 changed files with 8367 additions and 758 deletions
@@ -1,4 +1,5 @@
import React, { useState } from 'react';
import { Link } from 'react-router-dom';
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import { useForm } from 'react-hook-form';
import { zodResolver } from '@hookform/resolvers/zod';
@@ -520,15 +521,25 @@ export const ProjectsPage: React.FC = () => {
{/* Actions & Status Change Selector */}
<div className="shrink-0 text-right space-y-2">
<button
type="button"
onClick={() => openEditProject(selectedProject)}
className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-semibold text-slate-200 bg-slate-800 hover:bg-slate-700 border border-slate-700/80 rounded-xl transition cursor-pointer"
title="Edit project details"
>
<Edit2 className="w-3.5 h-3.5 text-blue-400" />
Edit Project
</button>
<div className="flex items-center justify-end gap-2">
<Link
to={`/monitoring?tab=evidence&projectId=${selectedProject.id}`}
className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-semibold text-blue-300 hover:text-white bg-blue-500/15 hover:bg-blue-500/25 border border-blue-500/30 rounded-xl transition cursor-pointer"
title="Review submitted evidence for this project"
>
<FileCheck className="w-3.5 h-3.5 text-blue-400" />
Review Evidence
</Link>
<button
type="button"
onClick={() => openEditProject(selectedProject)}
className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-semibold text-slate-200 bg-slate-800 hover:bg-slate-700 border border-slate-700/80 rounded-xl transition cursor-pointer"
title="Edit project details"
>
<Edit2 className="w-3.5 h-3.5 text-blue-400" />
Edit Project
</button>
</div>
<div>
<div className="flex items-center gap-1 mb-1">
<label className="text-[10px] uppercase font-bold text-slate-400 block">Approval Status</label>
@@ -684,6 +695,14 @@ export const ProjectsPage: React.FC = () => {
</div>
<div className="flex items-center gap-2 shrink-0">
<span className="font-mono text-xs font-bold text-blue-400">{formatZAR(a.amount)}</span>
<Link
to={`/monitoring?tab=evidence&projectId=${selectedProject.id}&activityId=${a.id}`}
className="inline-flex items-center gap-1 text-[10px] font-semibold text-cyan-300 hover:text-white bg-cyan-500/10 hover:bg-cyan-500/20 border border-cyan-500/25 px-2 py-1 rounded-lg transition"
title="View & review evidence for this activity"
>
<FileCheck className="w-3 h-3 text-cyan-400" />
Evidence
</Link>
<button
onClick={() => openEditActivity(a)}
className="p-1.5 rounded-lg text-slate-400 hover:text-blue-400 hover:bg-slate-800 transition cursor-pointer"
@@ -736,16 +755,29 @@ export const ProjectsPage: React.FC = () => {
const statusBadge = getApprovalStatusBadge(m.status);
const priBadge = getPriorityBadge(m.priority);
return (
<div key={m.id} className="p-3.5 rounded-xl border border-slate-800/80 bg-[#0d121f]/90 space-y-2">
<div className="flex items-start justify-between gap-2">
<div key={m.id} className="p-3.5 rounded-xl border border-slate-800/80 bg-[#0d121f]/90 space-y-2.5">
<div className="flex items-start justify-between gap-3">
<div>
<span className="font-semibold text-xs text-white block">{m.name}</span>
<span className="text-[10px] text-slate-500 font-mono">Milestone #{m.id}</span>
</div>
<div className="flex items-center gap-2 shrink-0">
<span className={`inline-flex items-center px-2 py-0.5 rounded-full text-[10px] font-semibold border ${statusBadge.className}`}>
{statusBadge.label}
</span>
<div className="flex items-center gap-1.5">
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-[10px] font-semibold border ${statusBadge.className}`}>
{statusBadge.label}
</span>
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-[10px] font-semibold border ${priBadge.className}`}>
{priBadge.label}
</span>
</div>
<Link
to={`/monitoring?tab=evidence&projectId=${selectedProject.id}&milestoneId=${m.id}`}
className="inline-flex items-center gap-1 text-[10px] font-semibold text-blue-300 hover:text-white bg-blue-500/10 hover:bg-blue-500/20 border border-blue-500/25 px-2 py-1 rounded-lg transition"
title="View & review evidence for this milestone"
>
<FileCheck className="w-3 h-3 text-blue-400" />
Evidence
</Link>
<button
onClick={() => openEditMilestone(m)}
className="p-1.5 rounded-lg text-slate-400 hover:text-blue-400 hover:bg-slate-800 transition cursor-pointer"
@@ -755,14 +787,11 @@ export const ProjectsPage: React.FC = () => {
</button>
</div>
</div>
<div className="flex items-center justify-between text-[11px] text-slate-400">
<span className="flex items-center gap-1">
<Clock className="w-3 h-3 text-slate-500" />
<div className="flex items-center text-[11px] text-slate-400 pt-1.5 border-t border-slate-800/60">
<span className="flex items-center gap-1.5 text-slate-400">
<Clock className="w-3.5 h-3.5 text-slate-500" />
Due: {formatDate(m.dueAt)}
</span>
<span className={`text-[10px] px-1.5 py-0.5 rounded-md font-medium border ${priBadge.className}`}>
{priBadge.label}
</span>
</div>
</div>
);