Make Logs component a child of Recording component

This commit is contained in:
Justin Stephenson 2019-09-06 10:27:32 -04:00
parent 5348d111c4
commit 811b80fa27

View file

@ -400,6 +400,20 @@ class Recording extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.goBackToList = this.goBackToList.bind(this); this.goBackToList = this.goBackToList.bind(this);
this.handleTsChange = this.handleTsChange.bind(this);
this.handleLogTsChange = this.handleLogTsChange.bind(this);
this.state = {
curTs: null,
logsTs: null,
};
}
handleTsChange(ts) {
this.setState({curTs: ts});
}
handleLogTsChange(ts) {
this.setState({logsTs: ts});
} }
goBackToList() { goBackToList() {
@ -422,12 +436,13 @@ class Recording extends React.Component {
(<Player.Player (<Player.Player
ref="player" ref="player"
matchList={this.props.recording.matchList} matchList={this.props.recording.matchList}
logsTs={this.props.logsTs} logsTs={this.logsTs}
search={this.props.search} search={this.props.search}
onTsChange={this.props.onTsChange} onTsChange={this.handleTsChange}
recording={r} />); recording={r} />);
return ( return (
<React.Fragment>
<div className="container-fluid"> <div className="container-fluid">
<div className="row"> <div className="row">
<div className="col-md-12"> <div className="col-md-12">
@ -439,6 +454,15 @@ class Recording extends React.Component {
</div> </div>
{player} {player}
</div> </div>
<div className="container-fluid">
<div className="row">
<div className="col-md-12">
<Logs recording={this.props.recording} curTs={this.state.curTs}
jumpToTs={this.handleLogTsChange} />
</div>
</div>
</div>
</React.Fragment>
); );
} }
} }
@ -580,8 +604,6 @@ class View extends React.Component {
this.onLocationChanged = this.onLocationChanged.bind(this); this.onLocationChanged = this.onLocationChanged.bind(this);
this.journalctlIngest = this.journalctlIngest.bind(this); this.journalctlIngest = this.journalctlIngest.bind(this);
this.handleInputChange = this.handleInputChange.bind(this); this.handleInputChange = this.handleInputChange.bind(this);
this.handleTsChange = this.handleTsChange.bind(this);
this.handleLogTsChange = this.handleLogTsChange.bind(this);
this.handleDateSinceChange = this.handleDateSinceChange.bind(this); this.handleDateSinceChange = this.handleDateSinceChange.bind(this);
this.openConfig = this.openConfig.bind(this); this.openConfig = this.openConfig.bind(this);
/* Journalctl instance */ /* Journalctl instance */
@ -606,8 +628,6 @@ class View extends React.Component {
/* filter values end */ /* filter values end */
error_tlog_uid: false, error_tlog_uid: false,
diff_hosts: false, diff_hosts: false,
curTs: null,
logsTs: null,
}; };
} }
@ -812,14 +832,6 @@ class View extends React.Component {
cockpit.location.go([], $.extend(cockpit.location.options, {date_until: date})); cockpit.location.go([], $.extend(cockpit.location.options, {date_until: date}));
} }
handleTsChange(ts) {
this.setState({curTs: ts});
}
handleLogTsChange(ts) {
this.setState({logsTs: ts});
}
openConfig() { openConfig() {
cockpit.jump(['session-recording/config']); cockpit.jump(['session-recording/config']);
} }
@ -952,15 +964,7 @@ class View extends React.Component {
} else { } else {
return ( return (
<React.Fragment> <React.Fragment>
<Recording recording={this.recordingMap[this.state.recordingID]} onTsChange={this.handleTsChange} logsTs={this.state.logsTs} search={this.state.search} /> <Recording recording={this.recordingMap[this.state.recordingID]} search={this.state.search} />
<div className="container-fluid">
<div className="row">
<div className="col-md-12">
<Logs recording={this.recordingMap[this.state.recordingID]} curTs={this.state.curTs}
jumpToTs={this.handleLogTsChange} />
</div>
</div>
</div>
</React.Fragment> </React.Fragment>
); );
} }