0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-06 16:32:40 +00:00

use state instead

This commit is contained in:
Víctor Losada Hernández
2025-11-16 19:02:37 +01:00
parent 1d061e6d3f
commit f1891d9250

View File

@@ -58,6 +58,7 @@ const Editor = createClass({
return { return {
editorTheme : this.props.editorTheme, editorTheme : this.props.editorTheme,
view : 'text', //'text', 'style', 'meta', 'snippet' view : 'text', //'text', 'style', 'meta', 'snippet'
snippetBarHeight : 26,
}; };
}, },
@@ -88,11 +89,9 @@ const Editor = createClass({
if (!snippetBar) return; if (!snippetBar) return;
this.resizeObserver = new ResizeObserver(entries => { this.resizeObserver = new ResizeObserver(entries => {
// throttle/debounce inside if you like const height = document.querySelector('.editor > .snippetBar').offsetHeight;
const h = snippetBar.offsetHeight; this.setState({ snippetbarHeight: height });
const editor = document.querySelector('.editor .codeEditor'); console.log('setting state to ', height );
if (!editor) return;
editor.style.height = `calc(100% - ${h}px)`;
}); });
this.resizeObserver.observe(snippetBar); this.resizeObserver.observe(snippetBar);
@@ -437,6 +436,7 @@ const Editor = createClass({
}, },
renderEditor : function(){ renderEditor : function(){
console.log('state at rendering is: ',this.state.snippetBarHeight);
if(this.isText()){ if(this.isText()){
return <> return <>
<CodeEditor key='codeEditor' <CodeEditor key='codeEditor'
@@ -447,7 +447,7 @@ const Editor = createClass({
onChange={this.props.onBrewChange('text')} onChange={this.props.onBrewChange('text')}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - 26px)` }} /> style={{ height: `calc(100% - ${this.state.snippetBarHeight}px)` }} />
</>; </>;
} }
if(this.isStyle()){ if(this.isStyle()){
@@ -461,7 +461,7 @@ const Editor = createClass({
enableFolding={true} enableFolding={true}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - 26px)` }} /> style={{ height: `calc(100% - ${this.state.snippetBarHeight}px)` }} />
</>; </>;
} }
if(this.isMeta()){ if(this.isMeta()){
@@ -490,7 +490,7 @@ const Editor = createClass({
enableFolding={true} enableFolding={true}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - 26px)` }} /> style={{ height: `calc(100% -${this.state.snippetBarHeight}px)` }} />
</>; </>;
} }
}, },