|
@@ -4,6 +4,7 @@ import loggerFactory from '@alias/logger';
|
|
|
|
|
|
|
|
import StickyEvents from 'sticky-events';
|
|
import StickyEvents from 'sticky-events';
|
|
|
|
|
|
|
|
|
|
+import AppContainer from '../services/AppContainer';
|
|
|
import NavigationContainer from '../services/NavigationContainer';
|
|
import NavigationContainer from '../services/NavigationContainer';
|
|
|
import { withUnstatedContainers } from './UnstatedUtils';
|
|
import { withUnstatedContainers } from './UnstatedUtils';
|
|
|
import CreatePageIcon from './Icons/CreatePageIcon';
|
|
import CreatePageIcon from './Icons/CreatePageIcon';
|
|
@@ -12,7 +13,9 @@ import ReturnTopIcon from './Icons/ReturnTopIcon';
|
|
|
const logger = loggerFactory('growi:cli:Fab');
|
|
const logger = loggerFactory('growi:cli:Fab');
|
|
|
|
|
|
|
|
const Fab = (props) => {
|
|
const Fab = (props) => {
|
|
|
- const { navigationContainer } = props;
|
|
|
|
|
|
|
+ const { navigationContainer, appContainer } = props;
|
|
|
|
|
+ const { currentUser } = appContainer;
|
|
|
|
|
+
|
|
|
|
|
|
|
|
const [animateClasses, setAnimateClasses] = useState('invisible');
|
|
const [animateClasses, setAnimateClasses] = useState('invisible');
|
|
|
|
|
|
|
@@ -39,7 +42,7 @@ const Fab = (props) => {
|
|
|
};
|
|
};
|
|
|
}, [stickyChangeHandler]);
|
|
}, [stickyChangeHandler]);
|
|
|
|
|
|
|
|
- function renderEditorIcon() {
|
|
|
|
|
|
|
+ function renderEditorButton() {
|
|
|
return (
|
|
return (
|
|
|
<>
|
|
<>
|
|
|
<div className={`rounded-circle position-absolute ${animateClasses}`} style={{ bottom: '2.3rem', right: '4rem' }}>
|
|
<div className={`rounded-circle position-absolute ${animateClasses}`} style={{ bottom: '2.3rem', right: '4rem' }}>
|
|
@@ -57,7 +60,8 @@ const Fab = (props) => {
|
|
|
|
|
|
|
|
return (
|
|
return (
|
|
|
<div className="grw-fab d-none d-md-block">
|
|
<div className="grw-fab d-none d-md-block">
|
|
|
- {renderEditorIcon()}
|
|
|
|
|
|
|
+
|
|
|
|
|
+ {currentUser != null && renderEditorButton()}
|
|
|
<div className={`rounded-circle position-absolute ${animateClasses}`} style={{ bottom: 0, right: 0 }}>
|
|
<div className={`rounded-circle position-absolute ${animateClasses}`} style={{ bottom: 0, right: 0 }}>
|
|
|
<button type="button" className="btn btn-light btn-scroll-to-top rounded-circle p-0" onClick={() => navigationContainer.smoothScrollIntoView()}>
|
|
<button type="button" className="btn btn-light btn-scroll-to-top rounded-circle p-0" onClick={() => navigationContainer.smoothScrollIntoView()}>
|
|
|
<ReturnTopIcon />
|
|
<ReturnTopIcon />
|
|
@@ -70,6 +74,7 @@ const Fab = (props) => {
|
|
|
|
|
|
|
|
Fab.propTypes = {
|
|
Fab.propTypes = {
|
|
|
navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
|
|
navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
|
|
|
|
|
+ appContainer: PropTypes.instanceOf(AppContainer).isRequired,
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-export default withUnstatedContainers(Fab, [NavigationContainer]);
|
|
|
|
|
|
|
+export default withUnstatedContainers(Fab, [NavigationContainer, AppContainer]);
|