diff --git a/src/hooks/useQueryLogs.ts b/src/hooks/useQueryLogs.ts index 2ed32d6c..7c13cebe 100644 --- a/src/hooks/useQueryLogs.ts +++ b/src/hooks/useQueryLogs.ts @@ -40,7 +40,7 @@ export const useQueryLogs = () => { if (searchText) { for (const key in log) { - const logValue = parseLogData(log[key]); + const logValue = parseLogData(log[key], key); if (logValue?.toString().toLowerCase().includes(searchText)) { temp.push(log); continue mainLoop; diff --git a/src/pages/Logs/Column.tsx b/src/pages/Logs/Column.tsx index 11ff70ee..afe8afb0 100644 --- a/src/pages/Logs/Column.tsx +++ b/src/pages/Logs/Column.tsx @@ -13,20 +13,20 @@ import { parseLogData } from '@/utils'; import { useDisclosure } from '@mantine/hooks'; type Column = { - label: string; + columnName: string; getColumnFilters: (columnName: string) => Log[number][] | null; appliedFilter: (columnName: string) => string[]; applyFilter: (columnName: string, value: string[]) => void; }; const Column: FC = (props) => { - const { label, getColumnFilters, appliedFilter, applyFilter } = props; + const { columnName, getColumnFilters, appliedFilter, applyFilter } = props; // columnValues ref will always have the unfiltered data. const _columnValuesRef = useRef(null); const [columnValues, setColumnValues] = useMountedState(null); - const [selectedFilters, setSelectedFilters] = useMountedState(appliedFilter(label)); + const [selectedFilters, setSelectedFilters] = useMountedState(appliedFilter(columnName)); const [isPending, startTransition] = useTransition(); const onSearch = (e: ChangeEvent) => { @@ -37,7 +37,7 @@ const Column: FC = (props) => { if (values && search) { return values.filter((x) => { - return parseLogData(x)?.toString().includes(search); + return parseLogData(x, columnName)?.toString().includes(search); }); } @@ -51,7 +51,7 @@ const Column: FC = (props) => { const onOpen = useCallback(() => { if (!_columnValuesRef.current) { - _columnValuesRef.current = getColumnFilters(label); + _columnValuesRef.current = getColumnFilters(columnName); startTransition(() => { setColumnValues(_columnValuesRef.current); }); @@ -59,11 +59,11 @@ const Column: FC = (props) => { }, []); const onApply = () => { - applyFilter(label, selectedFilters); + applyFilter(columnName, selectedFilters); }; - const filterActive = useMemo(() => !!appliedFilter(label)?.length, [selectedFilters]); - const canApply = useMemo(() => !compare(selectedFilters, appliedFilter(label)), [selectedFilters]); + const filterActive = useMemo(() => Boolean(appliedFilter(columnName)?.length), [selectedFilters]); + const canApply = useMemo(() => !compare(selectedFilters, appliedFilter(columnName)), [selectedFilters]); const { classes, cx } = useTableColumnStyle(); const { labelBtn, applyBtn, labelIcon, labelIconActive, searchInputStyle } = classes; @@ -73,7 +73,7 @@ const Column: FC = (props) => { - {label} + {columnName} = (props) => { /> {isPending ? ( - ) : ( + ) : columnValues?.length ? ( - {columnValues?.length ? ( - - - - - ) : ( - - )} + + + ) : ( + )} @@ -120,13 +117,14 @@ const Column: FC = (props) => { }; type CheckboxVirtualListProps = { + columnName: string; list: Log[number][]; selectedFilters: string[]; setFilters: (value: string[]) => void; }; const CheckboxVirtualList: FC = (props) => { - const { list, selectedFilters, setFilters } = props; + const { list, selectedFilters, setFilters, columnName } = props; return ( @@ -134,7 +132,7 @@ const CheckboxVirtualList: FC = (props) => { {({ index }) => { const label = list[index]?.toString() || ''; - return ; + return ; }} @@ -144,10 +142,11 @@ const CheckboxVirtualList: FC = (props) => { type CheckboxRowProps = { label: string; value: string; + columnName: string; }; const CheckboxRow: FC = (props) => { - const { value, label } = props; + const { value, label, columnName } = props; const [opened, { open, close }] = useDisclosure(false); const { classes } = useTableColumnStyle(); const { checkBoxStyle } = classes; @@ -161,7 +160,7 @@ const CheckboxRow: FC = (props) => { maxWidth: 250, }}>
- +
); diff --git a/src/pages/Logs/LogRow.tsx b/src/pages/Logs/LogRow.tsx index 93c827df..8fb0549b 100644 --- a/src/pages/Logs/LogRow.tsx +++ b/src/pages/Logs/LogRow.tsx @@ -42,7 +42,9 @@ const LogRow: FC = (props) => { {logsSchema.map((logSchema, logSchemaIndex) => { if (!isColumnActive(logSchema.name) || skipFields.includes(logSchema.name)) return null; - return {parseLogData(log[logSchema.name])}; + return ( + {parseLogData(log[logSchema.name], logSchema.name)} + ); })} diff --git a/src/pages/Logs/LogTable.tsx b/src/pages/Logs/LogTable.tsx index e3df5c66..dfacb9cd 100644 --- a/src/pages/Logs/LogTable.tsx +++ b/src/pages/Logs/LogTable.tsx @@ -117,7 +117,7 @@ const LogTable: FC = () => { return ( { }; // eslint-disable-next-line @typescript-eslint/no-explicit-any -export const parseLogData = (value?: any) => { - if (typeof value === 'string' && dayjs(value).isValid()) { +export const parseLogData = (value?: any, columnName?: string) => { + const dateColumnNames = ['date', 'datetime', 'time', 'timestamp', 'p_timestamp']; + + if (columnName && dateColumnNames.includes(columnName) && dayjs(value).isValid()) { return dayjs(value).utc(true).format('DD/MM/YYYY HH:mm:ss'); }