fix: update no logs text and link based on the datasource (#4594)

This commit is contained in:
Yunus M 2024-02-26 12:09:31 +05:30 committed by GitHub
parent 17de5836bd
commit f9eddc9b18
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 18 additions and 7 deletions

View File

@ -161,7 +161,7 @@ function LogsExplorerList({
!isFetching &&
!isError &&
!isFilterApplied &&
logs.length === 0 && <NoLogs />}
logs.length === 0 && <NoLogs dataSource={DataSource.LOGS} />}
{!isLoading &&
!isFetching &&

View File

@ -611,6 +611,7 @@ function LogsExplorerViews({
data={data}
isError={isError}
isFilterApplied={!isEmpty(listQuery?.filters.items)}
dataSource={DataSource.LOGS}
/>
)}

View File

@ -2,25 +2,31 @@ import './NoLogs.styles.scss';
import { Typography } from 'antd';
import { ArrowUpRight } from 'lucide-react';
import { DataSource } from 'types/common/queryBuilder';
export default function NoLogs(): JSX.Element {
export default function NoLogs({
dataSource,
}: {
dataSource: DataSource;
}): JSX.Element {
return (
<div className="no-logs-container">
<div className="no-logs-container-content">
<img className="eyes-emoji" src="/Images/eyesEmoji.svg" alt="eyes emoji" />
<Typography className="no-logs-text">
No logs yet.
No {dataSource} yet.
<span className="sub-text">
When we receive logs, they would show up here
{' '}
When we receive {dataSource}, they would show up here
</span>
</Typography>
<Typography.Link
className="send-logs-link"
href="https://signoz.io/docs/userguide/logs/"
href={`https://signoz.io/docs/userguide/${dataSource}/`}
target="_blank"
>
Sending Logs to SigNoz <ArrowUpRight size={16} />
Sending {dataSource} to SigNoz <ArrowUpRight size={16} />
</Typography.Link>
</div>
</div>

View File

@ -14,6 +14,7 @@ import { useSelector } from 'react-redux';
import { AppState } from 'store/reducers';
import { SuccessResponse } from 'types/api';
import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
import { DataSource } from 'types/common/queryBuilder';
import { GlobalReducer } from 'types/reducer/globalTime';
import { getTimeRange } from 'utils/getTimeRange';
@ -25,6 +26,7 @@ function TimeSeriesView({
isError,
yAxisUnit,
isFilterApplied,
dataSource,
}: TimeSeriesViewProps): JSX.Element {
const graphRef = useRef<HTMLDivElement>(null);
@ -93,7 +95,7 @@ function TimeSeriesView({
chartData[0]?.length === 0 &&
!isLoading &&
!isError &&
!isFilterApplied && <NoLogs />}
!isFilterApplied && <NoLogs dataSource={dataSource} />}
{!isLoading &&
!isError &&
@ -111,6 +113,7 @@ interface TimeSeriesViewProps {
isLoading: boolean;
isError: boolean;
isFilterApplied: boolean;
dataSource: DataSource;
}
TimeSeriesView.defaultProps = {

View File

@ -74,6 +74,7 @@ function TimeSeriesViewContainer({
isLoading={isLoading}
data={responseData}
yAxisUnit={isValidToConvertToMs ? 'ms' : 'short'}
dataSource={dataSource}
/>
);
}