fix: risk and colors on covergae in myteam page

This commit is contained in:
Julien Froidefond
2025-08-27 14:57:10 +02:00
parent 85b0cb0a6b
commit 84979501fa
2 changed files with 29 additions and 30 deletions

View File

@@ -39,8 +39,8 @@ export function SkillMatrix({ members, skillGaps }: SkillMatrixProps) {
importanceOrder[b.importance] - importanceOrder[a.importance];
if (importanceDiff !== 0) return importanceDiff;
// Si même importance, trier par couverture (décroissant)
return (b.coverage || 0) - (a.coverage || 0);
// Si même importance, trier par couverture (ascendant)
return (a.coverage || 0) - (b.coverage || 0);
};
const skillsByCategory = validSkillGaps.reduce((acc, skill) => {
@@ -224,12 +224,11 @@ export function SkillMatrix({ members, skillGaps }: SkillMatrixProps) {
<div className="w-full bg-white/10 rounded-full h-2">
<div
className={`h-2 rounded-full ${
isCoverageBelowObjective(
skill.coverage || 0,
skill.importance
)
? "bg-red-500/50"
: colors.bg.replace("/20", "/50")
(skill.coverage || 0) >= 75
? "bg-green-500/50"
: (skill.coverage || 0) >= 50
? "bg-yellow-500/50"
: "bg-red-500/50"
}`}
style={{
width: `${Math.max(
@@ -241,12 +240,11 @@ export function SkillMatrix({ members, skillGaps }: SkillMatrixProps) {
</div>
<span
className={`text-sm whitespace-nowrap ${
isCoverageBelowObjective(
skill.coverage || 0,
skill.importance
)
? "text-red-400"
: colors.text
(skill.coverage || 0) >= 75
? "text-green-400"
: (skill.coverage || 0) >= 50
? "text-yellow-400"
: "text-red-400"
}`}
>
{Math.round(skill.coverage || 0)}%
@@ -354,12 +352,11 @@ export function SkillMatrix({ members, skillGaps }: SkillMatrixProps) {
<div className="w-full bg-white/10 rounded-full h-2">
<div
className={`h-2 rounded-full ${
isCoverageBelowObjective(
skill.coverage || 0,
skill.importance
)
? "bg-red-500/50"
: colors.bg.replace("/20", "/50")
(skill.coverage || 0) >= 75
? "bg-green-500/50"
: (skill.coverage || 0) >= 50
? "bg-yellow-500/50"
: "bg-red-500/50"
}`}
style={{
width: `${Math.max(
@@ -371,12 +368,11 @@ export function SkillMatrix({ members, skillGaps }: SkillMatrixProps) {
</div>
<span
className={`text-sm whitespace-nowrap ${
isCoverageBelowObjective(
skill.coverage || 0,
skill.importance
)
? "text-red-400"
: colors.text
(skill.coverage || 0) >= 75
? "text-green-400"
: (skill.coverage || 0) >= 50
? "text-yellow-400"
: "text-red-400"
}`}
>
{Math.round(skill.coverage || 0)}%