consistent and distinct colors for status

This commit is contained in:
Arunavo Ray
2025-07-18 08:37:00 +05:30
parent 7bd862606b
commit d388f2e691
2 changed files with 9 additions and 19 deletions

View File

@@ -9,7 +9,7 @@ import {
type RepositoryApiResponse,
type RepoStatus,
} from "@/types/Repository";
import { apiRequest, showErrorToast } from "@/lib/utils";
import { apiRequest, showErrorToast, getStatusColor } from "@/lib/utils";
import {
Select,
SelectContent,
@@ -707,12 +707,7 @@ export default function Repository() {
<SelectItem key={status} value={status}>
<span className="flex items-center gap-2">
{status !== "all" && (
<span className={`h-2 w-2 rounded-full ${
status === "synced" ? "bg-green-500" :
status === "failed" ? "bg-red-500" :
status === "syncing" ? "bg-blue-500" :
"bg-yellow-500"
}`} />
<span className={`h-2 w-2 rounded-full ${getStatusColor(status)}`} />
)}
{status === "all"
? "All statuses"
@@ -814,12 +809,7 @@ export default function Repository() {
<SelectItem key={status} value={status}>
<span className="flex items-center gap-2">
{status !== "all" && (
<span className={`h-2 w-2 rounded-full ${
status === "synced" ? "bg-green-500" :
status === "failed" ? "bg-red-500" :
status === "syncing" ? "bg-blue-500" :
"bg-yellow-500"
}`} />
<span className={`h-2 w-2 rounded-full ${getStatusColor(status)}`} />
)}
{status === "all"
? "All statuses"

View File

@@ -197,17 +197,17 @@ export async function apiRequest<T>(
export const getStatusColor = (status: string): string => {
switch (status) {
case "imported":
return "bg-blue-500"; // Info/primary-like
return "bg-yellow-500"; // Ready to mirror
case "mirroring":
return "bg-yellow-400"; // In progress
return "bg-amber-500"; // In progress
case "mirrored":
return "bg-emerald-500"; // Success
return "bg-green-500"; // Successfully mirrored
case "failed":
return "bg-rose-500"; // Error
return "bg-red-500"; // Error
case "syncing":
return "bg-indigo-500"; // Sync in progress
return "bg-blue-500"; // Sync in progress
case "synced":
return "bg-teal-500"; // Sync complete
return "bg-emerald-500"; // Successfully synced
case "skipped":
return "bg-gray-500"; // Skipped
case "deleting":