Added auditor logic

This commit is contained in:
gulimabr
2025-12-01 11:36:43 -03:00
parent 07005788ed
commit f7bb62ea99
15 changed files with 888 additions and 72 deletions

View File

@@ -7,6 +7,21 @@ import type { Tag } from '@/services/tagService'
import type { Priority } from '@/services/priorityService'
import type { Requirement, RequirementCreateRequest } from '@/services/requirementService'
// Get validation status color
const getValidationStatusStyle = (status: string): { bgColor: string; textColor: string } => {
switch (status) {
case 'Approved':
return { bgColor: 'bg-green-100', textColor: 'text-green-800' }
case 'Denied':
return { bgColor: 'bg-red-100', textColor: 'text-red-800' }
case 'Partial':
return { bgColor: 'bg-yellow-100', textColor: 'text-yellow-800' }
case 'Not Validated':
default:
return { bgColor: 'bg-gray-100', textColor: 'text-gray-600' }
}
}
// Helper to lighten a hex color for backgrounds
function lightenColor(hex: string, percent: number): string {
const num = parseInt(hex.replace('#', ''), 16)
@@ -23,7 +38,7 @@ function lightenColor(hex: string, percent: number): string {
}
export default function RequirementsPage() {
const { user, logout } = useAuth()
const { user, logout, isAuditor } = useAuth()
const { currentProject, isLoading: projectLoading } = useProject()
const [searchParams, setSearchParams] = useSearchParams()
const navigate = useNavigate()
@@ -335,8 +350,8 @@ export default function RequirementsPage() {
<path fillRule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clipRule="evenodd" />
</svg>
<span className="text-sm text-gray-700">
{user?.full_name || user?.preferred_username || 'Ricardo Belo'}{' '}
<span className="text-gray-500">(admin)</span>
{user?.full_name || user?.preferred_username || 'User'}{' '}
<span className="text-gray-500">({user?.role || 'user'})</span>
</span>
</div>
<button
@@ -354,15 +369,17 @@ export default function RequirementsPage() {
<div className="flex gap-8">
{/* Main Panel */}
<div className="flex-1">
{/* New Requirement Button */}
<div className="mb-6">
<button
onClick={openCreateModal}
className="px-4 py-2 border border-gray-400 rounded text-sm font-medium text-gray-700 hover:bg-gray-50"
>
New Requirement
</button>
</div>
{/* New Requirement Button - Hidden for auditors */}
{!isAuditor && (
<div className="mb-6">
<button
onClick={openCreateModal}
className="px-4 py-2 border border-gray-400 rounded text-sm font-medium text-gray-700 hover:bg-gray-50"
>
New Requirement
</button>
</div>
)}
{/* Search Bar */}
<div className="flex gap-2 mb-6">
@@ -432,6 +449,8 @@ export default function RequirementsPage() {
const tagLabel = req.tag.tag_code
const priorityName = req.priority?.priority_name ?? 'None'
const validationStatus = req.validation_status || 'Not Validated'
const validationStyle = getValidationStatusStyle(validationStatus)
const isStale = req.validation_version !== null && req.validation_version !== req.version
return (
<div
@@ -451,9 +470,21 @@ export default function RequirementsPage() {
{/* Validation status */}
<div className="flex-1 px-6 py-4 text-center">
<span className="text-sm text-gray-600">
Validation: {validationStatus}
</span>
<div className="flex items-center justify-center gap-2">
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${validationStyle.bgColor} ${validationStyle.textColor}`}>
{validationStatus}
</span>
{isStale && (
<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-orange-100 text-orange-800" title="Requirement was modified after validation">
Stale
</span>
)}
</div>
{req.validated_by && (
<p className="text-xs text-gray-500 mt-1">
by @{req.validated_by}
</p>
)}
</div>
{/* Priority and Version */}
@@ -470,12 +501,14 @@ export default function RequirementsPage() {
>
Details
</button>
<button
onClick={() => handleRemove(req.id)}
className="px-3 py-1 border border-gray-400 rounded text-sm text-gray-700 hover:bg-gray-50"
>
Remove
</button>
{!isAuditor && (
<button
onClick={() => handleRemove(req.id)}
className="px-3 py-1 border border-gray-400 rounded text-sm text-gray-700 hover:bg-gray-50"
>
Remove
</button>
)}
</div>
</div>
)