feat(logs): Use query params for logs fields (#98860)

This uses query params to set logs fields.

Author: Zylphrex

static/app/views/explore/contexts/logs/logsPageParams.tsx

@@ -393,20 +393,6 @@ export function useLogsProjectIds() {
   return projectIds;
 }
 
-export function useSetLogsFields() {
-  const setPageParams = useSetLogsPageParams();
-
-  const [_, setPersistentParams] = usePersistedLogsPageParams();
-
-  return useCallback(
-    (fields: string[]) => {
-      setPageParams({fields});
-      setPersistentParams(prev => ({...prev, fields}));
-    },
-    [setPageParams, setPersistentParams]
-  );
-}
-
 export function useSetLogsSavedQueryInfo() {
   const setPageParams = useSetLogsPageParams();
   return useCallback(

static/app/views/explore/logs/logsLocationQueryParamsProvider.tsx

@@ -1,8 +1,10 @@
 import type {ReactNode} from 'react';
 import {useCallback, useMemo} from 'react';
 
+import {defined} from 'sentry/utils';
 import {useLocation} from 'sentry/utils/useLocation';
 import {useNavigate} from 'sentry/utils/useNavigate';
+import {usePersistedLogsPageParams} from 'sentry/views/explore/contexts/logs/logsPageParams';
 import {
   getReadableQueryParamsFromLocation,
   getTargetWithReadableQueryParams,
@@ -21,17 +23,27 @@ export function LogsLocationQueryParamsProvider({
   const location = useLocation();
   const navigate = useNavigate();
 
+  const [_, setPersistentParams] = usePersistedLogsPageParams();
+
   const readableQueryParams = useMemo(
     () => getReadableQueryParamsFromLocation(location),
     [location]
   );
 
   const setWritableQueryParams = useCallback(
     (writableQueryParams: WritableQueryParams) => {
+      const fields = writableQueryParams.fields;
+      if (defined(fields)) {
+        setPersistentParams(prev => ({
+          ...prev,
+          fields,
+        }));
+      }
+
       const target = getTargetWithReadableQueryParams(location, writableQueryParams);
       navigate(target);
     },
-    [location, navigate]
+    [location, navigate, setPersistentParams]
   );
 
   const isUsingDefaultFields = isDefaultFields(location);

static/app/views/explore/logs/logsQueryParams.tsx

@@ -85,8 +85,11 @@ export function getTargetWithReadableQueryParams(
 ): Location {
   const target: Location = {...location, query: {...location.query}};
 
-  updateNullableLocation(target, LOGS_CURSOR_KEY, writableQueryParams.cursor);
   updateNullableLocation(target, LOGS_MODE_KEY, writableQueryParams.mode);
+
+  updateNullableLocation(target, LOGS_CURSOR_KEY, writableQueryParams.cursor);
+  updateNullableLocation(target, LOGS_FIELDS_KEY, writableQueryParams.fields);
+
   updateNullableLocation(
     target,
     LOGS_AGGREGATE_CURSOR_KEY,

static/app/views/explore/logs/logsTab.tsx

@@ -26,10 +26,7 @@ import {TraceItemSearchQueryBuilder} from 'sentry/views/explore/components/trace
 import {defaultLogFields} from 'sentry/views/explore/contexts/logs/fields';
 import {useLogsAutoRefreshEnabled} from 'sentry/views/explore/contexts/logs/logsAutoRefreshContext';
 import {useLogsPageDataQueryResult} from 'sentry/views/explore/contexts/logs/logsPageData';
-import {
-  useLogsSearch,
-  useSetLogsFields,
-} from 'sentry/views/explore/contexts/logs/logsPageParams';
+import {useLogsSearch} from 'sentry/views/explore/contexts/logs/logsPageParams';
 import {Mode} from 'sentry/views/explore/contexts/pageParamsContext/mode';
 import {formatSort} from 'sentry/views/explore/contexts/pageParamsContext/sortBys';
 import {useTraceItemAttributes} from 'sentry/views/explore/contexts/traceItemAttributeContext';
@@ -82,6 +79,7 @@ import {
   useQueryParamsSortBys,
   useQueryParamsTopEventsLimit,
   useQueryParamsVisualizes,
+  useSetQueryParamsFields,
   useSetQueryParamsMode,
 } from 'sentry/views/explore/queryParams/context';
 import {ColumnEditorModal} from 'sentry/views/explore/tables/columnEditorModal';
@@ -108,7 +106,7 @@ export function LogsTabContent({
   const sortBys = useQueryParamsSortBys();
   const aggregateSortBys = useQueryParamsAggregateSortBys();
   const setMode = useSetQueryParamsMode();
-  const setFields = useSetLogsFields();
+  const setFields = useSetQueryParamsFields();
   const tableData = useLogsPageDataQueryResult();
   const autorefreshEnabled = useLogsAutoRefreshEnabled();
   const [timeseriesIngestDelay, setTimeseriesIngestDelay] = useState<bigint>(

static/app/views/explore/logs/useLogAttributesTreeActions.tsx

@@ -5,17 +5,19 @@ import {t} from 'sentry/locale';
 import type {AttributesTreeContent} from 'sentry/views/explore/components/traceItemAttributes/attributesTree';
 import {
   useLogsSearch,
-  useSetLogsFields,
   useSetLogsSearch,
 } from 'sentry/views/explore/contexts/logs/logsPageParams';
 import {OurLogKnownFieldKey} from 'sentry/views/explore/logs/types';
-import {useQueryParamsFields} from 'sentry/views/explore/queryParams/context';
+import {
+  useQueryParamsFields,
+  useSetQueryParamsFields,
+} from 'sentry/views/explore/queryParams/context';
 
 export function useLogAttributesTreeActions({embedded}: {embedded: boolean}) {
   const setLogsSearch = useSetLogsSearch();
   const search = useLogsSearch();
   const fields = useQueryParamsFields();
-  const setLogFields = useSetLogsFields();
+  const setLogFields = useSetQueryParamsFields();
 
   const addSearchFilter = useCallback(
     (content: AttributesTreeContent, negated?: boolean) => {

static/app/views/explore/queryParams/context.tsx

@@ -145,6 +145,17 @@ export function useQueryParamsFields(): readonly string[] {
   return queryParams.fields;
 }
 
+export function useSetQueryParamsFields() {
+  const setQueryParams = useSetQueryParams();
+
+  return useCallback(
+    (fields: string[]) => {
+      setQueryParams({fields});
+    },
+    [setQueryParams]
+  );
+}
+
 export function useQueryParamsSortBys(): readonly Sort[] {
   const queryParams = useQueryParams();
   return queryParams.sortBys;