diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
index 6eb5ee0e5..b28fd83d4 100644
--- a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
@@ -55,6 +55,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
singleColumn: PropTypes.bool,
children: PropTypes.node,
openSettings: PropTypes.func,
+ onLogout: PropTypes.func,
};
// Corresponds to (max-width: $no-gap-breakpoint + 285px - 1px) in SCSS
@@ -139,7 +140,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
};
render () {
- const { columns, children, singleColumn, openSettings } = this.props;
+ const { columns, children, singleColumn, openSettings, onLogout } = this.props;
const { renderComposePanel } = this.state;
if (singleColumn) {
@@ -158,7 +159,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
diff --git a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
index d2e37cc63..b25d6099c 100644
--- a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
@@ -30,6 +30,7 @@ const messages = defineMessages({
advancedInterface: { id: 'navigation_bar.advanced_interface', defaultMessage: 'Open in advanced web interface' },
openedInClassicInterface: { id: 'navigation_bar.opened_in_classic_interface', defaultMessage: 'Posts, accounts, and other specific pages are opened by default in the classic web interface.' },
app_settings: { id: 'navigation_bar.app_settings', defaultMessage: 'App settings' },
+ logout: { id: 'navigation_bar.logout', defaultMessage: 'Log out' },
});
class NavigationPanel extends Component {
@@ -42,6 +43,7 @@ class NavigationPanel extends Component {
static propTypes = {
intl: PropTypes.object.isRequired,
onOpenSettings: PropTypes.func,
+ onLogout: PropTypes.func,
};
isFirehoseActive = (match, location) => {
@@ -49,7 +51,7 @@ class NavigationPanel extends Component {
};
render() {
- const { intl, onOpenSettings } = this.props;
+ const { intl, onOpenSettings, onLogout } = this.props;
const { signedIn, disabledAccountId } = this.context.identity;
return (
@@ -104,6 +106,7 @@ class NavigationPanel extends Component {
+
>
)}
@@ -112,6 +115,7 @@ class NavigationPanel extends Component {
+
);
diff --git a/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js b/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
index a69abfb61..877313b91 100644
--- a/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
+++ b/app/javascript/flavours/glitch/features/ui/containers/columns_area_container.js
@@ -1,14 +1,22 @@
+import { defineMessages, injectIntl } from 'react-intl';
+
import { connect } from 'react-redux';
import { openModal } from 'flavours/glitch/actions/modal';
+import { logOut } from 'flavours/glitch/utils/log_out';
import ColumnsArea from '../components/columns_area';
+const messages = defineMessages({
+ logoutMessage: { id: 'confirmations.logout.message', defaultMessage: 'Are you sure you want to log out?' },
+ logoutConfirm: { id: 'confirmations.logout.confirm', defaultMessage: 'Log out' },
+});
+
const mapStateToProps = state => ({
columns: state.getIn(['settings', 'columns']),
});
-const mapDispatchToProps = dispatch => ({
+const mapDispatchToProps = (dispatch, { intl }) => ({
openSettings (e) {
e.preventDefault();
e.stopPropagation();
@@ -17,6 +25,17 @@ const mapDispatchToProps = dispatch => ({
modalProps: {},
}));
},
+ onLogout () {
+ dispatch(openModal({
+ modalType: 'CONFIRM',
+ modalProps: {
+ message: intl.formatMessage(messages.logoutMessage),
+ confirm: intl.formatMessage(messages.logoutConfirm),
+ closeWhenConfirm: false,
+ onConfirm: () => logOut(),
+ },
+ }));
+ },
});
-export default connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })(ColumnsArea);
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })(ColumnsArea));
diff --git a/app/javascript/flavours/glitch/features/ui/index.jsx b/app/javascript/flavours/glitch/features/ui/index.jsx
index 0697cc5e1..7e325f5bc 100644
--- a/app/javascript/flavours/glitch/features/ui/index.jsx
+++ b/app/javascript/flavours/glitch/features/ui/index.jsx
@@ -149,7 +149,9 @@ class SwitchingColumnsArea extends PureComponent {
componentDidUpdate (prevProps) {
if (![this.props.location.pathname, '/'].includes(prevProps.location.pathname)) {
- this.node.handleChildrenContentChange();
+ if (this.node && this.node.handleChildrenContentChange === 'function') {
+ this.node.handleChildrenContentChange();
+ }
}
if (prevProps.singleColumn !== this.props.singleColumn) {