[Logs UI] Move page template to avoid re-renders (#151311)

## Summary

closes [#150624](#150624)

This PR improves how the page template re-renders, preventing it from
doing so when context providers in the hierarchy below it change.



https://user-images.githubusercontent.com/2767137/219055025-7da3a0ab-446f-4a8e-9a8e-af24a1a254be.mov


### For maintainers

At given moments, the Logs UI URL changes, updating the `logPosition`
state. This will re-render the template and its children.

x-pack/plugins/infra/public/pages/logs/stream/page_content.tsx

@@ -18,6 +18,7 @@ import {
 } from '../../../observability_logs/log_stream_page/state';
 import { InvalidStateCallout } from '../../../observability_logs/xstate_helpers';
 import { ConnectedLogViewErrorPage } from '../shared/page_log_view_error';
+import { LogStreamPageTemplate } from './components/stream_page_template';
 import { StreamPageLogsContentForState } from './page_logs_content';
 import { StreamPageMissingIndicesContent } from './page_missing_indices_content';
 import { LogStreamPageContentProviders } from './page_providers';
@@ -79,15 +80,17 @@ export const StreamPageContentForState: React.FC<{
     return <StreamPageMissingIndicesContent />;
   } else if (logStreamPageState.matches({ hasLogViewIndices: 'initialized' })) {
     return (
-      <LogStreamPageContentProviders
-        logStreamPageState={logStreamPageState}
-        logStreamPageCallbacks={logStreamPageCallbacks}
-      >
-        <StreamPageLogsContentForState
+      <LogStreamPageTemplate hasData={true} isDataLoading={false}>
+        <LogStreamPageContentProviders
           logStreamPageState={logStreamPageState}
           logStreamPageCallbacks={logStreamPageCallbacks}
-        />
-      </LogStreamPageContentProviders>
+        >
+          <StreamPageLogsContentForState
+            logStreamPageState={logStreamPageState}
+            logStreamPageCallbacks={logStreamPageCallbacks}
+          />
+        </LogStreamPageContentProviders>
+      </LogStreamPageTemplate>
     );
   } else {
     return <InvalidStateCallout state={logStreamPageState} />;

x-pack/plugins/infra/public/pages/logs/stream/page_logs_content.tsx

@@ -38,7 +38,6 @@ import {
 import { type ParsedQuery } from '../../../observability_logs/log_stream_query_state';
 import { MatchedStateFromActor } from '../../../observability_logs/xstate_helpers';
 import { datemathToEpochMillis, isValidDatemath } from '../../../utils/datemath';
-import { LogStreamPageTemplate } from './components/stream_page_template';
 import { LogsToolbar } from './page_toolbar';
 import { PageViewLogInContext } from './page_view_log_in_context';
 
@@ -218,7 +217,7 @@ export const StreamPageLogsContent = React.memo<{
   );
 
   return (
-    <LogStreamPageTemplate hasData={true} isDataLoading={false}>
+    <>
       <WithLogTextviewUrlState />
       <WithFlyoutOptionsUrlState />
       <LogsToolbar />
@@ -284,7 +283,7 @@ export const StreamPageLogsContent = React.memo<{
           }}
         </AutoSizer>
       </PageContent>
-    </LogStreamPageTemplate>
+    </>
   );
 });