@finsemble/finsemble-core 7.3.1 → 7.3.2

package/dist/services/logger/src/components/TopCollar.tsx

@@ -13,10 +13,6 @@ interface IProps {
 	showProcessMonitor: boolean;
 }
 interface IState {
-	logCount: {
-		master: number;
-		display: number;
-	};
 	clientListVisible: boolean;
 }
 
@@ -25,21 +21,17 @@ export default class TopCollar extends React.PureComponent<IProps, IState> {
 	constructor(props: IProps) {
 		super(props);
 		this.state = {
-			logCount: LoggerStore.getLogCounts(),
 			clientListVisible: LoggerStore.getClientListVisible(),
 		};
 
-		this.getNewLogCounts = this.getNewLogCounts.bind(this);
 		this.updateClientListVisible = this.updateClientListVisible.bind(this);
 	}
 
 	componentDidMount() {
-		LoggerStore.addListener("loggerNewMessages", this.getNewLogCounts);
 		LoggerStore.addListener("clientListVisibleChange", this.updateClientListVisible);
 	}
 
 	componentWillUnmount() {
-		LoggerStore.removeListener("loggerNewMessages", this.getNewLogCounts);
 		LoggerStore.removeListener("clientListVisibleChange", this.updateClientListVisible);
 	}
 
@@ -59,12 +51,6 @@ export default class TopCollar extends React.PureComponent<IProps, IState> {
 		LoggerStore.persistState.persist();
 	}
 
-	getNewLogCounts() {
-		this.setState({
-			logCount: LoggerStore.getLogCounts(),
-		});
-	}
-
 	toggleClientList() {
 		LoggerStore.toggleClientListVisible();
 	}

package/dist/services/logger/src/components/Views/Logs/rightPanel/LogLevelFilters.tsx

@@ -10,15 +10,57 @@ const VERY_SLOW_DIFF = 300;
 const MONSTROUSLY_SLOW_DIFF = 500;
 
 interface IProps {}
+
 interface IState {
 	logState: any;
 	rowTimeDiff: any;
+}
+
+interface ILogsCountState {
 	logCounts: {
 		master: number;
 		display: number;
 	};
 }
 
+// The component to show the current logs size. It should be separated to re-rendering only small part of UI
+class LogsCountLabel extends Component<IProps, ILogsCountState> {
+	constructor(props: IProps) {
+		super(props);
+
+		this.state = {
+			logCounts: LoggerStore.getLogCounts(),
+		};
+
+		this.loggerGetNewMessages = this.loggerGetNewMessages.bind(this);
+	}
+
+	componentDidMount() {
+		LoggerStore.addListener("loggerNewMessages", this.loggerGetNewMessages);
+	}
+
+	componentWillUnmount() {
+		LoggerStore.removeListener("loggerNewMessages", this.loggerGetNewMessages);
+	}
+
+	loggerGetNewMessages() {
+		this.setState({
+			logCounts: LoggerStore.getLogCounts(),
+		});
+	}
+
+	render() {
+		return (
+			<div className="fsbl-logger-button-group-label">
+				<b>{this.state.logCounts.display}</b>
+				&nbsp;of &nbsp;
+				<b>{this.state.logCounts.master}</b>
+				&nbsp; lines visible
+			</div>
+		);
+	}
+}
+
 class LogLevelFilters extends Component<IProps, IState> {
 	constructor(props: IProps) {
 		super(props);
@@ -27,11 +69,9 @@ class LogLevelFilters extends Component<IProps, IState> {
 		this.state = {
 			logState: initialLogState,
 			rowTimeDiff: LoggerStore.getRowTimeDiff(),
-			logCounts: LoggerStore.getLogCounts(),
 		};
 		this.updateRowTimeDiff = this.updateRowTimeDiff.bind(this);
 		this.getNewDisplayState = this.getNewDisplayState.bind(this);
-		this.loggerGetNewMessages = this.loggerGetNewMessages.bind(this);
 	}
 
 	getNewDisplayState() {
@@ -48,19 +88,11 @@ class LogLevelFilters extends Component<IProps, IState> {
 	componentDidMount() {
 		LoggerStore.addListener("rowTimeDiffChange", this.updateRowTimeDiff);
 		LoggerStore.addListener("newDisplayState", this.getNewDisplayState);
-		LoggerStore.addListener("loggerNewMessages", this.loggerGetNewMessages);
 	}
 
 	componentWillUnmount() {
 		LoggerStore.removeListener("rowTimeDiffChange", this.updateRowTimeDiff);
 		LoggerStore.removeListener("newDisplayState", this.getNewDisplayState);
-		LoggerStore.removeListener("loggerNewMessages", this.loggerGetNewMessages);
-	}
-
-	loggerGetNewMessages() {
-		this.setState({
-			logCounts: LoggerStore.getLogCounts(),
-		});
 	}
 
 	allToggle() {
@@ -164,12 +196,7 @@ class LogLevelFilters extends Component<IProps, IState> {
 							Verbose
 						</LoggerButton>
 					</div>
-					<div className="fsbl-logger-button-group-label">
-						<b>{this.state.logCounts.display}</b>
-						&nbsp;of &nbsp;
-						<b>{this.state.logCounts.master}</b>
-						&nbsp; lines visible
-					</div>
+					<LogsCountLabel></LogsCountLabel>
 				</div>
 				<div className="delta-box-wrapper flex-column">
 					<div className="fsbl-logger-button-group-label">Delta</div>