diff --git a/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.styles.scss b/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.styles.scss
index c8891390f4..5c84f33dfa 100644
--- a/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.styles.scss
+++ b/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.styles.scss
@@ -22,4 +22,10 @@
width: fit-content;
}
}
-}
\ No newline at end of file
+ &__item {
+ width: 100%;
+ .raw-log-content {
+ cursor: pointer;
+ }
+ }
+}
diff --git a/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.tsx b/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.tsx
index 90a8126227..2d68f9e09b 100644
--- a/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.tsx
+++ b/frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.tsx
@@ -1,9 +1,10 @@
import './ContextLogRenderer.styles.scss';
-import { Skeleton } from 'antd';
+import { Button, Skeleton } from 'antd';
import RawLogView from 'components/Logs/RawLogView';
import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
import { LOCALSTORAGE } from 'constants/localStorage';
+import { QueryParams } from 'constants/query';
import ShowButton from 'container/LogsContextList/ShowButton';
import { convertKeysToColumnFields } from 'container/LogsExplorerList/utils';
import { useOptionsMenu } from 'container/OptionsMenu';
@@ -11,7 +12,9 @@ import { defaultLogsSelectedColumns } from 'container/OptionsMenu/constants';
import { FontSize } from 'container/OptionsMenu/types';
import { ORDERBY_FILTERS } from 'container/QueryBuilder/filters/OrderByFilter/config';
import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import useUrlQuery from 'hooks/useUrlQuery';
import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useLocation } from 'react-router-dom';
import { Virtuoso } from 'react-virtuoso';
import { ILog } from 'types/api/logs/log';
import { Query, TagFilter } from 'types/api/queryBuilder/queryBuilderData';
@@ -101,20 +104,51 @@ function ContextLogRenderer({
}
}, [options.fontSize]);
+ const urlQuery = useUrlQuery();
+
+ const { pathname } = useLocation();
+
+ const handleLogClick = useCallback(
+ (logId: string): void => {
+ urlQuery.set(QueryParams.activeLogId, `"${logId}"`);
+
+ urlQuery.set(
+ QueryParams.compositeQuery,
+ encodeURIComponent(JSON.stringify(query)),
+ );
+
+ const link = `${pathname}?${urlQuery.toString()}`;
+
+ window.open(link, '_blank', 'noopener,noreferrer');
+ },
+ [pathname, query, urlQuery],
+ );
+
const getItemContent = useCallback(
(_: number, logTorender: ILog): JSX.Element => (
-
+
),
- [log.id, options.fontSize],
+ [handleLogClick, log.id, options.fontSize, options.selectColumns],
);
return (