ui: fix raft messages graph

Previously, when a user attempted to drag-to-zoom on the graph it would
not work properly. This is due to missing props that set the time window
and the time scale. Therefore, this patch updates the props to include
these in order to have the date picker and graph drag-to-zoom working
again.

resolves #79614

Release note (bug fix): Update props on the raft messages page to
include functions to set the time window and time scale in order
to fix date picker and drag-to-zoom functionality.

pkg/ui/workspaces/db-console/src/views/devtools/containers/raftMessages/index.tsx

@@ -37,6 +37,13 @@ import {
 import { MetricsDataProvider } from "src/views/shared/containers/metricDataProvider";
 import messagesDashboard from "./messages";
 import { getMatchParamByName } from "src/util/query";
+import { PayloadAction } from "src/interfaces/action";
+import {
+  TimeWindow,
+  TimeScale,
+  setMetricsFixedWindow,
+  setTimeScale,
+} from "src/redux/timeScale";
 
 interface NodeGraphsOwnProps {
   refreshNodes: typeof refreshNodes;
@@ -47,6 +54,8 @@ interface NodeGraphsOwnProps {
   livenessQueryValid: boolean;
   nodesSummary: NodesSummary;
   hoverState: HoverState;
+  setMetricsFixedWindow: (tw: TimeWindow) => PayloadAction<TimeWindow>;
+  setTimeScale: (ts: TimeScale) => PayloadAction<TimeScale>;
 }
 
 type RaftMessagesProps = NodeGraphsOwnProps & RouteComponentProps;
@@ -144,7 +153,13 @@ export class RaftMessages extends React.Component<RaftMessagesProps> {
       const key = `nodes.raftMessages.${idx}`;
       return (
         <div key={key}>
-          <MetricsDataProvider id={key}>
+          <MetricsDataProvider
+            id={key}
+            key={key}
+            setMetricsFixedWindow={this.props.setMetricsFixedWindow}
+            setTimeScale={this.props.setTimeScale}
+            history={this.props.history}
+          >
             {React.cloneElement(graph, { hoverOn, hoverOff, hoverState })}
           </MetricsDataProvider>
         </div>
@@ -187,6 +202,8 @@ const mapDispatchToProps = {
   refreshLiveness,
   hoverOn: hoverOnAction,
   hoverOff: hoverOffAction,
+  setMetricsFixedWindow: setMetricsFixedWindow,
+  setTimeScale,
 };
 
 export default withRouter(