mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-07-24 23:44:29 +08:00
feat: add list loader and fix action column size (#3440)
* feat: create live logs page and custom top nav * feat: add live logs where clause * fix: success button color * fix: turn back color * fix: undefined scenario * feat: get live data * fix: change color, change number format * feat: add live logs list * feat: hide view if error, clear logs * feat: add condition for disable initial loading * fix: double request * fix: render id in the where clause * fix: render where clause and live list * fix: last log padding * fix: list data loading * fix: no logs text * fix: logs list size * fix: small issues * feat: add list loader and fix action column size * fix: remove unnecessary file --------- Co-authored-by: Palash Gupta <palashgdev@gmail.com> Co-authored-by: Yunus M <myounis.ar@live.com>
This commit is contained in:
parent
7e297dcb75
commit
0574350e6e
@ -1,4 +1,5 @@
|
||||
import { Button, Popover, Select, Space } from 'antd';
|
||||
import { Button, Popover, Select } from 'antd';
|
||||
import Spinner from 'components/Spinner';
|
||||
import { LOCALSTORAGE } from 'constants/localStorage';
|
||||
import { useOptionsMenu } from 'container/OptionsMenu';
|
||||
import {
|
||||
@ -7,9 +8,12 @@ import {
|
||||
viewModeOptionList,
|
||||
} from 'pages/Logs/config';
|
||||
import PopoverContent from 'pages/Logs/PopoverContent';
|
||||
import { useEventSource } from 'providers/EventSource';
|
||||
import { useCallback } from 'react';
|
||||
import { DataSource, StringOperators } from 'types/common/queryBuilder';
|
||||
|
||||
import { SpinnerWrapper, Wrapper } from './styles';
|
||||
|
||||
function ListViewPanel(): JSX.Element {
|
||||
const { config } = useOptionsMenu({
|
||||
storageKey: LOCALSTORAGE.LOGS_LIST_OPTIONS,
|
||||
@ -17,6 +21,8 @@ function ListViewPanel(): JSX.Element {
|
||||
aggregateOperator: StringOperators.NOOP,
|
||||
});
|
||||
|
||||
const { isConnectionLoading } = useEventSource();
|
||||
|
||||
const isFormatButtonVisible = logsOptions.includes(config.format?.value);
|
||||
|
||||
const renderPopoverContent = useCallback(() => {
|
||||
@ -35,7 +41,7 @@ function ListViewPanel(): JSX.Element {
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<Space align="baseline" direction="horizontal">
|
||||
<Wrapper>
|
||||
<Select
|
||||
style={defaultSelectStyle}
|
||||
value={config.format?.value}
|
||||
@ -51,7 +57,12 @@ function ListViewPanel(): JSX.Element {
|
||||
<Button>Format</Button>
|
||||
</Popover>
|
||||
)}
|
||||
</Space>
|
||||
{isConnectionLoading && (
|
||||
<SpinnerWrapper>
|
||||
<Spinner style={{ height: 'auto' }} />
|
||||
</SpinnerWrapper>
|
||||
)}
|
||||
</Wrapper>
|
||||
);
|
||||
}
|
||||
|
||||
|
11
frontend/src/container/LiveLogs/ListViewPanel/styles.ts
Normal file
11
frontend/src/container/LiveLogs/ListViewPanel/styles.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import styled from 'styled-components';
|
||||
|
||||
export const Wrapper = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1.5rem;
|
||||
`;
|
||||
|
||||
export const SpinnerWrapper = styled.div`
|
||||
margin-left: auto;
|
||||
`;
|
Loading…
x
Reference in New Issue
Block a user