Merge branch 'fixVarNameAsParam-#3622' of https://github.com/G-Ambatte/homebrewery into fixVarNameAsParam-#3622

client/homebrew/editor/editor.jsx

@@ -367,7 +367,7 @@ const Editor = createClass({
 					view={this.state.view}
 					value={this.props.brew.style ?? DEFAULT_STYLE_TEXT}
 					onChange={this.props.onStyleChange}
-					enableFolding={false}
+					enableFolding={true}
 					editorTheme={this.state.editorTheme}
 					rerenderParent={this.rerenderParent} />
 			</>;

client/homebrew/homebrew.jsx

@@ -71,9 +71,9 @@ const Homebrew = createClass({
 						<Route path='/new/:id' element={<WithRoute el={NewPage} brew={this.props.brew} userThemes={this.props.userThemes}/>} />
 						<Route path='/new' element={<WithRoute el={NewPage} userThemes={this.props.userThemes}/> } />
 						<Route path='/user/:username' element={<WithRoute el={UserPage} brews={this.props.brews} />} />
-						<Route path='/changelog' element={<WithRoute el={SharePage} brew={this.props.brew} />} />
-						<Route path='/faq' element={<WithRoute el={SharePage} brew={this.props.brew} />} />
-						<Route path='/migrate' element={<WithRoute el={SharePage} brew={this.props.brew} />} />
+						<Route path='/changelog' element={<WithRoute el={SharePage} brew={this.props.brew} disableMeta={true} />} />
+						<Route path='/faq' element={<WithRoute el={SharePage} brew={this.props.brew} disableMeta={true} />} />
+						<Route path='/migrate' element={<WithRoute el={SharePage} brew={this.props.brew} disableMeta={true} />} />
 						<Route path='/account' element={<WithRoute el={AccountPage} brew={this.props.brew} accountDetails={this.props.brew.accountDetails} />} />
 						<Route path='/legacy' element={<WithRoute el={HomePage} brew={this.props.brew} />} />
 						<Route path='/error' element={<WithRoute el={ErrorPage} brew={this.props.brew} />} />

client/homebrew/pages/sharePage/sharePage.jsx

@@ -18,7 +18,8 @@ const SharePage = createClass({
 	displayName     : 'SharePage',
 	getDefaultProps : function() {
 		return {
-			brew : DEFAULT_BREW_LOAD,
+			brew        : DEFAULT_BREW_LOAD,
+			disableMeta : false
 		};
 	},
 
@@ -68,13 +69,21 @@ const SharePage = createClass({
 	},
 
 	render : function(){
+		const titleStyle = this.props.disableMeta ? { cursor: 'default' } : {};
+		const titleEl = <Nav.item className='brewTitle' style={titleStyle}>{this.props.brew.title}</Nav.item>;
+
 		return <div className='sharePage sitePage'>
 			<Meta name='robots' content='noindex, nofollow' />
 			<Navbar>
 				<Nav.section className='titleSection'>
-					<MetadataNav brew={this.props.brew}>
-						<Nav.item className='brewTitle'>{this.props.brew.title}</Nav.item>
-					</MetadataNav>
+					{
+						this.props.disableMeta ?
+							titleEl
+							:
+							<MetadataNav brew={this.props.brew}>
+								{titleEl}
+							</MetadataNav>
+					}
 				</Nav.section>
 
 				<Nav.section>

package-lock.json

@@ -32,7 +32,7 @@
         "less": "^3.13.1",
         "lodash": "^4.17.21",
         "marked": "11.2.0",
-        "marked-emoji": "^1.4.1",
+        "marked-emoji": "^1.4.2",
         "marked-extended-tables": "^1.0.8",
         "marked-gfm-heading-id": "^3.2.0",
         "marked-smartypants-lite": "^1.0.2",
@@ -52,7 +52,7 @@
       "devDependencies": {
         "@stylistic/stylelint-plugin": "^3.0.0",
         "eslint": "^8.57.0",
-        "eslint-plugin-jest": "^28.6.0",
+        "eslint-plugin-jest": "^28.8.0",
         "eslint-plugin-react": "^7.35.0",
         "jest": "^29.7.0",
         "jest-expect-message": "^1.1.3",
@@ -5907,19 +5907,18 @@
       }
     },
     "node_modules/eslint-plugin-jest": {
-      "version": "28.6.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-jest/-/eslint-plugin-jest-28.6.0.tgz",
-      "integrity": "sha512-YG28E1/MIKwnz+e2H7VwYPzHUYU4aMa19w0yGcwXnnmJH6EfgHahTJ2un3IyraUxNfnz/KUhJAFXNNwWPo12tg==",
+      "version": "28.8.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-jest/-/eslint-plugin-jest-28.8.0.tgz",
+      "integrity": "sha512-Tubj1hooFxCl52G4qQu0edzV/+EZzPUeN8p2NnW5uu4fbDs+Yo7+qDVDc4/oG3FbCqEBmu/OC3LSsyiU22oghw==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/utils": "^6.0.0 || ^7.0.0"
+        "@typescript-eslint/utils": "^6.0.0 || ^7.0.0 || ^8.0.0"
       },
       "engines": {
         "node": "^16.10.0 || ^18.12.0 || >=20.0.0"
       },
       "peerDependencies": {
-        "@typescript-eslint/eslint-plugin": "^6.0.0 || ^7.0.0",
+        "@typescript-eslint/eslint-plugin": "^6.0.0 || ^7.0.0 || ^8.0.0",
         "eslint": "^7.0.0 || ^8.0.0 || ^9.0.0",
         "jest": "*"
       },
@@ -10456,12 +10455,11 @@
       }
     },
     "node_modules/marked-emoji": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/marked-emoji/-/marked-emoji-1.4.1.tgz",
-      "integrity": "sha512-3xHWQn8XD1LyhMpHxWpHTDWBZ9bpXLlW8JIqvyXTO6he7okKIB/W9fD/3fTg0DQuZlSQvPZ6Ub5hN6Rnmn7j9g==",
-      "license": "MIT",
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/marked-emoji/-/marked-emoji-1.4.2.tgz",
+      "integrity": "sha512-2sP+bp2z76dwbILzQ7ijy2PyjjAJR3iAZCzaNGThD2UijFUBeidkn6MoCdX/j47tPIcWt9nwnjqRQPd01ZrfdA==",
       "peerDependencies": {
-        "marked": ">=4 <14"
+        "marked": ">=4 <15"
       }
     },
     "node_modules/marked-extended-tables": {

package.json

@@ -105,7 +105,7 @@
     "less": "^3.13.1",
     "lodash": "^4.17.21",
     "marked": "11.2.0",
-    "marked-emoji": "^1.4.1",
+    "marked-emoji": "^1.4.2",
     "marked-extended-tables": "^1.0.8",
     "marked-gfm-heading-id": "^3.2.0",
     "marked-smartypants-lite": "^1.0.2",
@@ -125,7 +125,7 @@
   "devDependencies": {
     "@stylistic/stylelint-plugin": "^3.0.0",
     "eslint": "^8.57.0",
-    "eslint-plugin-jest": "^28.6.0",
+    "eslint-plugin-jest": "^28.8.0",
     "eslint-plugin-react": "^7.35.0",
     "jest": "^29.7.0",
     "jest-expect-message": "^1.1.3",

shared/naturalcrit/codeEditor/codeEditor.jsx

@@ -39,8 +39,10 @@ if(typeof window !== 'undefined'){
 	//Autocompletion
 	require('codemirror/addon/hint/show-hint.js');
 
-	const foldCode = require('./fold-code');
-	foldCode.registerHomebreweryHelper(CodeMirror);
+	const foldPagesCode = require('./fold-pages');
+	foldPagesCode.registerHomebreweryHelper(CodeMirror);
+	const foldCSSCode = require('./fold-css');
+	foldCSSCode.registerHomebreweryHelper(CodeMirror);
 }
 
 const CodeEditor = createClass({
@@ -411,11 +413,11 @@ const CodeEditor = createClass({
 	foldOptions : function(cm){
 		return {
 			scanUp      : true,
-			rangeFinder : CodeMirror.fold.homebrewery,
+			rangeFinder : this.props.language === 'css' ? CodeMirror.fold.homebrewerycss : CodeMirror.fold.homebrewery,
 			widget      : (from, to)=>{
 				let text = '';
 				let currentLine = from.line;
-				const maxLength = 50;
+				let maxLength = 50;
 
 				let foldPreviewText = '';
 				while (currentLine <= to.line && text.length <= maxLength) {
@@ -430,10 +432,15 @@ const CodeEditor = createClass({
 					}
 				}
 				text = foldPreviewText || `Lines ${from.line+1}-${to.line+1}`;
+				text = text.replace('{', '').trim();
+
+				// Truncate data URLs at `data:`
+				const startOfData = text.indexOf('data:');
+				if(startOfData > 0)
+					maxLength = Math.min(startOfData + 5, maxLength);
 
-				text = text.trim();
 				if(text.length > maxLength)
-					text = `${text.substr(0, maxLength)}...`;
+					text = `${text.slice(0, maxLength)}...`;
 
 				return `\u21A4 ${text} \u21A6`;
 			}
@@ -450,3 +457,4 @@ const CodeEditor = createClass({
 });
 
 module.exports = CodeEditor;
+

shared/naturalcrit/codeEditor/fold-css.js

@@ -0,0 +1,44 @@
+module.exports = {
+	registerHomebreweryHelper : function(CodeMirror) {
+		CodeMirror.registerHelper('fold', 'homebrewerycss', function(cm, start) {
+
+			// BRACE FOLDING
+			const startMatcher = /\{[ \t]*$/;
+			const endMatcher = /\}[ \t]*$/;
+			const activeLine = cm.getLine(start.line);
+
+
+			if(activeLine.match(startMatcher)) {
+				const lastLineNo = cm.lastLine();
+				let end = start.line + 1;
+				let braceCount = 1;
+
+				while (end < lastLineNo) {
+					const curLine = cm.getLine(end);
+					if(curLine.match(startMatcher)) braceCount++;
+					if(curLine.match(endMatcher)) braceCount--;
+					if(braceCount == 0) break;
+					++end;
+				}
+
+				return {
+					from : CodeMirror.Pos(start.line, 0),
+					to   : CodeMirror.Pos(end, cm.getLine(end).length)
+				};
+			}
+
+			// @import and data-url folding
+			const importMatcher  = /^@import.*?;/;
+			const dataURLMatcher = /url\(.*?data\:.*\)/;
+
+			if(activeLine.match(importMatcher) || activeLine.match(dataURLMatcher)) {
+				return {
+					from : CodeMirror.Pos(start.line, 0),
+					to   : CodeMirror.Pos(start.line, activeLine.length)
+				};
+			}
+
+			return null;
+		});
+	}
+};

themes/V3/5ePHB/style.less

@@ -892,6 +892,9 @@ h6,
 			.useColumns(0.96, @fillMode: balance);
 		}
 	}
+	.toc.wide li {
+			break-inside: auto;
+	}
 }
 
 // *****************************