0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-07 05:32:41 +00:00

Functional history menu

This commit is contained in:
G.Ambatte
2024-10-07 19:36:17 +13:00
parent 97f8493319
commit 25ce1aa00c

View File

@@ -50,8 +50,9 @@ const Snippetbar = createClass({
renderer : this.props.renderer, renderer : this.props.renderer,
themeSelector : false, themeSelector : false,
snippets : [], snippets : [],
showHistory : false,
historyExists : false, historyExists : false,
showHistory : false historyItems : []
}; };
}, },
@@ -75,6 +76,17 @@ const Snippetbar = createClass({
historyExists : checkHistoryExists historyExists : checkHistoryExists
}); });
} }
// Update history list if it has changed
const checkHistoryItems = await loadHistory(this.props.brew);
if(checkHistoryItems.some((historyItem, index)=>{
return !index < this.state.historyItems.length || historyItem != this.state.historyItems[index];
})){
this.setState({
historyItems : checkHistoryItems
});
}
}, },
mergeCustomizer : function(oldValue, newValue, key) { mergeCustomizer : function(oldValue, newValue, key) {
@@ -152,34 +164,36 @@ const Snippetbar = createClass({
return this.props.updateBrew(item); return this.props.updateBrew(item);
}, },
renderHistoryItems : async function() { toggleHistoryMenu : function(){
if(!this.state.historyExists || !this.state.showHistory) return; this.setState({
showHistory : !this.state.showHistory
});
},
const historyItems = await loadHistory(this.props.brew); renderHistoryItems : function() {
console.log('renderHistoryItems', historyItems); if(this.state.historyItems.length == 0) return;
return;
// return <div className='dropdown'> return <div className='dropdown'>
// {_.map(historyItems, (item, index)=>{ {_.map(this.state.historyItems, (item, index)=>{
// if(!item[1].savedAt) return; if(item.noData || !item.savedAt) return;
// const saveTime = new Date(item[1].savedAt); const saveTime = new Date(item.savedAt);
// const diffMs = new Date() - saveTime; const diffMs = new Date() - saveTime;
// const diffSecs = Math.floor(diffMs / 1000); const diffSecs = Math.floor(diffMs / 1000);
// let diffString = `about ${diffSecs} seconds ago`; let diffString = `about ${diffSecs} seconds ago`;
// if(diffSecs > 60) diffString = `about ${Math.floor(diffSecs / 60)} minutes ago`; if(diffSecs > 60) diffString = `about ${Math.floor(diffSecs / 60)} minutes ago`;
// if(diffSecs > (60 * 60)) diffString = `about ${Math.floor(diffSecs / (60 * 60))} hours ago`; if(diffSecs > (60 * 60)) diffString = `about ${Math.floor(diffSecs / (60 * 60))} hours ago`;
// if(diffSecs > (24 * 60 * 60)) diffString = `about ${Math.floor(diffSecs / (24 * 60 * 60))} days ago`; if(diffSecs > (24 * 60 * 60)) diffString = `about ${Math.floor(diffSecs / (24 * 60 * 60))} days ago`;
// if(diffSecs > (7 * 24 * 60 * 60)) diffString = `about ${Math.floor(diffSecs / (7 * 24 * 60 * 60))} weeks ago`; if(diffSecs > (7 * 24 * 60 * 60)) diffString = `about ${Math.floor(diffSecs / (7 * 24 * 60 * 60))} weeks ago`;
// return <div className='snippet' key={index} onClick={()=>{this.replaceContent(item);}} > return <div className='snippet' key={index} onClick={()=>{this.replaceContent(item);}} >
// <i className={`fas fa-${index+1}`} /> <i className={`fas fa-${index+1}`} />
// <span className='name' title={saveTime.toISOString()}>v{item.version} : {diffString}</span> <span className='name' title={saveTime.toISOString()}>v{item.version} : {diffString}</span>
// </div>; </div>;
// })} })}
// </div>; </div>;
}, },
renderEditorButtons : function(){ renderEditorButtons : function(){
@@ -202,9 +216,10 @@ const Snippetbar = createClass({
} }
return <div className='editors'> return <div className='editors'>
<div className={`editorTool snippetGroup history ${this.state.historyExists ? 'active' : ''}`} > <div className={`editorTool snippetGroup history ${this.state.historyExists ? 'active' : ''}`}
onClick={this.toggleHistoryMenu} >
<i className='fas fa-clock-rotate-left' /> <i className='fas fa-clock-rotate-left' />
{/* { this.renderHistoryItems() } */} { this.state.showHistory && this.renderHistoryItems() }
</div> </div>
<div className={`editorTool undo ${this.props.historySize.undo ? 'active' : ''}`} <div className={`editorTool undo ${this.props.historySize.undo ? 'active' : ''}`}
onClick={this.props.undo} > onClick={this.props.undo} >