diff --git a/frontend/app/components/Errors/Error/ErrorInfo.js b/frontend/app/components/Errors/Error/ErrorInfo.js
index 91c06b617..abfa4e76b 100644
--- a/frontend/app/components/Errors/Error/ErrorInfo.js
+++ b/frontend/app/components/Errors/Error/ErrorInfo.js
@@ -35,8 +35,10 @@ export default class ErrorInfo extends React.PureComponent {
componentDidMount() {
this.ensureInstance();
}
- componentDidUpdate() {
- this.ensureInstance();
+ componentDidUpdate(prevProps) {
+ if (prevProps.errorId !== this.props.errorId || prevProps.errorIdInStore !== this.props.errorIdInStore) {
+ this.ensureInstance();
+ }
}
next = () => {
const { list, errorId } = this.props;
diff --git a/frontend/app/components/Session_/Storage/Storage.js b/frontend/app/components/Session_/Storage/Storage.js
index 20fa1c703..e0fbb73f6 100644
--- a/frontend/app/components/Session_/Storage/Storage.js
+++ b/frontend/app/components/Session_/Storage/Storage.js
@@ -14,13 +14,9 @@ import { diff } from 'deep-diff';
import { jump } from 'Player';
import BottomBlock from '../BottomBlock/index';
import DiffRow from './DiffRow';
-import cn from 'classnames';
import stl from './storage.module.css';
-import { List, CellMeasurer, CellMeasurerCache, AutoSizer } from 'react-virtualized'
+import { List, CellMeasurer, CellMeasurerCache, AutoSizer } from 'react-virtualized';
-// const STATE = 'STATE';
-// const DIFF = 'DIFF';
-// const TABS = [ DIFF, STATE ].map(tab => ({ text: tab, key: tab }));
const ROW_HEIGHT = 90;
function getActionsName(type) {
@@ -46,7 +42,6 @@ function getActionsName(type) {
hideHint,
}
)
-//@withEnumToggle('activeTab', 'setActiveTab', DIFF)
export default class Storage extends React.PureComponent {
constructor(props) {
super(props);
@@ -55,9 +50,9 @@ export default class Storage extends React.PureComponent {
this._list = React.createRef();
this.cache = new CellMeasurerCache({
fixedWidth: true,
- keyMapper: index => this.props.listNow[index]
+ keyMapper: (index) => this.props.listNow[index],
});
- this._rowRenderer = this._rowRenderer.bind(this)
+ this._rowRenderer = this._rowRenderer.bind(this);
}
focusNextButton() {
@@ -102,7 +97,10 @@ export default class Storage extends React.PureComponent {
}
return (
-
+
{stateDiff.map((d, i) => this.renderDiffs(d, i))}
);
@@ -150,7 +148,7 @@ export default class Storage extends React.PureComponent {
return
;
}
- renderItem(item, i, prevItem, style, measure) {
+ renderItem(item, i, prevItem, style) {
const { type } = this.props;
let src;
let name;
@@ -177,9 +175,8 @@ export default class Storage extends React.PureComponent {
return (
{measure(); this._list.recomputeRowHeights(i)}}
>
{src === null ? (
@@ -188,7 +185,10 @@ export default class Storage extends React.PureComponent {
) : (
<>
{this.renderDiff(item, prevItem, i)}
-
+
>
)}
-
+
{typeof item.duration === 'number' && (
{formatMs(item.duration)}
)}
@@ -209,7 +212,7 @@ export default class Storage extends React.PureComponent {
{'JUMP'}
)}
- {i + 1 === this.props.listNow.length && i + 1 < this.props.list.length && (
+ {i + 1 === this.props.listNow.length && i + 1 < this.props.list.length && (
@@ -220,29 +223,20 @@ export default class Storage extends React.PureComponent {
);
}
- _rowRenderer({index, key, parent, style}) {
- // listNow.map((item, i) =>
- // this.renderItem(item, i, i > 0 ? listNow[i - 1] : undefined, listNowLen, listLen)
- // )
+ _rowRenderer({ index, parent, key, style }) {
const { listNow } = this.props;
- if (!listNow[index]) return console.warn(index, listNow)
+ if (!listNow[index]) return console.warn(index, listNow);
return (
-
- {({ measure }) => this.renderItem(listNow[index], index, index > 0 ? listNow[index - 1] : undefined, style, measure)}
+
+ {this.renderItem(listNow[index], index, index > 0 ? listNow[index - 1] : undefined, style)}
- )
+ );
}
render() {
- const { type, listNow, list, hintIsHidden } = this.props;
+ const { type, list, listNow, hintIsHidden } = this.props;
const showStore = type !== STORAGE_TYPES.MOBX;
return (
@@ -250,17 +244,21 @@ export default class Storage extends React.PureComponent {
{list.length > 0 && (
- {showStore &&
{'STATE'}
}
+ {showStore && (
+
+ {'STATE'}
+
+ )}
{type !== STORAGE_TYPES.ZUSTAND ? (
-
+
DIFFS
) : null}
- {getActionsName(type)}
-
-
- TTE
-
+
+ {getActionsName(type)}
+
+
+ TTE
)}
@@ -345,10 +343,10 @@ export default class Storage extends React.PureComponent {
)}
-
- {({ height, width }) => (
+
+ {({ height, width }) => (
{
+ ref={(element) => {
this._list = element;
}}
deferredMeasurementCache={this.cache}
@@ -359,8 +357,8 @@ export default class Storage extends React.PureComponent {
width={width}
height={height}
/>
- )}
-
+ )}
+