добавлен фильтр количеста вывода записей на странице История тревог

frontend/components/alerts/DetectorList.tsx

@@ -68,7 +68,7 @@ const DetectorList: React.FC<DetectorListProps> = ({ objectId, selectedDetectors
   const [detectors, setDetectors] = useState<Detector[]>([])
   const [searchTerm, setSearchTerm] = useState<string>(initialSearchTerm)
   const [currentPage, setCurrentPage] = useState(1)
-  const itemsPerPage = 20
+  const [itemsPerPage, setItemsPerPage] = useState(10)
 
   useEffect(() => {
     const loadDetectors = async () => {
@@ -80,6 +80,7 @@ const DetectorList: React.FC<DetectorListProps> = ({ objectId, selectedDetectors
         const rawArray: RawDetector[] = Object.values(detectorsData).filter(
           (detector) => (objectId ? detector.object === objectId : true)
         )
+        
         const normalized: Detector[] = rawArray.map((d) => ({
           detector_id: d.detector_id,
           name: d.name,
@@ -89,7 +90,8 @@ const DetectorList: React.FC<DetectorListProps> = ({ objectId, selectedDetectors
           floor: d.floor,
           checked: false,
         }))
-        console.log('[DetectorList] Payload:', payload) 
+        console.log('[DetectorList] Payload:', payload)
+        console.log('[DetectorList] Total detectors:', normalized.length) 
         setDetectors(normalized)
       } catch (e) {
         console.error('Failed to load detectors:', e)
@@ -129,6 +131,30 @@ const DetectorList: React.FC<DetectorListProps> = ({ objectId, selectedDetectors
         </div>
         
         <div className="flex items-center gap-3">
+          {/* Выбор количества элементов */}
+          <div className="flex items-center gap-2">
+            <span className="text-sm text-gray-400">Показывать:</span>
+            <div className="relative">
+              <select
+                value={itemsPerPage}
+                onChange={(e) => {
+                  setItemsPerPage(Number(e.target.value))
+                  setCurrentPage(1)
+                }}
+                className="bg-[#161824] text-white px-3 py-2 rounded-lg border border-gray-600 focus:border-blue-500 focus:outline-none text-sm font-medium appearance-none pr-8"
+                style={{ fontFamily: 'Inter, sans-serif' }}
+              >
+                <option value="10">10</option>
+                <option value="20">20</option>
+                <option value="50">50</option>
+                <option value="100">100</option>
+              </select>
+              <svg className="w-4 h-4 absolute right-2 top-1/2 transform -translate-y-1/2 pointer-events-none text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
+              </svg>
+            </div>
+          </div>
+          
           <div className="relative">
             <input
               type="text"