ros/automaker
1
0
Fork 0
mirror of https://github.com/AutoMaker-Org/automaker.git synced 2026-01-31 06:42:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Simplify usage data extraction and update refresh interval handling in Claude components

Browse Source
This commit is contained in:
Mohamad Yahia
2025-12-21 11:02:54 +04:00
parent 5be85a45b1
commit 7dff6ea0ed
3 changed files with 30 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
apps/ui/src/components/views/settings-view/api-keys/claude-usage-section.tsx
View File

@@ -1,18 +1,6 @@
import { Clock } from "lucide-react";
import { cn } from "@/lib/utils";
import { useState, useEffect } from "react";
import { Slider } from "@/components/ui/slider";
import { useAppStore } from "@/store/app-store";
export function ClaudeUsageSection() {
const { claudeRefreshInterval, setClaudeRefreshInterval } = useAppStore();
const [localInterval, setLocalInterval] = useState(claudeRefreshInterval);
// Sync local state with store when store changes (e.g. initial load)
useEffect(() => {
setLocalInterval(claudeRefreshInterval);
}, [claudeRefreshInterval]);
return (
<div
className={cn(
@@ -40,35 +28,9 @@ export function ClaudeUsageSection() {
<ol className="list-decimal list-inside space-y-1 ml-1">
<li>Install Claude Code CLI if not already installed</li>
<li>Run <code className="font-mono bg-muted px-1 rounded">claude login</code> to authenticate</li>
<li>Usage data will be fetched automatically</li>
<li>Usage data will be fetched automatically every ~minute</li>
</ol>
</div>
{/* Refresh Interval Section */}
<div className="space-y-4">
<div className="space-y-1">
<h3 className="text-sm font-medium text-foreground flex items-center gap-2">
<Clock className="w-4 h-4 text-muted-foreground" />
Refresh Interval
</h3>
<p className="text-xs text-muted-foreground">
How often to check for usage updates.
</p>
</div>
<div className="flex items-center gap-4">
<Slider
value={[Math.max(30, Math.min(120, localInterval || 30))]}
onValueChange={(vals) => setLocalInterval(vals[0])}
onValueCommit={(vals) => setClaudeRefreshInterval(vals[0])}
min={30}
max={120}
step={5}
className="flex-1"
/>
<span className="w-12 text-sm font-mono text-right">{Math.max(30, Math.min(120, localInterval || 30))}s</span>
</div>
</div>
</div>
</div>
);