Web: Files: Remove color flicker loader on instant restoration of history.
This commit is contained in:
parent
cc9857c904
commit
ac0e803072
@ -16,6 +16,7 @@ class SectionBodyContent extends React.Component {
|
|||||||
};
|
};
|
||||||
this.listKey = 0;
|
this.listKey = 0;
|
||||||
this.listRef = React.createRef();
|
this.listRef = React.createRef();
|
||||||
|
this.timerId = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
@ -34,10 +35,26 @@ class SectionBodyContent extends React.Component {
|
|||||||
fetchFileVersions(fileId).then(() => setIsLoading(false));
|
fetchFileVersions(fileId).then(() => setIsLoading(false));
|
||||||
};
|
};
|
||||||
|
|
||||||
onSetRestoreProcess = (isRestoreProcess) => {
|
onSetRestoreProcess = (restoring) => {
|
||||||
|
const { isRestoreProcess } = this.state;
|
||||||
|
|
||||||
|
if (restoring) {
|
||||||
|
this.timerId = setTimeout(
|
||||||
|
() =>
|
||||||
this.setState({
|
this.setState({
|
||||||
isRestoreProcess,
|
isRestoreProcess: restoring,
|
||||||
|
}),
|
||||||
|
100
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
clearTimeout(this.timerId);
|
||||||
|
this.timerId = null;
|
||||||
|
|
||||||
|
restoring !== isRestoreProcess &&
|
||||||
|
this.setState({
|
||||||
|
isRestoreProcess: restoring,
|
||||||
});
|
});
|
||||||
|
}
|
||||||
};
|
};
|
||||||
onUpdateHeight = (i, itemHeight) => {
|
onUpdateHeight = (i, itemHeight) => {
|
||||||
if (this.listRef.current) {
|
if (this.listRef.current) {
|
||||||
@ -85,6 +102,7 @@ class SectionBodyContent extends React.Component {
|
|||||||
const { versions, isLoading } = this.props;
|
const { versions, isLoading } = this.props;
|
||||||
|
|
||||||
const renderList = ({ height, width }) => {
|
const renderList = ({ height, width }) => {
|
||||||
|
console.log("this.state", this.state);
|
||||||
return (
|
return (
|
||||||
<StyledVersionList isRestoreProcess={this.state.isRestoreProcess}>
|
<StyledVersionList isRestoreProcess={this.state.isRestoreProcess}>
|
||||||
<List
|
<List
|
||||||
|
@ -7,6 +7,7 @@ class VersionHistoryStore {
|
|||||||
versions = null;
|
versions = null;
|
||||||
filesStore = null;
|
filesStore = null;
|
||||||
showProgressBar = false;
|
showProgressBar = false;
|
||||||
|
timerId = null;
|
||||||
|
|
||||||
constructor(filesStore) {
|
constructor(filesStore) {
|
||||||
makeObservable(this, {
|
makeObservable(this, {
|
||||||
@ -79,7 +80,7 @@ class VersionHistoryStore {
|
|||||||
};
|
};
|
||||||
|
|
||||||
restoreVersion = (id, version) => {
|
restoreVersion = (id, version) => {
|
||||||
this.setShowProgressBar(true);
|
this.timerId = setTimeout(() => this.setShowProgressBar(true), 100);
|
||||||
|
|
||||||
return api.files
|
return api.files
|
||||||
.versionRestore(id, version)
|
.versionRestore(id, version)
|
||||||
@ -87,9 +88,13 @@ class VersionHistoryStore {
|
|||||||
const updatedVersions = this.versions.slice();
|
const updatedVersions = this.versions.slice();
|
||||||
updatedVersions.splice(1, 0, newVersion);
|
updatedVersions.splice(1, 0, newVersion);
|
||||||
this.setVerHistoryFileVersions(updatedVersions);
|
this.setVerHistoryFileVersions(updatedVersions);
|
||||||
this.setShowProgressBar(false);
|
|
||||||
})
|
})
|
||||||
.catch(() => this.setShowProgressBar(false));
|
.catch((e) => console.error(e))
|
||||||
|
.finally(() => {
|
||||||
|
clearTimeout(this.timerId);
|
||||||
|
this.timerId = null;
|
||||||
|
this.setShowProgressBar(false);
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
updateCommentVersion = (id, comment, version) => {
|
updateCommentVersion = (id, comment, version) => {
|
||||||
|
Loading…
Reference in New Issue
Block a user