73 lines
1.6 KiB
JavaScript
73 lines
1.6 KiB
JavaScript
import React, { Component } from "react";
|
|
import PropTypes from "prop-types";
|
|
import { connect } from "react-redux";
|
|
import { workspaceName } from "../../actions/workspaceActions";
|
|
import SaveIcon from "../CodeEditor/SaveIcon";
|
|
|
|
const resetTimeout = (id, newID) => {
|
|
clearTimeout(id);
|
|
return newID;
|
|
};
|
|
|
|
class AutoSave extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
timeout: null,
|
|
value: "",
|
|
saved: false,
|
|
autosave: false,
|
|
};
|
|
}
|
|
|
|
editValue = (value) => {
|
|
this.setState({
|
|
timeout: resetTimeout(
|
|
this.state.timeout,
|
|
setTimeout(this.saveValue, 400)
|
|
),
|
|
value: value,
|
|
});
|
|
};
|
|
|
|
saveValue = () => {
|
|
this.setState({ ...this.state, saved: true });
|
|
localStorage.setItem("autoSaveXML", this.props.xml);
|
|
setTimeout(() => this.setState({ ...this.state, saved: false }), 1000);
|
|
};
|
|
|
|
componentDidMount() {
|
|
console.log(this.props.xml);
|
|
}
|
|
|
|
componentDidUpdate(prevProps) {
|
|
if (prevProps.xml !== this.props.xml) {
|
|
this.editValue(this.props.xml);
|
|
}
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<SaveIcon loading={this.state.saved} autosave={this.props.autosave} />
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
AutoSave.propTypes = {
|
|
xml: PropTypes.string.isRequired,
|
|
name: PropTypes.string,
|
|
workspaceName: PropTypes.func.isRequired,
|
|
setAutosave: PropTypes.func.isRequired,
|
|
autosave: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
const mapStateToProps = (state) => ({
|
|
auto: state.general.autosave,
|
|
xml: state.workspace.code.xml,
|
|
name: state.workspace.name,
|
|
});
|
|
|
|
export default connect(mapStateToProps, { workspaceName })(AutoSave);
|