feat: invert quota usage markers when remaining mode enabled (#385)

2026-02-11 11:24:02 +02:00
parent 0bab4dfa26
commit 39e625d8ec
3 changed files with 19 additions and 7 deletions
@@ -42,8 +42,10 @@ export const UsageCard: React.FC<UsageCardProps> = ({
      return null;
    }
    // Show marker based on elapsed time ratio
-    return calculateExpectedUsagePercent(paceInfo.elapsedRatio);
-  }, [paceInfo]);
+    const expectedUsed = calculateExpectedUsagePercent(paceInfo.elapsedRatio);
+    // If displaying remaining, invert the marker position
+    return displayMode === 'remaining' ? 100 - expectedUsed : expectedUsed;
+  }, [paceInfo, displayMode]);

  return (
    <div className="rounded-xl border border-[var(--interactive-border)] bg-[var(--surface-elevated)]/60 p-4 shadow-sm">