diff --git a/app/javascript/flavours/glitch/features/getting_started/index.js b/app/javascript/flavours/glitch/features/getting_started/index.js
index 47142fdd12b..1ca0a0b764d 100644
--- a/app/javascript/flavours/glitch/features/getting_started/index.js
+++ b/app/javascript/flavours/glitch/features/getting_started/index.js
@@ -9,6 +9,8 @@ import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { me } from 'flavours/glitch/util/initial_state';
+import { createSelector } from 'reselect';
+import { fetchLists } from 'flavours/glitch/actions/lists';
const messages = defineMessages({
heading: { id: 'getting_started.heading', defaultMessage: 'Getting started' },
@@ -23,19 +25,25 @@ const messages = defineMessages({
settings: { id: 'navigation_bar.app_settings', defaultMessage: 'App settings' },
follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
sign_out: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
- favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
- blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
- mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
- info: { id: 'navigation_bar.info', defaultMessage: 'Extended information' },
- show_me_around: { id: 'getting_started.onboarding', defaultMessage: 'Show me around' },
- pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned toots' },
lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
keyboard_shortcuts: { id: 'navigation_bar.keyboard_shortcuts', defaultMessage: 'Keyboard shortcuts' },
+ lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
+ lists_subheading: { id: 'column_subheading.lists', defaultMessage: 'Lists' },
+ misc: { id: 'navigation_bar.misc', defaultMessage: 'Misc' },
+});
+
+const getOrderedLists = createSelector([state => state.get('lists')], lists => {
+ if (!lists) {
+ return lists;
+}
+
+ return lists.toList().filter(item => !!item).sort((a, b) => a.get('title').localeCompare(b.get('title')));
});
const mapStateToProps = state => ({
myAccount: state.getIn(['accounts', me]),
columns: state.getIn(['settings', 'columns']),
+ lists: getOrderedLists(state),
});
@connect(mapStateToProps)
@@ -48,6 +56,7 @@ export default class GettingStarted extends ImmutablePureComponent {
columns: ImmutablePropTypes.list,
multiColumn: PropTypes.bool,
dispatch: PropTypes.func.isRequired,
+ lists: ImmutablePropTypes.list,
};
openSettings = () => {
@@ -59,8 +68,12 @@ export default class GettingStarted extends ImmutablePureComponent {
this.props.dispatch(openModal('ONBOARDING'));
}
+ componentWillMount () {
+ this.props.dispatch(fetchLists());
+ }
+
render () {
- const { intl, myAccount, columns, multiColumn } = this.props;
+ const { intl, myAccount, columns, multiColumn, lists } = this.props;
let navItems = [];
@@ -86,19 +99,12 @@ export default class GettingStarted extends ImmutablePureComponent {
navItems.push();
}
- navItems = navItems.concat([
- ,
- ,
- ,
- ]);
-
if (myAccount.get('locked')) {
- navItems.push();
+ navItems.push();
}
navItems = navItems.concat([
- ,
- ,
+ ,
]);
return (
@@ -107,9 +113,12 @@ export default class GettingStarted extends ImmutablePureComponent {
{navItems}
+
+
+ {lists.map(list =>
+
+ )}
-
-
diff --git a/app/javascript/flavours/glitch/features/getting_started_misc/index.js b/app/javascript/flavours/glitch/features/getting_started_misc/index.js
new file mode 100644
index 00000000000..cd7ec5c1d26
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/getting_started_misc/index.js
@@ -0,0 +1,59 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import LoadingIndicator from 'flavours/glitch/components/loading_indicator';
+import Column from 'flavours/glitch/features/ui/components/column';
+import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
+import { defineMessages, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import ColumnLink from 'flavours/glitch/features/ui/components/column_link';
+import ColumnSubheading from 'flavours/glitch/features/ui/components/column_subheading';
+import { createSelector } from 'reselect';
+
+const messages = defineMessages({
+ heading: { id: 'column.heading', defaultMessage: 'Misc' },
+ subheading: { id: 'column.subheading', defaultMessage: 'Miscellaneous options' },
+ favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+ blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
+ mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
+ info: { id: 'navigation_bar.info', defaultMessage: 'Extended information' },
+ show_me_around: { id: 'getting_started.onboarding', defaultMessage: 'Show me around' },
+ pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned toots' },
+ info: { id: 'navigation_bar.info', defaultMessage: 'Extended information' },
+ keyboard_shortcuts: { id: 'navigation_bar.keyboard_shortcuts', defaultMessage: 'Keyboard shortcuts' },
+});
+
+@injectIntl
+export default class gettingStartedMisc extends ImmutablePureComponent {
+
+ static propTypes = {
+ intl: PropTypes.object.isRequired,
+ };
+
+ openOnboardingModal = (e) => {
+ e.preventDefault();
+ this.props.dispatch(openModal('ONBOARDING'));
+ }
+
+ render () {
+ const { intl } = this.props;
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+ }
+
+}
diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js
index 698ae996c2e..a3a12e6284d 100644
--- a/app/javascript/flavours/glitch/features/ui/index.js
+++ b/app/javascript/flavours/glitch/features/ui/index.js
@@ -40,6 +40,7 @@ import {
Mutes,
PinnedStatuses,
Lists,
+ GettingStartedMisc,
} from 'flavours/glitch/util/async-components';
import { HotKeys } from 'react-hotkeys';
import { me } from 'flavours/glitch/util/initial_state';
@@ -428,6 +429,7 @@ export default class UI extends React.Component {
+
diff --git a/app/javascript/flavours/glitch/util/async-components.js b/app/javascript/flavours/glitch/util/async-components.js
index e4c991f011c..265a70cdc50 100644
--- a/app/javascript/flavours/glitch/util/async-components.js
+++ b/app/javascript/flavours/glitch/util/async-components.js
@@ -125,3 +125,7 @@ export function Video () {
export function EmbedModal () {
return import(/* webpackChunkName: "flavours/glitch/async/embed_modal" */'flavours/glitch/features/ui/components/embed_modal');
}
+
+export function GettingStartedMisc () {
+ return import(/* webpackChunkName: "flavours/glitch/async/getting_started_misc" */'flavours/glitch/features/getting_started_misc');
+}