LogLine: pass collapsed state to memoized log body component (#109849)

* LogLine: pass collapsed state to memoized log body component

* Logline: add regression

* chore: remove unnecessary spy

* Prettier

public/app/features/logs/components/panel/LogLine.test.tsx

@@ -321,6 +321,23 @@ describe.each(fontSizes)('LogLine', (fontSize: LogListFontSize) => {
       expect(onOverflow).toHaveBeenCalledTimes(2);
     });
 
+    test('When the collapsed state changes, the log line contents re-render', async () => {
+      log.collapsed = true;
+      log.raw = 'The full contents of the log line';
+
+      render(
+        <LogListContextProvider {...contextProps}>
+          <LogLine {...defaultProps} log={log} />
+        </LogListContextProvider>
+      );
+
+      expect(screen.queryByText(log.raw)).not.toBeInTheDocument();
+
+      await userEvent.click(await screen.findByText('show more'));
+
+      expect(screen.getByText(log.raw)).toBeInTheDocument();
+    });
+
     test('Syncs the collapsed state with collapsed status changes in the log', async () => {
       log.collapsed = true;
       const { rerender } = render(<LogLine {...defaultProps} log={log} />);

public/app/features/logs/components/panel/LogLine.tsx

@@ -134,8 +134,8 @@ const LogLineComponent = memo(
 
     const handleExpandCollapse = useCallback(() => {
       const newState = !collapsed;
-      setCollapsed(newState);
       log.setCollapsedState(newState);
+      setCollapsed(newState);
       onOverflow?.(index, log.uid);
     }, [collapsed, index, log, onOverflow]);
 
@@ -208,6 +208,7 @@ const LogLineComponent = memo(
             onClick={handleClick}
           >
             <Log
+              collapsed={collapsed}
               displayedFields={displayedFields}
               log={log}
               showTime={showTime}
@@ -253,6 +254,7 @@ LogLineComponent.displayName = 'LogLineComponent';
 export type LogLineTimestampResolution = 'ms' | 'ns';
 
 interface LogProps {
+  collapsed?: boolean;
   displayedFields: string[];
   log: LogListModel;
   showTime: boolean;

public/app/features/logs/components/panel/processing.ts

@@ -216,7 +216,6 @@ export class LogListModel implements LogRowModel {
       this._body = undefined;
       this._highlightedBody = undefined;
     }
-    return this.collapsed;
   }
 
   setCollapsedState(collapsed: boolean) {