Global refresh rate in Settings drives every live view and each machine's sampler; per-page pickers removed

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

web/src/Procs.tsx

@@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react'
 import { api, Proc, ProcTable } from './api'
 import { fmtBytes, fmtRate } from './Dashboard'
 import { Btn, Loading, toast } from './ui'
+import { useRefreshMs } from './prefs'
 
 type Col = 'cpu' | 'rss' | 'pid' | 'name' | 'user' | 'started' | 'cpu_time'
 const pct = (v: number) => `${Math.round(v)}%`
@@ -10,7 +11,6 @@ const fmtDur = (s: number) => (s >= 3600 ? `${Math.floor(s / 3600)}h${String(Mat
 const fmtStart = (ms: number) => { const d = new Date(ms), now = new Date(); return d.toDateString() === now.toDateString() ? d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) : d.toLocaleDateString(undefined, { month: 'short', day: '2-digit' }) }
 const STATE: Record<string, string> = { R: 'running', S: 'sleeping', D: 'disk wait', Z: 'zombie', T: 'stopped', t: 'traced', I: 'idle' }
 
-const INTERVALS = [500, 1000, 2000, 5000] as const
 const BLOCKS = '▁▂▃▄▅▆▇█'
 
 // btop-style gradient bar: the track carries the green→yellow→red gradient and a cover
@@ -47,7 +47,7 @@ export default function Procs() {
   const [sel, setSel] = useState<number | null>(null)
   const [paused, setPaused] = useState(false)
   const [showTop, setShowTop] = useState<boolean>(() => localStorage.getItem('hamlab.procs.top') !== '0')
-  const [interval, setIntervalMs] = useState<number>(() => Number(localStorage.getItem('hamlab.procs.interval')) || 2000)
+  const interval = useRefreshMs()
 
   const load = useCallback(async () => {
     try { setT(await api.procs()); setErr('') } catch (e) { setErr(e instanceof Error ? e.message : 'failed') }
@@ -55,7 +55,6 @@ export default function Procs() {
   useEffect(() => {
     load()
     const id = window.setInterval(() => { if (!paused && document.visibilityState === 'visible') load() }, interval)
-    localStorage.setItem('hamlab.procs.interval', String(interval))
     return () => window.clearInterval(id)
   }, [load, paused, interval])
 
@@ -129,11 +128,6 @@ export default function Procs() {
         <input placeholder="filter name, command, user, pid" value={q} onChange={(e) => setQ(e.target.value)} />
         <button className={'chip' + (mine ? ' on' : '')} onClick={() => setMine(!mine)}>hide root</button>
         <button className={'chip' + (paused ? ' on' : '')} onClick={() => setPaused(!paused)}>{paused ? 'paused' : 'live'}</button>
-        <label className="muted small">refresh
-          <select className="btn" value={interval} onChange={(e) => setIntervalMs(Number(e.target.value))}>
-            {INTERVALS.map((ms) => <option key={ms} value={ms}>{ms >= 1000 ? `${ms / 1000} s` : `${ms} ms`}</option>)}
-          </select>
-        </label>
         <span className="muted small">{rows.length} shown</span>
       </div>