Convert float percent in text

Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-03-31 10:38:31 +02:00
parent a0367c55ba
commit b9e04d7244

View File

@@ -99,6 +99,23 @@ const deleteRiskMutation = graphql`
} }
`; `;
// Helper functions to convert float values to text
const floatToProbabilityText = (value: number): string => {
if (value <= 0.1) return "Very Low";
if (value <= 0.3) return "Low";
if (value <= 0.5) return "Medium";
if (value <= 0.7) return "High";
return "Very High";
};
const floatToImpactText = (value: number): string => {
if (value <= 0.1) return "Very Low";
if (value <= 0.3) return "Low";
if (value <= 0.5) return "Medium";
if (value <= 0.7) return "High";
return "Very High";
};
function LoadAboveButton({ function LoadAboveButton({
isLoading, isLoading,
hasMore, hasMore,
@@ -271,19 +288,16 @@ function RiskListViewContent({
<table className="w-full caption-bottom text-sm"> <table className="w-full caption-bottom text-sm">
<thead className="[&_tr]:border-b"> <thead className="[&_tr]:border-b">
<tr className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"> <tr className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted">
<th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground"> <th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground w-1/2">
Name Name
</th> </th>
<th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground"> <th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground w-1/4">
Description
</th>
<th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground">
Probability Probability
</th> </th>
<th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground"> <th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground w-1/4">
Impact Impact
</th> </th>
<th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground"> <th className="h-12 px-4 text-left align-middle font-medium text-muted-foreground w-[80px]">
Actions Actions
</th> </th>
</tr> </tr>
@@ -292,7 +306,7 @@ function RiskListViewContent({
{risks.length === 0 ? ( {risks.length === 0 ? (
<tr className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"> <tr className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted">
<td <td
colSpan={5} colSpan={4}
className="text-center p-4 align-middle text-muted-foreground" className="text-center p-4 align-middle text-muted-foreground"
> >
No risks found. Create a new risk to get started. No risks found. Create a new risk to get started.
@@ -304,17 +318,16 @@ function RiskListViewContent({
key={risk.id} key={risk.id}
className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted cursor-pointer" className="border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted cursor-pointer"
> >
<td className="p-4 align-middle font-medium"> <td className="p-4 align-middle font-medium w-1/2">
{risk.name} {risk.name}
</td> </td>
<td className="p-4 align-middle">{risk.description}</td> <td className="p-4 align-middle w-1/4 whitespace-nowrap">
<td className="p-4 align-middle"> {floatToProbabilityText(risk.probability)}
{(risk.probability * 100).toFixed(0)}%
</td> </td>
<td className="p-4 align-middle"> <td className="p-4 align-middle w-1/4 whitespace-nowrap">
{(risk.impact * 100).toFixed(0)}% {floatToImpactText(risk.impact)}
</td> </td>
<td className="p-4 align-middle"> <td className="p-4 align-middle w-[80px]">
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"