Logs: Re-run Loki queries in Explore when direction and sort order are changed (#99994)

public/app/features/explore/Logs/Logs.test.tsx

@@ -48,17 +48,18 @@ jest.mock('../state/explorePane', () => ({
   changePanelState: (exploreId: string, panel: 'logs', panelState: {} | ExploreLogsPanelState) => {
     return fakeChangePanelState(exploreId, panel, panelState);
   },
-  changeQueries: (args: { queries: DataQuery[]; exploreId: string | undefined }) => {
-    return fakeChangeQueries(args);
-  },
 }));
 
 const fakeChangeQueries = jest.fn().mockReturnValue({ type: 'fakeChangeQueries' });
+const fakeRunQueries = jest.fn().mockReturnValue({ type: 'fakeRunQueries' });
 jest.mock('../state/query', () => ({
   ...jest.requireActual('../state/query'),
   changeQueries: (args: { queries: DataQuery[]; exploreId: string | undefined }) => {
     return fakeChangeQueries(args);
   },
+  runQueries: (args: { queries: DataQuery[]; exploreId: string | undefined }) => {
+    return fakeRunQueries(args);
+  },
 }));
 
 describe('Logs', () => {
@@ -388,6 +389,7 @@ describe('Logs', () => {
     expect(logRows.length).toBe(3);
     expect(logRows[0].textContent).toContain('log message 1');
     expect(logRows[2].textContent).toContain('log message 3');
+    expect(fakeRunQueries).not.toHaveBeenCalled();
   });
 
   it('should sync the query direction when changing the order of loki queries', async () => {
@@ -399,6 +401,7 @@ describe('Logs', () => {
       exploreId: 'left',
       queries: [{ ...query, direction: LokiQueryDirection.Forward }],
     });
+    expect(fakeRunQueries).toHaveBeenCalledWith({ exploreId: 'left' });
   });
 
   it('should not change the query direction when changing the order of non-loki queries', async () => {

public/app/features/explore/Logs/Logs.tsx

@@ -75,7 +75,7 @@ import {
 import { useContentOutlineContext } from '../ContentOutline/ContentOutlineContext';
 import { getUrlStateFromPaneState } from '../hooks/useStateSync';
 import { changePanelState } from '../state/explorePane';
-import { changeQueries } from '../state/query';
+import { changeQueries, runQueries } from '../state/query';
 
 import { LogsFeedback } from './LogsFeedback';
 import { LogsMetaRow } from './LogsMetaRow';
@@ -478,12 +478,11 @@ const UnthemedLogs: React.FunctionComponent<Props> = (props: Props) => {
           if (query.datasource?.type !== 'loki' || !isLokiQuery(query)) {
             return query;
           }
-          hasLokiQueries = true;
-
           if (query.direction === LokiQueryDirection.Scan) {
             // Don't override Scan. When the direction is Scan it means that the user specifically assigned this direction to the query.
             return query;
           }
+          hasLokiQueries = true;
           const newDirection =
             newSortOrder === LogsSortOrder.Ascending ? LokiQueryDirection.Forward : LokiQueryDirection.Backward;
           if (newDirection !== query.direction) {
@@ -494,6 +493,7 @@ const UnthemedLogs: React.FunctionComponent<Props> = (props: Props) => {
 
         if (hasLokiQueries) {
           dispatch(changeQueries({ exploreId, queries: newQueries }));
+          dispatch(runQueries({ exploreId }));
         }
       }