diff --git a/frontend/src/modules/agent/ui/LogFilters.tsx b/frontend/src/modules/agent/ui/LogFilters.tsx index 4457628..36ba5fb 100644 --- a/frontend/src/modules/agent/ui/LogFilters.tsx +++ b/frontend/src/modules/agent/ui/LogFilters.tsx @@ -9,11 +9,30 @@ import { } from "react-icons/fi"; import { useLogFilterStore, type LogLevel } from "../store/logFilter.store"; -const logLevelColors: Record = { - INFO: { bg: "var(--info-bg)", text: "var(--info-text)", border: "var(--info-border)" }, - WARNING: { bg: "var(--warning-bg)", text: "var(--warning-text)", border: "var(--warning-border)" }, - ERROR: { bg: "var(--error-bg)", text: "var(--error-text)", border: "var(--error-border)" }, - FATAL: { bg: "var(--fatal-bg)", text: "var(--fatal-text)", border: "var(--fatal-border)" }, +const logLevelColors: Record< + LogLevel, + { bg: string; text: string; border: string } +> = { + INFO: { + bg: "var(--info-bg)", + text: "var(--info-text)", + border: "var(--info-border)", + }, + WARNING: { + bg: "var(--warning-bg)", + text: "var(--warning-text)", + border: "var(--warning-border)", + }, + ERROR: { + bg: "var(--error-bg)", + text: "var(--error-text)", + border: "var(--error-border)", + }, + FATAL: { + bg: "var(--fatal-bg)", + text: "var(--fatal-text)", + border: "var(--fatal-border)", + }, }; interface LogFiltersProps { @@ -22,7 +41,11 @@ interface LogFiltersProps { availableAgents: string[]; } -export const LogFilters: React.FC = ({ onApply, availableServices, availableAgents }) => { +export const LogFilters: React.FC = ({ + onApply, + availableServices, + availableAgents, +}) => { const { searchQuery, startDate, @@ -72,7 +95,14 @@ export const LogFilters: React.FC = ({ onApply, availableServic setSelectedService(localService); setSelectedAgent(localAgent); onApply(); - }, [localSearchQuery, localStartDate, localEndDate, localService, localAgent, onApply]); + }, [ + localSearchQuery, + localStartDate, + localEndDate, + localService, + localAgent, + onApply, + ]); const handleReset = useCallback(() => { setLocalSearchQuery(""); @@ -130,7 +160,10 @@ export const LogFilters: React.FC = ({ onApply, availableServic
-

+

Фильтры логов

@@ -140,7 +173,7 @@ export const LogFilters: React.FC = ({ onApply, availableServic
{/* Filters Grid */} -
+
{/* Search */}
= ({ onApply, availableServic
setLocalStartDate(e.target.value ? new Date(e.target.value) : null)} - style={inputStyle} + value={ + localStartDate ? localStartDate.toISOString().split("T")[0] : "" + } + onChange={(e) => + setLocalStartDate( + e.target.value ? new Date(e.target.value) : null, + ) + } + style={{ ...inputStyle, minWidth: 0 }} placeholder="Дата от" + className="flex-1 min-w-0" /> setLocalEndDate(e.target.value ? new Date(e.target.value) : null)} - style={inputStyle} + value={ + localEndDate ? localEndDate.toISOString().split("T")[0] : "" + } + onChange={(e) => + setLocalEndDate( + e.target.value ? new Date(e.target.value) : null, + ) + } + style={{ ...inputStyle, minWidth: 0 }} placeholder="Дата до" + className="flex-1 min-w-0" />
@@ -214,7 +261,10 @@ export const LogFilters: React.FC = ({ onApply, availableServic
- + Уровни логов @@ -222,36 +272,42 @@ export const LogFilters: React.FC = ({ onApply, availableServic
- {(["INFO", "WARNING", "ERROR", "FATAL"] as LogLevel[]).map((level) => { - const isSelected = selectedLogLevels.includes(level); - const colors = logLevelColors[level]; - return ( - - ); - })} + {(["INFO", "WARNING", "ERROR", "FATAL"] as LogLevel[]).map( + (level) => { + const isSelected = selectedLogLevels.includes(level); + const colors = logLevelColors[level]; + return ( + + ); + }, + )}
{/* Action Buttons */} -
+
{/* Active Filters Display */} {activeFiltersCount > 0 && ( -
+
- + Активные фильтры:
@@ -289,14 +353,21 @@ export const LogFilters: React.FC = ({ onApply, availableServic }} > - Поиск: {searchQuery} + + Поиск: {searchQuery} + @@ -311,14 +382,21 @@ export const LogFilters: React.FC = ({ onApply, availableServic }} > - Сервис: {selectedService} + + Сервис: {selectedService} + @@ -333,14 +411,21 @@ export const LogFilters: React.FC = ({ onApply, availableServic }} > - Агент: {selectedAgent} + + Агент: {selectedAgent} + @@ -355,14 +440,21 @@ export const LogFilters: React.FC = ({ onApply, availableServic }} > - С: {formatDate(startDate)} + + С: {formatDate(startDate)} + @@ -377,14 +469,21 @@ export const LogFilters: React.FC = ({ onApply, availableServic }} > - По: {formatDate(endDate)} + + По: {formatDate(endDate)} +