- Looks like there was a problem saving.
- Report the issue
- here
- .
+
+ {message ?? 'Conflict: please refresh to get latest changes'}
;
}
-});
+
+ if(status === 412) {
+ return
+ Oops!
+
+ {message ?? 'Your client is out of date. Please save your changes elsewhere and refresh.'}
+
+ ;
+ }
+
+ if(HBErrorCode === '04') {
+ return
+ Oops!
+
+ You are no longer signed in as an author of
+ this brew! Were you signed out from a different
+ window? Visit our log in page, then try again!
+
+
+
+ Sign In
+
+
+
+ Not Now
+
+
;
+ }
+
+ if(response?.body?.errors?.[0].reason == 'storageQuotaExceeded') {
+ return
+ Oops!
+
+ Can't save because your Google Drive seems to be full!
+
+ ;
+ }
+
+ if(response?.req.url.match(/^\/api.*Google.*$/m)){
+ return
+ Oops!
+
+ Looks like your Google credentials have
+ expired! Visit our log in page to sign out
+ and sign back in with Google,
+ then try saving again!
+
+
+
+ Sign In
+
+
+
+ Not Now
+
+
;
+ }
+
+ if(HBErrorCode === '09') {
+ return
+ Oops!
+
+ Looks like there was a problem retreiving
+ the theme, or a theme that it inherits,
+ for this brew. Verify that brew
+ {response.body.brewId} still exists!
+
;
+ }
+
+ if(HBErrorCode === '10') {
+ return
+ Oops!
+
+ Looks like the brew you have selected
+ as a theme is not tagged for use as a
+ theme. Verify that
+ brew
+ {response.body.brewId} has the
meta:theme tag!
+
;
+ }
+
+ if(errorCode === 'ECONNABORTED') {
+ return
+ Oops!
+
+ The request to the server was interrupted or timed out.
+ This can happen due to a network issue, or if
+ trying to save a particularly large brew.
+ Please check your internet connection and try again.
+
+ ;
+ }
+
+ return
+ Oops!
+
+ Looks like there was a problem saving.
+ Report the issue
+ here
+ .
+
;
+};
module.exports = ErrorNavItem;
diff --git a/client/homebrew/navbar/newbrew.navitem.jsx b/client/homebrew/navbar/newbrew.navitem.jsx
index 30d53c675..ccade4e8b 100644
--- a/client/homebrew/navbar/newbrew.navitem.jsx
+++ b/client/homebrew/navbar/newbrew.navitem.jsx
@@ -5,33 +5,45 @@ const { splitTextStyleAndMetadata } = require('../../../shared/helpers.js'); //
const BREWKEY = 'homebrewery-new';
const STYLEKEY = 'homebrewery-new-style';
-const METAKEY = 'homebrewery-new-meta';
+const METAKEY = 'homebrewery-new-meta';
const NewBrew = ()=>{
const handleFileChange = (e)=>{
const file = e.target.files[0];
- if(file) {
- const reader = new FileReader();
- reader.onload = (e)=>{
- const fileContent = e.target.result;
- const newBrew = {
- text : fileContent,
- style : ''
- };
- if(fileContent.startsWith('```metadata')) {
- splitTextStyleAndMetadata(newBrew); // Modify newBrew directly
- localStorage.setItem(BREWKEY, newBrew.text);
- localStorage.setItem(STYLEKEY, newBrew.style);
- localStorage.setItem(METAKEY, JSON.stringify(_.pick(newBrew, ['title', 'description', 'tags', 'systems', 'renderer', 'theme', 'lang'])));
- window.location.href = '/new';
- } else {
- alert('This file is invalid, please, enter a valid file');
- }
- };
- reader.readAsText(file);
- }
+ if(!file) return;
+
+ const currentNew = localStorage.getItem(BREWKEY);
+ if(currentNew && !confirm(
+ `You have some text in the new brew space, if you load a file that text will be lost, are you sure you want to load the file?`
+ )) return;
+
+ const reader = new FileReader();
+ reader.onload = (e)=>{
+ const fileContent = e.target.result;
+ const newBrew = { text: fileContent, style: '' };
+
+ if(fileContent.startsWith('```metadata')) {
+ splitTextStyleAndMetadata(newBrew);
+ localStorage.setItem(BREWKEY, newBrew.text);
+ localStorage.setItem(STYLEKEY, newBrew.style);
+ localStorage.setItem(METAKEY, JSON.stringify(
+ _.pick(newBrew, ['title', 'description', 'tags', 'systems', 'renderer', 'theme', 'lang'])
+ ));
+ window.location.href = '/new';
+ return;
+ }
+
+ const type = file.name.split('.').pop().toLowerCase();
+
+ alert(`This file is invalid: ${!type ? "Missing file extension" :`.${type} files are not supported`}. Only .txt files exported from the Homebrewery are allowed.`);
+
+
+ console.log(file);
+ };
+ reader.readAsText(file);
};
+
return (
{this.setState({ error: err })}, (theme)=>{this.setState({ themeBundle: theme })}, this.props.brew.renderer, this.props.brew.theme);
document.addEventListener('keydown', this.handleControlKeys);
},
@@ -173,7 +173,7 @@ const EditPage = createClass({
handleMetaChange : function(metadata, field=undefined){
if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed
- fetchThemeBundle(this, metadata.renderer, metadata.theme);
+ fetchThemeBundle((err)=>{this.setState({ error: err })}, (theme)=>{this.setState({ themeBundle: theme })}, metadata.renderer, metadata.theme);
this.setState((prevState)=>({
brew : {
@@ -438,6 +438,13 @@ const EditPage = createClass({
return `https://www.reddit.com/r/UnearthedArcana/submit?title=${encodeURIComponent(title.toWellFormed())}&text=${encodeURIComponent(text)}`;
},
+ clearError : function(){
+ setState({
+ error : null,
+ isSaving : false
+ })
+ },
+
renderNavbar : function(){
const shareLink = this.processShareId();
@@ -449,7 +456,7 @@ const EditPage = createClass({
{this.renderGoogleDriveIcon()}
{this.state.error ?
- :
+ :
{this.renderSaveButton()}
{this.renderAutoSaveButton()}
diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx
index d03e30c91..84967b1ff 100644
--- a/client/homebrew/pages/homePage/homePage.jsx
+++ b/client/homebrew/pages/homePage/homePage.jsx
@@ -1,90 +1,91 @@
-require('./homePage.less');
-const React = require('react');
-const createClass = require('create-react-class');
-const cx = require('classnames');
-import request from '../../utils/request-middleware.js';
-const { Meta } = require('vitreum/headtags');
+import './homePage.less';
-const Nav = require('naturalcrit/nav/nav.jsx');
-const Navbar = require('../../navbar/navbar.jsx');
-const NewBrewItem = require('../../navbar/newbrew.navitem.jsx');
-const HelpNavItem = require('../../navbar/help.navitem.jsx');
-const VaultNavItem = require('../../navbar/vault.navitem.jsx');
-const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
-const AccountNavItem = require('../../navbar/account.navitem.jsx');
-const ErrorNavItem = require('../../navbar/error-navitem.jsx');
-const { fetchThemeBundle } = require('../../../../shared/helpers.js');
+import React from 'react';
+import { useEffect, useState, useRef } from 'react';
+import request from '../../utils/request-middleware.js';
+import { Meta } from 'vitreum/headtags';
-const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
-const Editor = require('../../editor/editor.jsx');
-const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
+import Nav from 'naturalcrit/nav/nav.jsx';
+import Navbar from '../../navbar/navbar.jsx';
+import NewBrewItem from '../../navbar/newbrew.navitem.jsx';
+import HelpNavItem from '../../navbar/help.navitem.jsx';
+import VaultNavItem from '../../navbar/vault.navitem.jsx';
+import { both as RecentNavItem } from '../../navbar/recent.navitem.jsx';
+import AccountNavItem from '../../navbar/account.navitem.jsx';
+import ErrorNavItem from '../../navbar/error-navitem.jsx';
+import { fetchThemeBundle } from '../../../../shared/helpers.js';
-const { DEFAULT_BREW } = require('../../../../server/brewDefaults.js');
+import SplitPane from 'client/components/splitPane/splitPane.jsx';
+import Editor from '../../editor/editor.jsx';
+import BrewRenderer from '../../brewRenderer/brewRenderer.jsx';
-const HomePage = createClass({
- displayName : 'HomePage',
- getDefaultProps : function() {
- return {
- brew : DEFAULT_BREW,
- ver : '0.0.0'
- };
- },
- getInitialState : function() {
- return {
- brew : this.props.brew,
- welcomeText : this.props.brew.text,
- error : undefined,
- currentEditorViewPageNum : 1,
- currentEditorCursorPageNum : 1,
- currentBrewRendererPageNum : 1,
- themeBundle : {}
- };
- },
+import { DEFAULT_BREW } from '../../../../server/brewDefaults.js';
- editor : React.createRef(null),
+const HomePage =(props)=>{
+ props = {
+ brew : DEFAULT_BREW,
+ ver : '0.0.0',
+ ...props
+ };
- componentDidMount : function() {
- fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
- },
+ const [brew , setBrew] = useState(props.brew);
+ const [welcomeText , setWelcomeText] = useState(props.brew.text);
+ const [error , setError] = useState(undefined);
+ const [currentEditorViewPageNum , setCurrentEditorViewPageNum] = useState(1);
+ const [currentEditorCursorPageNum, setCurrentEditorCursorPageNum] = useState(1);
+ const [currentBrewRendererPageNum, setCurrentBrewRendererPageNum] = useState(1);
+ const [themeBundle , setThemeBundle] = useState({});
+ const [isSaving , setIsSaving] = useState(false);
- handleSave : function(){
+ const editorRef = useRef(null);
+
+ useEffect(()=>{
+ fetchThemeBundle(setError, setThemeBundle, brew.renderer, brew.theme);
+ }, []);
+
+ const save = ()=>{
request.post('/api')
- .send(this.state.brew)
+ .send(brew)
.end((err, res)=>{
if(err) {
- this.setState({ error: err });
+ setError(err);
return;
}
- const brew = res.body;
- window.location = `/edit/${brew.editId}`;
+ const saved = res.body;
+ window.location = `/edit/${saved.editId}`;
});
- },
- handleSplitMove : function(){
- this.editor.current.update();
- },
+ };
- handleEditorViewPageChange : function(pageNumber){
- this.setState({ currentEditorViewPageNum: pageNumber });
- },
+ const handleSplitMove = ()=>{
+ editorRef.current.update();
+ };
- handleEditorCursorPageChange : function(pageNumber){
- this.setState({ currentEditorCursorPageNum: pageNumber });
- },
+ const handleEditorViewPageChange = (pageNumber)=>{
+ setCurrentEditorViewPageNum(pageNumber);
+ };
+
+ const handleEditorCursorPageChange = (pageNumber)=>{
+ setCurrentEditorCursorPageNum(pageNumber);
+ };
+
+ const handleBrewRendererPageChange = (pageNumber)=>{
+ setCurrentBrewRendererPageNum(pageNumber);
+ };
- handleBrewRendererPageChange : function(pageNumber){
- this.setState({ currentBrewRendererPageNum: pageNumber });
- },
+ const handleTextChange = (text)=>{
+ setBrew((prevBrew) => ({ ...prevBrew, text }));
+ };
- handleTextChange : function(text){
- this.setState((prevState)=>({
- brew : { ...prevState.brew, text: text },
- }));
- },
- renderNavbar : function(){
- return
+ const clearError = ()=>{
+ setError(null);
+ setIsSaving(false);
+ };
+
+ const renderNavbar = ()=>{
+ return
- {this.state.error ?
- :
+ {error ?
+ :
null
}
@@ -94,48 +95,48 @@ const HomePage = createClass({
;
- },
+ };
- render : function(){
- return
+ return (
+
- {this.renderNavbar()}
+ {renderNavbar()}
-
+
-
;
- }
-});
+
+ )
+};
module.exports = HomePage;
diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx
index 64fac86c0..c24128a93 100644
--- a/client/homebrew/pages/newPage/newPage.jsx
+++ b/client/homebrew/pages/newPage/newPage.jsx
@@ -14,7 +14,7 @@ const ErrorNavItem = require('../../navbar/error-navitem.jsx');
const RecentNavItem = require('../../navbar/recent.navitem.jsx').both;
const HelpNavItem = require('../../navbar/help.navitem.jsx');
-const SplitPane = require('naturalcrit/splitPane/splitPane.jsx');
+const SplitPane = require('client/components/splitPane/splitPane.jsx');
const Editor = require('../../editor/editor.jsx');
const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
@@ -80,7 +80,7 @@ const NewPage = createClass({
saveGoogle : (saveStorage == 'GOOGLE-DRIVE' && this.state.saveGoogle)
});
- fetchThemeBundle(this, this.props.brew.renderer, this.props.brew.theme);
+ fetchThemeBundle((err)=>{this.setState({ error: err })}, (theme)=>{this.setState({ themeBundle: theme })}, this.props.brew.renderer, this.props.brew.theme);
localStorage.setItem(BREWKEY, brew.text);
if(brew.style)
@@ -154,7 +154,7 @@ const NewPage = createClass({
handleMetaChange : function(metadata, field=undefined){
if(field == 'theme' || field == 'renderer') // Fetch theme bundle only if theme or renderer was changed
- fetchThemeBundle(this, metadata.renderer, metadata.theme);
+ fetchThemeBundle((err)=>{this.setState({ error: err })}, (theme)=>{this.setState({ themeBundle: theme })}, metadata.renderer, metadata.theme);
this.setState((prevState)=>({
brew : { ...prevState.brew, ...metadata },
@@ -211,6 +211,13 @@ const NewPage = createClass({
}
},
+ clearError : function(){
+ setState({
+ error : null,
+ isSaving : false
+ })
+ },
+
renderNavbar : function(){
return
@@ -220,7 +227,7 @@ const NewPage = createClass({
{this.state.error ?
- :
+ :
this.renderSaveButton()
}
diff --git a/client/homebrew/pages/sharePage/sharePage.jsx b/client/homebrew/pages/sharePage/sharePage.jsx
index e9c5540a2..50104a665 100644
--- a/client/homebrew/pages/sharePage/sharePage.jsx
+++ b/client/homebrew/pages/sharePage/sharePage.jsx
@@ -17,15 +17,11 @@ const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpe
const SharePage = (props)=>{
const { brew = DEFAULT_BREW_LOAD, disableMeta = false } = props;
- const [state, setState] = useState({
- themeBundle : {},
- currentBrewRendererPageNum : 1,
- });
+ const [themeBundle, setThemeBundle] = useState({});
+ const [currentBrewRendererPageNum, setCurrentBrewRendererPageNum] = useState(1);
const handleBrewRendererPageChange = useCallback((pageNumber)=>{
- setState((prevState)=>({
- currentBrewRendererPageNum : pageNumber,
- ...prevState }));
+ setCurrentBrewRendererPageNum(pageNumber);
}, []);
const handleControlKeys = (e)=>{
@@ -40,11 +36,7 @@ const SharePage = (props)=>{
useEffect(()=>{
document.addEventListener('keydown', handleControlKeys);
- fetchThemeBundle(
- { setState },
- brew.renderer,
- brew.theme
- );
+ fetchThemeBundle(undefined, setThemeBundle, brew.renderer, brew.theme);
return ()=>{
document.removeEventListener('keydown', handleControlKeys);
@@ -114,9 +106,9 @@ const SharePage = (props)=>{
lang={brew.lang}
renderer={brew.renderer}
theme={brew.theme}
- themeBundle={state.themeBundle}
+ themeBundle={themeBundle}
onPageChange={handleBrewRendererPageChange}
- currentBrewRendererPageNum={state.currentBrewRendererPageNum}
+ currentBrewRendererPageNum={currentBrewRendererPageNum}
allowPrint={true}
/>