refactor(ui): normalize admin db sync controls

This commit is contained in:
Saravana Achu Mac 2026-05-09 01:52:15 -07:00
parent fd64fecbce
commit f3540c6b4b

View File

@ -17,7 +17,7 @@ import { fetchDynamicConfigItems, upsertDynamicConfigItems } from '../lib/dynami
import { getPlatformAccessToken } from '../lib/authSession'; import { getPlatformAccessToken } from '../lib/authSession';
import { createRequestId } from '../../../shared/request-id.js'; import { createRequestId } from '../../../shared/request-id.js';
import { tradingRuntime } from '../lib/runtime'; import { tradingRuntime } from '../lib/runtime';
import { Button } from '../components/ui/Primitives'; import { Button, Input } from '../components/ui/Primitives';
interface AdminTabProps { interface AdminTabProps {
botState: BotState; botState: BotState;
@ -846,20 +846,22 @@ export const AdminTab = ({ botState, socket }: AdminTabProps) => {
<p className="text-xs font-bold text-white">State Snapshots</p> <p className="text-xs font-bold text-white">State Snapshots</p>
<p className="text-[10px] text-zinc-500">Persistent sync of bot state to Supabase</p> <p className="text-[10px] text-zinc-500">Persistent sync of bot state to Supabase</p>
</div> </div>
<button <Button
type="button" type="button"
role="switch" role="switch"
aria-checked={dbSyncEnabled} aria-checked={dbSyncEnabled}
aria-label="Toggle state snapshots" aria-label="Toggle state snapshots"
onClick={() => setDbSyncEnabled(!dbSyncEnabled)} onClick={() => setDbSyncEnabled(!dbSyncEnabled)}
className={`relative inline-flex h-5 w-10 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none ${dbSyncEnabled ? 'bg-cyan-500' : 'bg-zinc-700' variant="ghost"
size="icon"
className={`relative h-6 w-11 rounded-full border-0 p-0 hover:bg-current ${dbSyncEnabled ? 'bg-cyan-500' : 'bg-zinc-700'
}`} }`}
> >
<span <span
className={`inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${dbSyncEnabled ? 'translate-x-5' : 'translate-x-0' className={`inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${dbSyncEnabled ? 'translate-x-5' : 'translate-x-0'
}`} }`}
/> />
</button> </Button>
</div> </div>
<div className="space-y-3"> <div className="space-y-3">
@ -869,13 +871,14 @@ export const AdminTab = ({ botState, socket }: AdminTabProps) => {
<p className="text-[10px] text-zinc-500">Minimum time between DB writes ({Math.round(dbSyncInterval / 60000)}m)</p> <p className="text-[10px] text-zinc-500">Minimum time between DB writes ({Math.round(dbSyncInterval / 60000)}m)</p>
</div> </div>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<input <Input
type="range" type="range"
min="60000" min="60000"
max="3600000" max="3600000"
step="60000" step="60000"
value={dbSyncInterval} value={dbSyncInterval}
onChange={(e) => setDbSyncInterval(parseInt(e.target.value))} onChange={(e) => setDbSyncInterval(parseInt(e.target.value))}
controlSize="sm"
className="w-32 accent-cyan-500" className="w-32 accent-cyan-500"
/> />
<span className="text-[10px] font-mono text-cyan-400 w-12 text-right"> <span className="text-[10px] font-mono text-cyan-400 w-12 text-right">