Update changelog

update deletion to delete brews when the google brew cannot be found

changelog.md

@@ -39,7 +39,55 @@ pre {
 ## changelog
 For a full record of development, visit our [Github Page](https://github.com/naturalcrit/homebrewery).
 
-### Thursday 27/08/2022 - v3.2.0
+### Friday 08/09/2022 - v3.2.2
+{{taskList
+
+##### Jeddai:
+
+* [x] Fix brews not deleting from User page when removed from Google Drive externally.
+
+  Fixes issues: [#2325](https://github.com/naturalcrit/homebrewery/issues/2325)
+
+##### G-Ambatte:
+
+* [x] Brew Tags are now searchable on the User page
+
+Fixes issues  [#2317](https://github.com/naturalcrit/homebrewery/issues/2317), [#2319](https://github.com/naturalcrit/homebrewery/issues/2319), [#2334](https://github.com/naturalcrit/homebrewery/issues/2334)
+
+* [x] Several tweaks to the User page
+
+ Fixes issues:  [#1797](https://github.com/naturalcrit/homebrewery/issues/1797), [#2315](https://github.com/naturalcrit/homebrewery/issues/2315), [#2326](https://github.com/naturalcrit/homebrewery/issues/2326), [#2328](https://github.com/naturalcrit/homebrewery/issues/2328)
+}}
+
+### Wednesday 31/08/2022 - v3.2.1
+{{taskList
+
+##### Calculuschild
+
+* [x] Reference Links should now work inside tables
+
+	Fixes issues: [#2307](https://github.com/naturalcrit/homebrewery/issues/2307)
+
+##### Jeddai:
+
+* [x] Fix printing from `/new` not working
+
+  Fixes issues: [#1789](https://github.com/naturalcrit/homebrewery/issues/1789), [#1806](https://github.com/naturalcrit/homebrewery/issues/1806)
+
+* [x] Fix broken snippet buttons on `/new`
+
+  Fixes issues: [#2311](https://github.com/naturalcrit/homebrewery/issues/2311)
+
+##### G-Ambatte:
+
+* [x] Several small tweaks to the User page
+
+  Fixes issues: [#2301](https://github.com/naturalcrit/homebrewery/issues/2301), [#2303](https://github.com/naturalcrit/homebrewery/issues/2303), [#2121](https://github.com/naturalcrit/homebrewery/issues/2121)
+}}
+
+\page
+
+### Saturday 27/08/2022 - v3.2.0
 {{taskList
 
 ##### Calculuschild

client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx

@@ -95,6 +95,9 @@ const BrewItem = createClass({
 
 	render : function(){
 		const brew = this.props.brew;
+		if(Array.isArray(brew.tags)) {               // temporary fix until dud tags are cleaned
+			brew.tags = brew.tags?.filter(tag => tag); //remove tags that are empty strings
+		}
 		const dateFormatString = 'YYYY-MM-DD HH:mm:ss';
 
 		return <div className='brewItem'>
@@ -104,6 +107,17 @@ const BrewItem = createClass({
 			</div>
 			<hr />
 			<div className='info'>
+
+				{brew.tags?.length ? <>
+					<div className='brewTags' title={`Tags:\n${brew.tags.join('\n')}`}>
+						<i className='fas fa-tags'/>
+						{brew.tags.map((tag, idx)=>{
+							let matches = tag.match(/^(?:([^:]+):)?([^:]+)$/);
+							return <span className={matches[1]}>{matches[2]}</span>;
+						})}
+					</div>
+				</> : <></>
+				}
 				<span title={`Authors:\n${brew.authors?.join('\n')}`}>
 					<i className='fas fa-user'/> {brew.authors?.join(', ')}
 				</span>

client/homebrew/pages/basePages/listPage/brewItem/brewItem.less

@@ -29,13 +29,23 @@
 	.info{
 		position: initial;
 		bottom: 2px;
-		font-family : ScalySans;
+		font-family : ScalySansRemake;
 		font-size   : 1.2em;
 		&>span{
 			margin-right : 12px;
 			line-height  : 1.5em;
 		}
 	}
+	.brewTags span {
+		background-color: #c8ac6e3b;
+		margin: 2px;
+		padding: 2px;
+		border: 1px solid #c8ac6e;
+		border-radius: 4px;
+		white-space: nowrap;
+		display: inline-block;
+		font-weight: bold;
+	}
 	&:hover{
 		.links{
 			opacity : 1;

client/homebrew/pages/basePages/listPage/listPage.jsx

@@ -1,3 +1,4 @@
+/*eslint max-lines: ["warn", {"max": 300, "skipBlankLines": true, "skipComments": true}]*/
 require('./listPage.less');
 const React       = require('react');
 const createClass = require('create-react-class');
@@ -6,6 +7,11 @@ const moment      = require('moment');
 
 const BrewItem    = require('./brewItem/brewItem.jsx');
 
+const USERPAGE_KEY_PREFIX = 'HOMEBREWERY-LISTPAGE';
+
+const DEFAULT_SORT_TYPE = 'alpha';
+const DEFAULT_SORT_DIR = 'asc';
+
 const ListPage = createClass({
 	displayName     : 'ListPage',
 	getDefaultProps : function() {
@@ -21,14 +27,56 @@ const ListPage = createClass({
 		};
 	},
 	getInitialState : function() {
+		// HIDE ALL GROUPS UNTIL LOADED
+		const brewCollection = this.props.brewCollection.map((brewGroup)=>{
+			brewGroup.visible = false;
+			return brewGroup;
+		});
+
 		return {
-			sortType     : 'alpha',
-			sortDir      : 'asc',
-			filterString : this.props.query?.filter || '',
-			query        : this.props.query
+			filterString   : this.props.query?.filter || '',
+			sortType       : this.props.query?.sort || null,
+			sortDir        : this.props.query?.dir || null,
+			query          : this.props.query,
+			brewCollection : brewCollection
 		};
 	},
 
+	componentDidMount : function() {
+		// SAVE TO LOCAL STORAGE WHEN LEAVING PAGE
+		window.onbeforeunload = this.saveToLocalStorage;
+
+		// LOAD FROM LOCAL STORAGE
+		if(typeof window !== 'undefined') {
+			const newSortType = (this.state.sortType ?? (localStorage.getItem(`${USERPAGE_KEY_PREFIX}-SORTTYPE`) || DEFAULT_SORT_TYPE));
+			const newSortDir = (this.state.sortDir ?? (localStorage.getItem(`${USERPAGE_KEY_PREFIX}-SORTDIR`) || DEFAULT_SORT_DIR));
+			this.updateUrl(this.state.filterString, newSortType, newSortDir);
+
+			const brewCollection = this.props.brewCollection.map((brewGroup)=>{
+				brewGroup.visible = (localStorage.getItem(`${USERPAGE_KEY_PREFIX}-VISIBILITY-${brewGroup.class}`) ?? 'true')=='true';
+				return brewGroup;
+			});
+
+			this.setState({
+				brewCollection : brewCollection,
+				sortType       : newSortType,
+				sortDir        : newSortDir
+			});
+		};
+	},
+
+	componentWillUnmount : function() {
+		window.onbeforeunload = function(){};
+	},
+
+	saveToLocalStorage : function() {
+		this.state.brewCollection.map((brewGroup)=>{
+			localStorage.setItem(`${USERPAGE_KEY_PREFIX}-VISIBILITY-${brewGroup.class}`, `${brewGroup.visible}`);
+		});
+		localStorage.setItem(`${USERPAGE_KEY_PREFIX}-SORTTYPE`, this.state.sortType);
+		localStorage.setItem(`${USERPAGE_KEY_PREFIX}-SORTDIR`, this.state.sortDir);
+	},
+
 	renderBrews : function(brews){
 		if(!brews || !brews.length) return <div className='noBrews'>No Brews.</div>;
 
@@ -50,14 +98,18 @@ const ListPage = createClass({
 	},
 
 	handleSortOptionChange : function(event){
+		this.updateUrl(this.state.filterString, event.target.value, this.state.sortDir);
 		this.setState({
 			sortType : event.target.value
 		});
 	},
 
 	handleSortDirChange : function(event){
+		const newDir = this.state.sortDir == 'asc' ? 'desc' : 'asc';
+
+		this.updateUrl(this.state.filterString, this.state.sortType, newDir);
 		this.setState({
-			sortDir : `${(this.state.sortDir == 'asc' ? 'desc' : 'asc')}`
+			sortDir : newDir
 		});
 	},
 
@@ -77,19 +129,22 @@ const ListPage = createClass({
 		this.setState({
 			filterString : e.target.value,
 		});
-		this.updateUrl(e.target.value);
+		this.updateUrl(e.target.value, this.state.sortType, this.state.sortDir);
 		return;
 	},
 
-	updateUrl : function(filterTerm){
+	updateUrl : function(filterTerm, sortType, sortDir){
 		const url = new URL(window.location.href);
 		const urlParams = new URLSearchParams(url.search);
-		if(urlParams.get('filter') == filterTerm)
-			return;
+
+		urlParams.set('sort', sortType);
+		urlParams.set('dir', sortDir);
+
 		if(!filterTerm)
 			urlParams.delete('filter');
 		else
 			urlParams.set('filter', filterTerm);
+
 		url.search = urlParams;
 		window.history.replaceState(null, null, url);
 	},
@@ -141,19 +196,35 @@ const ListPage = createClass({
 
 	getSortedBrews : function(brews){
 		const testString = _.deburr(this.state.filterString).toLowerCase();
-		brews = _.filter(brews, (brew)=>{
-			return (_.deburr(brew.title).toLowerCase().includes(testString)) ||
-			(_.deburr(brew.description).toLowerCase().includes(testString));
-		});
 
+		brews = _.filter(brews, (brew)=>{
+			const brewStrings = _.deburr([
+				brew.title,
+				brew.description,
+				brew.tags].join('\n')
+				.toLowerCase());
+
+			return brewStrings.includes(testString);
+		});
 		return _.orderBy(brews, (brew)=>{ return this.sortBrewOrder(brew); }, this.state.sortDir);
 	},
 
+	toggleBrewCollectionState : function(brewGroupClass) {
+		this.setState((prevState)=>({
+			brewCollection : prevState.brewCollection.map(
+				(brewGroup)=>brewGroup.class === brewGroupClass ? { ...brewGroup, visible: !brewGroup.visible } : brewGroup
+			)
+		}));
+	},
+
 	renderBrewCollection : function(brewCollection){
+		if(brewCollection == []) return <div className='brewCollection'>
+			<h1>No Brews</h1>
+		</div>;
 		return _.map(brewCollection, (brewGroup, idx)=>{
 			return <div key={idx} className={`brewCollection ${brewGroup.class ?? ''}`}>
-				<h1>{brewGroup.title || 'No Title'}</h1>
-				{this.renderBrews(this.getSortedBrews(brewGroup.brews))}
+				<h1 className={brewGroup.visible ? 'active' : 'inactive'} onClick={()=>{this.toggleBrewCollectionState(brewGroup.class);}}>{brewGroup.title || 'No Title'}</h1>
+				{brewGroup.visible ? this.renderBrews(this.getSortedBrews(brewGroup.brews)) : <></>}
 			</div>;
 		});
 	},
@@ -166,7 +237,7 @@ const ListPage = createClass({
 			<div className='content V3'>
 				<div className='phb page'>
 					{this.renderSortOptions()}
-					{this.renderBrewCollection(this.props.brewCollection)}
+					{this.renderBrewCollection(this.state.brewCollection)}
 				</div>
 			</div>
 		</div>;

client/homebrew/pages/basePages/listPage/listPage.less

@@ -74,4 +74,26 @@
 			}
 		}
 	}
+	h1 {
+		cursor: pointer;
+		&.active {
+			color: #58180D;
+		}
+		&.inactive {
+			color: #707070;
+			
+		}
+		&.active::before, &.inactive::before {
+			font-family: 'Font Awesome 5 Free';
+			font-weight: 900;
+			font-size: 0.6cm;
+    			padding-right: 0.5em;
+		}
+		&.active::before {
+			content: '\f107';
+		}
+		&.inactive::before {
+			content: '\f105';
+		}
+	}
 }

client/homebrew/pages/newPage/newPage.jsx

@@ -27,41 +27,30 @@ const NewPage = createClass({
 	getDefaultProps : function() {
 		return {
 			brew : {
-				text      : '',
-				style     : undefined,
-				shareId   : null,
-				editId    : null,
-				createdAt : null,
-				updatedAt : null,
-				gDrive    : false,
-
+				text        : '',
+				style       : undefined,
 				title       : '',
 				description : '',
-				tags        : '',
-				published   : false,
-				authors     : [],
-				systems     : []
+				renderer    : 'V3'
 			}
 		};
 	},
 
 	getInitialState : function() {
-		const brew = this.props.brew;
+		let brew = this.props.brew;
+
+		if(this.props.brew.shareId) {
+			brew = {
+				text        : brew.text        ?? '',
+				style       : brew.style       ?? undefined,
+				title       : brew.title       ?? '',
+				description : brew.description ?? '',
+				renderer    : brew.renderer    ?? 'legacy'
+			};
+		}
 
 		return {
-			brew : {
-				text        : brew.text || '',
-				style       : brew.style || undefined,
-				gDrive      : false,
-				title       : brew.title || '',
-				description : brew.description || '',
-				tags        : brew.tags || '',
-				published   : false,
-				authors     : [],
-				systems     : brew.systems || [],
-				renderer    : brew.renderer || 'V3'
-			},
-
+			brew       : brew,
 			isSaving   : false,
 			saveGoogle : (global.account && global.account.googleId ? true : false),
 			errors     : null,
@@ -72,29 +61,27 @@ const NewPage = createClass({
 	componentDidMount : function() {
 		document.addEventListener('keydown', this.handleControlKeys);
 
-		const brew = this.props.brew;
+		const brew = this.state.brew;
 
-		if(typeof window !== 'undefined') { //Load from localStorage if in client browser
+		if(!this.props.brew.shareId && typeof window !== 'undefined') { //Load from localStorage if in client browser
 			const brewStorage  = localStorage.getItem(BREWKEY);
 			const styleStorage = localStorage.getItem(STYLEKEY);
 			const metaStorage = JSON.parse(localStorage.getItem(METAKEY));
 
-			if(!brew.text || !brew.style){
-				brew.text = brew.text  || (brewStorage  ?? '');
-				brew.style = brew.style || (styleStorage ?? undefined);
-				// brew.title = metaStorage?.title || this.state.brew.title;
-				// brew.description = metaStorage?.description || this.state.brew.description;
-				brew.renderer = brew.renderer || metaStorage?.renderer;
+			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.renderer = metaStorage?.renderer ?? brew.renderer;
 
-				this.setState({
-					brew : brew
-				});
-			}
+			this.setState({
+				brew : brew
+			});
 		}
 
 		localStorage.setItem(BREWKEY, brew.text);
 		localStorage.setItem(STYLEKEY, brew.style);
-		localStorage.setItem(METAKEY, JSON.stringify({'renderer' : brew.renderer}));
+		localStorage.setItem(METAKEY, JSON.stringify({ 'renderer': brew.renderer }));
 	},
 	componentWillUnmount : function() {
 		document.removeEventListener('keydown', this.handleControlKeys);

client/homebrew/pages/userPage/userPage.jsx

@@ -23,7 +23,7 @@ const UserPage = createClass({
 		};
 	},
 	getInitialState : function() {
-		const usernameWithS = this.props.username + (this.props.username.endsWith('s') ? `'` : `'s`);
+		const usernameWithS = this.props.username + (this.props.username.endsWith('s') ? `’` : `’s`);
 
 		const brews = _.groupBy(this.props.brews, (brew)=>{
 			return (brew.published ? 'published' : 'private');

package.json

@@ -1,7 +1,7 @@
 {
   "name": "homebrewery",
   "description": "Create authentic looking D&D homebrews using only markdown",
-  "version": "3.2.1",
+  "version": "3.2.2",
   "engines": {
     "node": "16.11.x"
   },
@@ -51,9 +51,9 @@
     ]
   },
   "dependencies": {
-    "@babel/core": "^7.18.13",
+    "@babel/core": "^7.19.0",
     "@babel/plugin-transform-runtime": "^7.18.10",
-    "@babel/preset-env": "^7.18.10",
+    "@babel/preset-env": "^7.19.0",
     "@babel/preset-react": "^7.18.6",
     "body-parser": "^1.20.0",
     "classnames": "^2.3.1",
@@ -74,7 +74,7 @@
     "marked-extended-tables": "^1.0.5",
     "markedLegacy": "npm:marked@^0.3.19",
     "moment": "^2.29.4",
-    "mongoose": "^6.5.4",
+    "mongoose": "^6.5.5",
     "nanoid": "3.3.4",
     "nconf": "^0.12.0",
     "react": "^16.14.0",
@@ -87,8 +87,8 @@
   },
   "devDependencies": {
     "eslint": "^8.23.0",
-    "eslint-plugin-react": "^7.31.1",
-    "jest": "^29.0.1",
+    "eslint-plugin-react": "^7.31.7",
+    "jest": "^29.0.2",
     "supertest": "^6.2.4"
   }
 }

server/homebrew.api.js

@@ -15,17 +15,24 @@ const { nanoid } = require('nanoid');
 // 	});
 // };
 
+const getId = (req)=>{
+	// Set the id and initial potential google id, where the google id is present on the existing brew.
+	let id = req.params.id, googleId = req.body?.googleId;
+
+	// If the id is longer than 12, then it's a google id + the edit id. This splits the longer id up.
+	if(id.length > 12) {
+		googleId = id.slice(0, -12);
+		id = id.slice(-12);
+	}
+	return { id, googleId };
+};
+
 const getBrew = (accessType)=>{
 	// Create middleware with the accessType passed in as part of the scope
 	return async (req, res, next)=>{
-		// Set the id and initial potential google id, where the google id is present on the existing brew.
-		let id = req.params.id, googleId = req.body?.googleId;
+		// Get relevant IDs for the brew
+		const { id, googleId } = getId(req);
 
-		// If the id is longer than 12, then it's a google id + the edit id. This splits the longer id up.
-		if(id.length > 12) {
-			googleId = id.slice(0, -12);
-			id = id.slice(-12);
-		}
 		// Try to find the document in the Homebrewery database -- if it doesn't exist, that's fine.
 		let stub = await HomebrewModel.get(accessType === 'edit' ? { editId: id } : { shareId: id })
 			.catch((err)=>{
@@ -259,7 +266,17 @@ const deleteGoogleBrew = async (account, id, editId, res)=>{
 	return true;
 };
 
-const deleteBrew = async (req, res)=>{
+const deleteBrew = async (req, res, next)=>{
+	// Delete an orphaned stub if its Google brew doesn't exist
+	try {
+		await getBrew('edit')(req, res, ()=>{});
+	} catch (err) {
+		const { id, googleId } = getId(req);
+		console.warn(`No google brew found for id ${googleId}, the stub with id ${id} will be deleted.`);
+		await HomebrewModel.deleteOne({ editId: id });
+		return next();
+	}
+
 	let brew = req.brew;
 	const { googleId, editId } = brew;
 	const account = req.account;
@@ -312,8 +329,8 @@ const deleteBrew = async (req, res)=>{
 router.post('/api', asyncHandler(newBrew));
 router.put('/api/:id', asyncHandler(getBrew('edit')), asyncHandler(updateBrew));
 router.put('/api/update/:id', asyncHandler(getBrew('edit')), asyncHandler(updateBrew));
-router.delete('/api/:id', asyncHandler(getBrew('edit')), asyncHandler(deleteBrew));
-router.get('/api/remove/:id', asyncHandler(getBrew('edit')), asyncHandler(deleteBrew));
+router.delete('/api/:id', asyncHandler(deleteBrew));
+router.get('/api/remove/:id', asyncHandler(deleteBrew));
 
 module.exports = {
 	homebrewApi : router,