f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 22:52:40 +00:00
Code Wiki Activity

Moving mount/unmount over. Missing states and imports.

Browse Source
This commit is contained in:
Trevor Buckner
2025-08-20 16:31:12 -04:00
parent d443ecabae
commit cea342d7f6
3 changed files with 81 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
client/homebrew/pages/basePages/editPage/editPage.jsx
View File

@@ -11,6 +11,15 @@ const AccountNavItem = require('../../../navbar/account.navitem.jsx');
const RecentNavItem = require('../../../navbar/recent.navitem.jsx').both;
const VaultNavItem = require('../../../navbar/vault.navitem.jsx');
const SplitPane = require('client/components/splitPane/splitPane.jsx');
const Editor = require('../../../editor/editor.jsx');
const BrewRenderer = require('../../../brewRenderer/brewRenderer.jsx');
const { fetchThemeBundle } = require('../../../../../shared/helpers.js');
import { useEffect, useState, useRef } from 'react';
import Markdown from 'naturalcrit/markdown.js';
const BREWKEY = 'homebrewery-new';
const STYLEKEY = 'homebrewery-new-style';
const METAKEY = 'homebrewery-new-meta';
@@ -87,6 +96,39 @@ const BaseEditPage = (props)=>{
setError(null);
setIsSaving(false);
};
const save = async ()=>{
setIsSaving(true);
await props.performSave(brew, saveGoogle)
.catch((err)=>{
setError(err);
});
setIsSaving(false)
};
const handleControlKeys = (e)=>{
if(!(e.ctrlKey || e.metaKey)) return;
const S_KEY = 83;
const P_KEY = 80;
if(e.keyCode == S_KEY) save();
if(e.keyCode == P_KEY) BrewRenderer.printCurrentBrew();
if(e.keyCode == P_KEY || e.keyCode == S_KEY){
e.stopPropagation();
e.preventDefault();
}
};
useEffect(() => {
props.loadBrew?.(brew, setBrew, setSaveGoogle); //Initial load from localStorage/etc.
document.addEventListener('keydown', handleControlKeys);
return document.removeEventListener('keydown', handleControlKeys);
}, []);
useEffect(() => {
fetchThemeBundle(setError, setThemeBundle, brew.renderer, brew.theme);
}, [brew.renderer, brew.theme]);
return (
<div className={`sitePage ${props.className || ''}`}>
<Navbar>
@@ -94,7 +136,13 @@ const BaseEditPage = (props)=>{
<Nav.item className='brewTitle'>{props.brew.title}</Nav.item>
</Nav.section>
<Nav.section>
{props.navButtons}
{error
? <ErrorNavItem error={error} clearError={clearError}></ErrorNavItem>
: props.saveButton?.(save, isSaving)
}
{props.renderUniqueNav?.()}
</Nav.section>
<Nav.section>
<PrintNavItem />
<NewBrewItem />
<HelpNavItem />

61
client/homebrew/pages/homePage/homePage.jsx
View File

@@ -5,14 +5,9 @@ const cx = require('classnames');
import request from '../../utils/request-middleware.js';
const { Meta } = require('vitreum/headtags');
const Nav = require('naturalcrit/nav/nav.jsx');
const ErrorNavItem = require('../../navbar/error-navitem.jsx');
const { fetchThemeBundle } = require('../../../../shared/helpers.js');
const BaseEditPage = require('../basePages/editPage/editPage.jsx');
const SplitPane = require('client/components/splitPane/splitPane.jsx');
const Editor = require('../../editor/editor.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js');
@@ -24,58 +19,20 @@ const HomePage = createClass({
};
},
editor : React.createRef(null),
componentDidMount : function() {
fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
},
save : function(){
this.setState({
isSaving : true
});
request.post('/api')
.send(this.state.brew)
.end((err, res)=>{
if(err) {
this.setState({ error: err });
return;
}
const brew = res.body;
window.location = `/edit/${brew.editId}`;
})
.catch((err)=>{
this.setState({ isSaving: false, error: err });
save : function(brew){
return request
.post('/api')
.send(brew)
.then((res) => {
const saved = res.body;
window.location = `/edit/${saved.editId}`;
});
},
renderSaveButton : function(){
if(this.state.isSaving){
return <Nav.item icon='fas fa-spinner fa-spin' className='save'>
save...
</Nav.item>;
} else {
return <Nav.item icon='fas fa-save' className='save' onClick={this.save}>
save
</Nav.item>;
}
},
renderNavbar : function(){
return <>
<Nav.section>
{this.state.error ?
<ErrorNavItem error={this.state.error} parent={this}></ErrorNavItem> :
null
}
</Nav.section>
</>;
},
render : function(){
return <BaseEditPage
{...this.props}
className="homePage"
errorState={this.state.error}
parent={this}
performSave={this.save}
>

96
client/homebrew/pages/newPage/newPage.jsx
View File

@@ -4,24 +4,16 @@ const React = require('react');
const createClass = require('create-react-class');
import request from '../../utils/request-middleware.js';
import Markdown from 'naturalcrit/markdown.js';
const Nav = require('naturalcrit/nav/nav.jsx');
const ErrorNavItem = require('../../navbar/error-navitem.jsx');
const BaseEditPage = require('../basePages/editPage/editPage.jsx');
const SplitPane = require('client/components/splitPane/splitPane.jsx');
const Editor = require('../../editor/editor.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js');
const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpers.js');
const BREWKEY = 'homebrewery-new';
const STYLEKEY = 'homebrewery-new-style';
const METAKEY = 'homebrewery-new-meta';
let SAVEKEY;
const SAVEKEY = `HOMEBREWERY-DEFAULT-SAVE-LOCATION-${global.account?.username || ''}`;
const NewPage = createClass({
displayName : 'NewPage',
@@ -31,37 +23,24 @@ const NewPage = createClass({
};
},
editor : React.createRef(null),
componentDidMount : function() {
document.addEventListener('keydown', this.handleControlKeys);
const brew = this.state.brew;
if(!this.props.brew.shareId && typeof window !== 'undefined') { //Load from localStorage if in client browser
loadBrew : function(brew, setBrew, setSaveGoogle) {
if(!brew.shareId && typeof window !== 'undefined') { //Load from localStorage if in client browser
//TODO: Move localstorage handling to BaseEditPage?
const brewStorage = localStorage.getItem(BREWKEY);
const styleStorage = localStorage.getItem(STYLEKEY);
const metaStorage = JSON.parse(localStorage.getItem(METAKEY));
const metaStorage = JSON.parse(localStorage.getItem(METAKEY));
brew.text = brewStorage ?? brew.text;
brew.style = styleStorage ?? brew.style;
// brew.title = metaStorage?.title || this.state.brew.title;
// brew.description = metaStorage?.description || this.state.brew.description;
brew.text = brewStorage ?? brew.text;
brew.style = styleStorage ?? brew.style;
brew.renderer = metaStorage?.renderer ?? brew.renderer;
brew.theme = metaStorage?.theme ?? brew.theme;
brew.lang = metaStorage?.lang ?? brew.lang;
}
SAVEKEY = `HOMEBREWERY-DEFAULT-SAVE-LOCATION-${global.account?.username || ''}`;
const saveStorage = localStorage.getItem(SAVEKEY) || 'HOMEBREWERY';
this.setState({
brew : brew,
saveGoogle : (saveStorage == 'GOOGLE-DRIVE' && this.state.saveGoogle)
});
fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
setBrew(brew);
setSaveGoogle(saveStorage == 'GOOGLE-DRIVE' && this.state.saveGoogle);
localStorage.setItem(BREWKEY, brew.text);
if(brew.style)
@@ -71,67 +50,38 @@ const NewPage = createClass({
window.history.replaceState({}, window.location.title, '/new/');
}
},
componentWillUnmount : function() {
document.removeEventListener('keydown', this.handleControlKeys);
},
save : async function(){
this.setState({
isSaving : true
});
let brew = this.state.brew;
// Split out CSS to Style if CSS codefence exists
if(brew.text.startsWith('```css') && brew.text.indexOf('```\n\n') > 0) {
const index = brew.text.indexOf('```\n\n');
brew.style = `${brew.style ? `${brew.style}\n` : ''}${brew.text.slice(7, index - 1)}`;
brew.text = brew.text.slice(index + 5);
}
save : async function(brew, saveGoogle){
brew.pageCount=((brew.renderer=='legacy' ? brew.text.match(/\\page/g) : brew.text.match(/^\\page$/gm)) || []).length + 1;
const res = await request
.post(`/api${this.state.saveGoogle ? '?saveToGoogle=true' : ''}`)
return request
.post(`/api${saveGoogle ? '?saveToGoogle=true' : ''}`)
.send(brew)
.catch((err)=>{
this.setState({ isSaving: false, error: err });
.then((res) => {
//TODO: Move localstorage handling to BaseEditPage?
localStorage.removeItem(BREWKEY);
localStorage.removeItem(STYLEKEY);
localStorage.removeItem(METAKEY);
const saved = res.body;
window.location = `/edit/${saved.editId}`;
});
if(!res) return;
brew = res.body;
localStorage.removeItem(BREWKEY);
localStorage.removeItem(STYLEKEY);
localStorage.removeItem(METAKEY);
window.location = `/edit/${brew.editId}`;
},
renderSaveButton : function(){
if(this.state.isSaving){
renderSaveButton : function(save, isSaving){
if(isSaving){
return <Nav.item icon='fas fa-spinner fa-spin' className='save'>
save...
</Nav.item>;
} else {
return <Nav.item icon='fas fa-save' className='save' onClick={this.save}>
return <Nav.item icon='fas fa-save' className='save' onClick={save}>
save
</Nav.item>;
}
},
renderNavbar : function(){
return <>
<Nav.section>
{this.state.error ?
<ErrorNavItem error={this.state.error} parent={this}></ErrorNavItem> :
this.renderSaveButton()
}
</Nav.section>
</>;
},
render : function(){
return <BaseEditPage
{...this.props}
className="newPage"
errorState={this.state.error}
parent={this}
saveButton={this.renderSaveButton}
performSave={this.save}