diff options
| author | Dhravya Shah <[email protected]> | 2025-09-24 21:48:56 -0700 |
|---|---|---|
| committer | Dhravya Shah <[email protected]> | 2025-09-24 21:48:56 -0700 |
| commit | 3d2d3ae35c1e754bf651711203451367a64933ea (patch) | |
| tree | 34b6c5ab7453c1d638bf1b3262b3239b971ef300 /apps | |
| parent | fix: one more type error (diff) | |
| download | supermemory-3d2d3ae35c1e754bf651711203451367a64933ea.tar.xz supermemory-3d2d3ae35c1e754bf651711203451367a64933ea.zip | |
bump version
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/web/components/views/add-memory/memory-usage-ring.tsx | 23 |
1 files changed, 12 insertions, 11 deletions
diff --git a/apps/web/components/views/add-memory/memory-usage-ring.tsx b/apps/web/components/views/add-memory/memory-usage-ring.tsx index f6fb9836..40c909df 100644 --- a/apps/web/components/views/add-memory/memory-usage-ring.tsx +++ b/apps/web/components/views/add-memory/memory-usage-ring.tsx @@ -1,7 +1,7 @@ interface MemoryUsageRingProps { - memoriesUsed: number; - memoriesLimit: number; - className?: string; + memoriesUsed: number + memoriesLimit: number + className?: string } export function MemoryUsageRing({ @@ -9,10 +9,10 @@ export function MemoryUsageRing({ memoriesLimit, className = "", }: MemoryUsageRingProps) { - const usagePercentage = memoriesUsed / memoriesLimit; + const usagePercentage = memoriesUsed / memoriesLimit const strokeColor = - memoriesUsed >= memoriesLimit * 0.8 ? "rgb(251 191 36)" : "rgb(34 197 94)"; - const circumference = 2 * Math.PI * 10; + memoriesUsed >= memoriesLimit * 0.8 ? "rgb(251 191 36)" : "rgb(34 197 94)" + const circumference = 2 * Math.PI * 10 return ( <div @@ -20,27 +20,28 @@ export function MemoryUsageRing({ title={`${memoriesUsed} of ${memoriesLimit} memories used`} > <svg className="w-6 h-6 transform -rotate-90" viewBox="0 0 24 24"> + <title>{`${memoriesUsed} of ${memoriesLimit} memories used`}</title> {/* Background circle */} <circle cx="12" cy="12" + fill="none" r="10" stroke="rgb(255 255 255 / 0.1)" strokeWidth="2" - fill="none" /> {/* Progress circle */} <circle + className="transition-all duration-300" cx="12" cy="12" + fill="none" r="10" stroke={strokeColor} - strokeWidth="2" - fill="none" strokeDasharray={`${circumference}`} strokeDashoffset={`${circumference * (1 - usagePercentage)}`} - className="transition-all duration-300" strokeLinecap="round" + strokeWidth="2" /> </svg> @@ -49,5 +50,5 @@ export function MemoryUsageRing({ {memoriesUsed} / {memoriesLimit} </div> </div> - ); + ) } |