finally move savebutton

client/homebrew/navbar/metadata.navitem.jsx

@@ -68,7 +68,7 @@ const MetadataNav = createReactClass({
 	},
 
 	render : function(){
-		if(!this.props.brew?.shareId) return <></>
+		if(!this.props.brew?.shareId || this.props.pageName !== 'sharePage') return <></>
 
 		return <Nav.item icon='fas fa-info-circle' color='grey' className='metadata'
 			onClick={()=>this.toggleMetaWindow()}>

client/homebrew/navbar/navbar.jsx

@@ -7,7 +7,7 @@ import PrintNavItem from './print.navitem.jsx';
 import ShareNavItem from './share.navitem.jsx';
 import HelpNavItem from './help.navitem.jsx';
 import RecentNavItems from './recent.navitem.jsx';
-import MetadataNavItem from './metadata.navitem.jsx'
+import MetadataNavItem from './metadata.navitem.jsx';
 import AccountNavItem from './account.navitem.jsx';
 const { both: RecentNavItem } = RecentNavItems;
 import Nav from './nav.jsx';
@@ -16,17 +16,21 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 	const version = global.version || '0.0.0';
 	const isMac = navigator.platform.toUpperCase().includes('MAC');
 	const mod = isMac ? '⌘' : 'Ctrl';
-	const isBrew = !!brew &&(brew.shareId || pageName === 'homePage' || pageName === 'newPage');
+	const isBrew = !!brew && (brew.shareId || pageName === 'homePage' || pageName === 'newPage');
 	const account = global.account;
 	const generalPage = pageName === 'vaultPage' || pageName === 'changelog' || pageName === 'faq' || pageName === 'migrate';
 
-	const slots = React.Children.toArray(children).reduce((acc, child) => {
-		if (React.isValidElement(child)) {
-			if (child.type === Navbar.File) acc.file = child;
-			if (child.type === Navbar.Edit) acc.edit = child;
-			if (child.type === Navbar.Go) acc.go = child;
-		}
-		return acc;
+	const navSlots = React.Children.toArray(children).reduce((slots, child) => {
+		if (!React.isValidElement(child)) return slots;
+		const content = child.props.children;
+
+		if (child.type === Navbar.File) slots.file = content;
+		else if (child.type === Navbar.Edit) slots.edit = content;
+		else if (child.type === Navbar.Go) slots.go = content;
+		else if (child.type === Navbar.Help) slots.help = content;
+		else if (child.type === Navbar.Menu) slots.menu = content;
+
+		return slots;
 	}, {});
 
 	const renderDownloadLink = () => {
@@ -76,13 +80,12 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 					</Nav.item>
 					*/}
 				</div>
-				{slots.file?.props.children}
+				{navSlots.file}
 			</Dropdown>
 		);
 	};
 
 	const renderEdit = () => {
-		console.log(editor);
 		return (
 			<Dropdown groupName={'Edit'} customTrigger={<>Edit</>} icon={null} key={'edit'}>
 				<div className='nav-section'>
@@ -102,7 +105,7 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 						Unfold all lines
 					</Nav.item>
 				</div>
-				{slots.edit?.props.children}
+				{navSlots.edit}
 				{/*
 				<div className="nav-section">
 					<Nav.item onClick={()=>editor?.cut()} kbd={mod + ' + x'} disabled={!editor}>
@@ -136,6 +139,7 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 						Changelog
 					</Nav.item>
 				</div>
+				{navSlots.go}
 				<Dropdown className='navItem recent' groupName={'Recent Brews'} customTrigger={<>Recent Brews</>} icon={null} key={'recent'}>
 					<RecentNavItem />
 				</Dropdown>
@@ -154,10 +158,12 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 				{renderGo()}
 				<Dropdown groupName={'Help'} customTrigger={<>Help</>} icon={null} key={'help'}>
 					<HelpNavItem />
+					{navSlots.help}
 				</Dropdown>
+				{navSlots.menu}
 			</ul>
 			{generalPage && <Nav.item className='brewTitle'>{title}</Nav.item>}
-			<MetadataNavItem brew={brew}></MetadataNavItem>
+			<MetadataNavItem brew={brew} pageName={pageName}></MetadataNavItem>
 			<ul>
 				<Dropdown groupName={account.username} customTrigger={<>{account.username}</>} icon={null} key={account.username}>
 					<AccountNavItem />
@@ -167,4 +173,10 @@ const Navbar = ({ children, brew, pageName, editor, title, currentPage, props })
 	);
 };
 
+Navbar.File = ({ children }) => children;
+Navbar.Edit = ({ children }) => children;
+Navbar.Go = ({ children }) => children;
+Navbar.Help = ({ children }) => children;
+Navbar.Menu = ({ children }) => children;
+
 export default Navbar;

client/homebrew/navbar/navbar.less

@@ -279,23 +279,17 @@
 			justify-content: center;
 		}
 
-		&.beta {
-			color: @red;
-		}
-
 		&.neverSaved {
 			background-color: @orange;
 			color: white;
 			transition: all 0.2s;
+			
 			&:hover {
 				background-color: @green;
 			}
 		}
-
 		&.save {
-			position: relative;
-			width: 106px;
-			text-align: center;
+			width:90px;
 		}
 
 		&.saved {

client/homebrew/pages/basePages/editPage/editorPage.jsx

@@ -15,16 +15,9 @@ const Meta = Headtags.Meta;
 //===---- Navbar
 import Nav            from '@navbar/nav.jsx';
 import Navbar         from '@navbar/navbar.jsx';
-import NewBrewItem    from '@navbar/newbrew.navitem.jsx';
-import AccountNavItem from '@navbar/account.navitem.jsx';
 import ErrorNavItem   from '@navbar/error-navitem.jsx';
-import HelpNavItem    from '@navbar/help.navitem.jsx';
-import PrintNavItem   from '@navbar/print.navitem.jsx';
-import ShareNavItem   from '@navbar/share.navitem.jsx';
-import RecentNavItems from '@navbar/recent.navitem.jsx';
-const { both: RecentNavItem } = RecentNavItems;
 import googleDriveIcon from '../../../googleDrive.svg';
-import {Dropdown} from '../../components/dropdown/dropdown.jsx';
+import {Dropdown} from '../../../../components/dropdown/dropdown.jsx';
 
 const AUTOSAVE_KEY   = 'HB_editor_autoSaveOn';
 const BREWKEY        = 'HB_newPage_content';
@@ -263,13 +256,13 @@ const EditorPage = (props)=>{
 		}
 
 		if(unsavedChanges)
-			return <Nav.item className='save' onClick={()=>trySave(true, true, saveGoogle)} color='blue' icon='fas fa-save'>save now</Nav.item>;
+			return <Nav.item className='save neverSaved' onClick={()=>trySave(true, true, saveGoogle)} color='blue' icon='fas fa-save'>save now</Nav.item>;
 
 		if(autoSaveEnabled)
 			return <Nav.item className='save saved'>auto-saved</Nav.item>;
 
 		if(sandbox)
-			return <Nav.item className='save neverSaved' disabled={true}>save now</Nav.item>;
+			return <Nav.item className='save' disabled={true}>no changes</Nav.item>;
 
 		return <Nav.item className='save saved'>saved</Nav.item>;
 	};
@@ -381,12 +374,17 @@ const EditorPage = (props)=>{
 			{(pageName == 'editPage') && <Meta name='robots' content='noindex, nofollow' />}
 			<Navbar brew={currentBrew} editor={editorRef.current} pageName={pageName} account={global.account} currentPage={currentBrewRendererPageNum}>
 				<Navbar.File>
-					{error
-					? (<ErrorNavItem error={error} clearError={clearError} />) : (<Dropdown className='save-menu' customTrigger={<>Save</>}>
-						{renderSaveButton()}
-						{(pageName == 'editPage') && renderAutoSaveButton()}
-					</Dropdown>)}
+					<Nav.item
+						className='save'
+						onClick={()=>trySave(true, true, saveGoogle)}
+						icon='fas fa-save'>
+							save now
+					</Nav.item>
+					{(pageName == 'editPage') && renderAutoSaveButton()}
 				</Navbar.File>
+				<Navbar.Menu>
+					{error? <ErrorNavItem error={error} clearError={clearError} /> : renderSaveButton()}
+				</Navbar.Menu>
 			</Navbar>
 
 			{currentBrew.lock && <LockNotification shareId={currentBrew.shareId} message={currentBrew.lock.editMessage} reviewRequested={currentBrew.lock.reviewRequested}/>}