From ff768b82170f8cd482cb2901d0fdca54aac860a5 Mon Sep 17 00:00:00 2001
From: 2GT-Rich <107219997+2GT-Rich@users.noreply.github.com>
Date: Thu, 23 Apr 2026 16:23:48 -0700
Subject: [PATCH] fix: move ref sync to useEffect to satisfy react-hooks/refs
 lint rule

---
 frontend/src/pages/ClientsPage.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/ClientsPage.tsx b/frontend/src/pages/ClientsPage.tsx
index 3bff241..a42975d 100644
--- a/frontend/src/pages/ClientsPage.tsx
+++ b/frontend/src/pages/ClientsPage.tsx
@@ -1,4 +1,4 @@
-import { useState, useMemo, useRef } from 'react';
+import { useState, useMemo, useRef, useEffect } from 'react';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import { useNavigate } from 'react-router-dom';
 import { Search, Wifi, Network, Users, X, Pencil, Trash2, ChevronUp, ChevronDown, ChevronsUpDown, RefreshCw } from 'lucide-react';
@@ -131,7 +131,7 @@ export default function ClientsPage() {
   const [sortDir, setSortDir] = useState<'asc' | 'desc'>('desc');
   const [refreshInterval, setRefreshInterval] = useState<number | null>(readStoredInterval);
   const refreshIntervalRef = useRef(refreshInterval);
-  refreshIntervalRef.current = refreshInterval;
+  useEffect(() => { refreshIntervalRef.current = refreshInterval; }, [refreshInterval]);
   const PAGE_SIZE = 50;
 
   const handleIntervalChange = (val: number | null) => {