diff --git a/app/javascript/gabsocial/layouts/default_layout.js b/app/javascript/gabsocial/layouts/default_layout.js index 5f9511f5..09c4ab2f 100644 --- a/app/javascript/gabsocial/layouts/default_layout.js +++ b/app/javascript/gabsocial/layouts/default_layout.js @@ -1,18 +1,6 @@ import Layout from './layout' -export default class DefaultLayout extends PureComponent { - - static propTypes = { - actions: PropTypes.array, - children: PropTypes.node.isRequired, - layout: PropTypes.object, - noComposeButton: PropTypes.bool, - noRightSidebar: PropTypes.bool, - page: PropTypes.string, - showBackBtn: PropTypes.bool, - tabs: PropTypes.array, - title: PropTypes.string.isRequired, - } +class DefaultLayout extends PureComponent { render() { const { @@ -44,3 +32,17 @@ export default class DefaultLayout extends PureComponent { } } + +DefaultLayout.propTypes = { + actions: PropTypes.array, + children: PropTypes.node.isRequired, + layout: PropTypes.object, + noComposeButton: PropTypes.bool, + noRightSidebar: PropTypes.bool, + page: PropTypes.string, + showBackBtn: PropTypes.bool, + tabs: PropTypes.array, + title: PropTypes.string.isRequired, +} + +export default DefaultLayout \ No newline at end of file diff --git a/app/javascript/gabsocial/layouts/group_layout.js b/app/javascript/gabsocial/layouts/group_layout.js index fe29a3fe..7096f502 100644 --- a/app/javascript/gabsocial/layouts/group_layout.js +++ b/app/javascript/gabsocial/layouts/group_layout.js @@ -14,37 +14,21 @@ import { GroupInfoPanel, } from '../features/ui/util/async_components' -export default class GroupLayout extends ImmutablePureComponent { - - static propTypes = { - actions: PropTypes.array, - children: PropTypes.node, - group: ImmutablePropTypes.map, - groupId: PropTypes.string, - isTimeline: PropTypes.bool, - layout: PropTypes.object, - relationships: ImmutablePropTypes.map, - showBackBtn: PropTypes.bool, - title: PropTypes.string, - } +class GroupLayout extends ImmutablePureComponent { render() { const { - actions, children, group, groupId, - isTimeline, relationships, - showBackBtn, title, } = this.props return ( <Layout noRightSidebar - actions={actions} - showBackBtn={showBackBtn} + showBackBtn title={title} page='group' > @@ -97,3 +81,13 @@ export default class GroupLayout extends ImmutablePureComponent { } } + +GroupLayout.propTypes = { + children: PropTypes.node, + group: ImmutablePropTypes.map, + groupId: PropTypes.string, + relationships: ImmutablePropTypes.map, + title: PropTypes.string, +} + +export default GroupLayout \ No newline at end of file diff --git a/app/javascript/gabsocial/layouts/layout.js b/app/javascript/gabsocial/layouts/layout.js index 4f156c0b..799f8532 100644 --- a/app/javascript/gabsocial/layouts/layout.js +++ b/app/javascript/gabsocial/layouts/layout.js @@ -20,22 +20,7 @@ import { SidebarXS, } from '../features/ui/util/async_components' -export default class Layout extends PureComponent { - - static propTypes = { - actions: PropTypes.array, - children: PropTypes.node, - layout: PropTypes.array, - noComposeButton: PropTypes.bool, - noRightSidebar: PropTypes.bool, - noSidebar: PropTypes.bool, - page: PropTypes.string, - showBackBtn: PropTypes.bool, - showLinkFooterInSidebar: PropTypes.bool, - showGlobalFooter: PropTypes.bool, - tabs: PropTypes.array, - title: PropTypes.string, - } +class Layout extends PureComponent { render() { const { @@ -176,3 +161,20 @@ export default class Layout extends PureComponent { } } + +Layout.propTypes = { + actions: PropTypes.array, + children: PropTypes.node, + layout: PropTypes.array, + noComposeButton: PropTypes.bool, + noRightSidebar: PropTypes.bool, + noSidebar: PropTypes.bool, + page: PropTypes.string, + showBackBtn: PropTypes.bool, + showLinkFooterInSidebar: PropTypes.bool, + showGlobalFooter: PropTypes.bool, + tabs: PropTypes.array, + title: PropTypes.string, +} + +export default Layout \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/about_page.js b/app/javascript/gabsocial/pages/about_page.js index eb0f6ac9..0e0f5ef9 100644 --- a/app/javascript/gabsocial/pages/about_page.js +++ b/app/javascript/gabsocial/pages/about_page.js @@ -1,27 +1,24 @@ import PageTitle from '../features/ui/util/page_title' import AboutLayout from '../layouts/about_layout' -export default class AboutPage extends PureComponent { - - static propTypes = { - title: PropTypes.string.isRequired, - children: PropTypes.node.isRequired, - } +class AboutPage extends PureComponent { render() { const { children, title } = this.props return ( - <AboutLayout - noComposeButton - showBackBtn - title={title} - page='about' - > + <AboutLayout title={title}> <PageTitle path={title} /> {children} </AboutLayout> ) } -} \ No newline at end of file +} + +AboutPage.propTypes = { + title: PropTypes.string.isRequired, + children: PropTypes.node.isRequired, +} + +export default AboutPage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/basic_page.js b/app/javascript/gabsocial/pages/basic_page.js index b926cb5b..8de7f8ae 100644 --- a/app/javascript/gabsocial/pages/basic_page.js +++ b/app/javascript/gabsocial/pages/basic_page.js @@ -6,13 +6,7 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -export default class BasicPage extends PureComponent { - - static propTypes = { - children: PropTypes.node.isRequired, - page: PropTypes.string.isRequired, - title: PropTypes.string.isRequired, - } +class BasicPage extends PureComponent { render() { const { @@ -39,4 +33,12 @@ export default class BasicPage extends PureComponent { ) } -} \ No newline at end of file +} + +BasicPage.propTypes = { + children: PropTypes.node.isRequired, + page: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, +} + +export default BasicPage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/community_page.js b/app/javascript/gabsocial/pages/community_page.js index 242174bf..d04a54c9 100644 --- a/app/javascript/gabsocial/pages/community_page.js +++ b/app/javascript/gabsocial/pages/community_page.js @@ -2,6 +2,7 @@ import { defineMessages, injectIntl } from 'react-intl' import { openModal } from '../actions/modal' import PageTitle from '../features/ui/util/page_title' import DefaultLayout from '../layouts/default_layout' +import { MODAL_COMMUNITY_TIMELINE_SETTINGS } from '../constants' import { LinkFooter, GroupsPanel, @@ -10,29 +11,14 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - community: { 'id': 'column.community', 'defaultMessage': 'Community feed' }, -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenCommunityPageSettingsModal() { - dispatch(openModal('COMMUNITY_TIMELINE_SETTINGS')) - }, -}) - -export default -@injectIntl -@connect(null, mapDispatchToProps) class CommunityPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - onOpenCommunityPageSettingsModal: PropTypes.func.isRequired, + onOpenCommunityPageSettingsModal = () => { + this.props.dispatch(openModal(MODAL_COMMUNITY_TIMELINE_SETTINGS)) } render() { - const { intl, children, onOpenCommunityPageSettingsModal } = this.props + const { children, intl } = this.props const title = intl.formatMessage(messages.community) @@ -43,7 +29,7 @@ class CommunityPage extends PureComponent { actions={[ { icon: 'ellipsis', - onClick: onOpenCommunityPageSettingsModal, + onClick: this.onOpenCommunityPageSettingsModal, }, ]} layout={[ @@ -59,4 +45,16 @@ class CommunityPage extends PureComponent { </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + community: { 'id': 'column.community', 'defaultMessage': 'Community feed' }, +}) + +CommunityPage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, +} + +export default injectIntl(connect()(CommunityPage)) diff --git a/app/javascript/gabsocial/pages/error_page.js b/app/javascript/gabsocial/pages/error_page.js index 07d84e85..b911ae2d 100644 --- a/app/javascript/gabsocial/pages/error_page.js +++ b/app/javascript/gabsocial/pages/error_page.js @@ -1,9 +1,7 @@ export default class ErrorPage extends PureComponent { render() { - const { children } = this.props; - - // : todo : + const { children } = this.props return ( <div> diff --git a/app/javascript/gabsocial/pages/explore_page.js b/app/javascript/gabsocial/pages/explore_page.js index 15dece3d..5664dd10 100644 --- a/app/javascript/gabsocial/pages/explore_page.js +++ b/app/javascript/gabsocial/pages/explore_page.js @@ -1,25 +1,24 @@ import PageTitle from '../features/ui/util/page_title' import ExploreLayout from '../layouts/explore_layout' -export default class ExplorePage extends PureComponent { - - static propTypes = { - title: PropTypes.string.isRequired, - children: PropTypes.node.isRequired, - } +class ExplorePage extends PureComponent { render() { const { children, title } = this.props return ( - <ExploreLayout - page='explore' - title={title} - > + <ExploreLayout title={title}> <PageTitle path={title} /> {children} </ExploreLayout> ) } -} \ No newline at end of file +} + +ExplorePage.propTypes = { + title: PropTypes.string.isRequired, + children: PropTypes.node.isRequired, +} + +export default ExplorePage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/group_page.js b/app/javascript/gabsocial/pages/group_page.js index e010f704..e586a0b1 100644 --- a/app/javascript/gabsocial/pages/group_page.js +++ b/app/javascript/gabsocial/pages/group_page.js @@ -8,39 +8,10 @@ import GroupLayout from '../layouts/group_layout' import TimelineComposeBlock from '../components/timeline_compose_block' import Divider from '../components/divider' -const messages = defineMessages({ - group: { id: 'group', defaultMessage: 'Group' }, -}) - -const mapStateToProps = (state, { params: { id } }) => ({ - group: state.getIn(['groups', id]), - relationships: state.getIn(['group_relationships', id]), -}) - -const mapDispatchToProps = (dispatch) => ({ - onFetchGroup(groupId) { - dispatch(fetchGroup(groupId)) - }, -}) - -export default -@injectIntl -@connect(mapStateToProps, mapDispatchToProps) class GroupPage extends ImmutablePureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - group: ImmutablePropTypes.map, - children: PropTypes.node.isRequired, - relationships: ImmutablePropTypes.map, - onFetchGroup: PropTypes.func.isRequired, - sortByValue: PropTypes.string.isRequired, - sortByTopValue: PropTypes.string.isRequired, - } - componentDidMount() { - this.props.onFetchGroup(this.props.params.id) - // this.props.onFetchGroup(this.props.params.slug) + this.props.dispatch(fetchGroup(this.props.params.id)) } render() { @@ -54,15 +25,13 @@ class GroupPage extends ImmutablePureComponent { const groupTitle = !!group ? group.get('title') : '' const groupId = !!group ? group.get('id') : undefined - + return ( <GroupLayout - showBackBtn title={'Group'} group={group} groupId={groupId} relationships={relationships} - isTimeline={isTimeline} > <PageTitle path={[groupTitle, intl.formatMessage(messages.group)]} /> @@ -78,4 +47,25 @@ class GroupPage extends ImmutablePureComponent { </GroupLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + group: { id: 'group', defaultMessage: 'Group' }, +}) + +const mapStateToProps = (state, { params: { id } }) => ({ + group: state.getIn(['groups', id]), + relationships: state.getIn(['group_relationships', id]), +}) + +GroupPage.propTypes = { + intl: PropTypes.object.isRequired, + group: ImmutablePropTypes.map, + children: PropTypes.node.isRequired, + relationships: ImmutablePropTypes.map, + dispatch: PropTypes.func.isRequired, + sortByValue: PropTypes.string.isRequired, + sortByTopValue: PropTypes.string.isRequired, +} + +export default injectIntl(connect(mapStateToProps)(GroupPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/groups_page.js b/app/javascript/gabsocial/pages/groups_page.js index 12e7e04f..4d4ed165 100644 --- a/app/javascript/gabsocial/pages/groups_page.js +++ b/app/javascript/gabsocial/pages/groups_page.js @@ -1,4 +1,3 @@ -import { Fragment } from 'react' import { me } from '../initial_state' import { defineMessages, injectIntl } from 'react-intl' import PageTitle from '../features/ui/util/page_title' @@ -11,31 +10,8 @@ import { LinkFooter, } from '../features/ui/util/async_components' -const messages = defineMessages({ - groups: { id: 'groups', defaultMessage: 'Groups' }, - new: { id: 'new', defaultMessage: 'Recently Added Groups' }, - featured: { id: 'featured', defaultMessage: 'Featured Groups' }, - myGroupsTimeline: { id: 'my_groups_timeline', defaultMessage: 'Timeline' }, - myGroups: { id: 'my_groups', defaultMessage: 'My Groups' }, - admin: { id: 'admin', defaultMessage: 'Admin' }, -}) - -const mapStateToProps = (state) => ({ - isPro: state.getIn(['accounts', me, 'is_pro']), -}) - -export default -@injectIntl -@connect(mapStateToProps) class GroupsPage extends PureComponent { - static propTypes = { - activeTab: PropTypes.string.isRequired, - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - isPro: PropTypes.bool, - } - render() { const { activeTab, @@ -46,13 +22,6 @@ class GroupsPage extends PureComponent { const dontShowChildren = (activeTab === 'timeline' && !me) - const actions = isPro ? [ - { - icon: 'add', - to: '/groups/create', - }, - ] : [] - const tabs = !!me ? [ { title: intl.formatMessage(messages.myGroupsTimeline), @@ -80,7 +49,7 @@ class GroupsPage extends PureComponent { } const title = intl.formatMessage(messages.groups) - + const layout = [] if (!!me) { layout.push(<WrappedBundle component={GroupsPanel} componentParams={{ groupType: 'member' }} />) @@ -90,14 +59,22 @@ class GroupsPage extends PureComponent { return ( <DefaultLayout title={title} - actions={actions} + actions={[ + { + title: 'Create', + icon: 'add', + to: '/groups/create', + }, + ]} tabs={tabs} page='groups' layout={layout} > <PageTitle path={title} /> - { !dontShowChildren && children } + { + !dontShowChildren && children + } { dontShowChildren && @@ -108,3 +85,25 @@ class GroupsPage extends PureComponent { } } + +const messages = defineMessages({ + groups: { id: 'groups', defaultMessage: 'Groups' }, + new: { id: 'new', defaultMessage: 'Recently Added Groups' }, + featured: { id: 'featured', defaultMessage: 'Featured Groups' }, + myGroupsTimeline: { id: 'my_groups_timeline', defaultMessage: 'Timeline' }, + myGroups: { id: 'my_groups', defaultMessage: 'My Groups' }, + admin: { id: 'admin', defaultMessage: 'Admin' }, +}) + +const mapStateToProps = (state) => ({ + isPro: state.getIn(['accounts', me, 'is_pro']), +}) + +GroupsPage.propTypes = { + activeTab: PropTypes.string.isRequired, + intl: PropTypes.object.isRequired, + children: PropTypes.node.isRequired, + isPro: PropTypes.bool, +} + +export default injectIntl(connect(mapStateToProps)(GroupsPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/hashtag_page.js b/app/javascript/gabsocial/pages/hashtag_page.js index 9ebda8e4..a842a89c 100644 --- a/app/javascript/gabsocial/pages/hashtag_page.js +++ b/app/javascript/gabsocial/pages/hashtag_page.js @@ -3,6 +3,7 @@ import { defineMessages, injectIntl } from 'react-intl' import isObject from 'lodash.isobject' import PageTitle from '../features/ui/util/page_title' import DefaultLayout from '../layouts/default_layout' +import { MODAL_HASHTAG_TIMELINE_SETTINGS } from '../constants' import { LinkFooter, ProgressPanel, @@ -10,36 +11,23 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - hashtag: { id: 'hashtag', defaultMessage: 'Hashtag' }, - hashtagTimeline: { id: 'hashtag_timeline', defaultMessage: 'Hashtag timeline' }, -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenHashtagPageSettingsModal(hashtag) { - dispatch(openModal('HASHTAG_TIMELINE_SETTINGS', { - hashtag, - })) - }, -}) - -export default -@injectIntl -@connect(null, mapDispatchToProps) class HashtagPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - onOpenHashtagPageSettingsModal: PropTypes.func.isRequired, - params: PropTypes.object.isRequired, + onOpenHashtagPageSettingsModal = () => { + const { params } = this.props + + const hashtag = isObject(params) ? params.id : '' + if (!hashtag) return + + this.props.dispatch(openModal(MODAL_HASHTAG_TIMELINE_SETTINGS, { + hashtag, + })) } render() { const { - intl, children, - onOpenHashtagPageSettingsModal, + intl, params, } = this.props @@ -52,7 +40,7 @@ class HashtagPage extends PureComponent { actions={[ { icon: 'ellipsis', - onClick: onOpenHashtagPageSettingsModal, + onClick: this.onOpenHashtagPageSettingsModal, }, ]} layout={[ @@ -67,4 +55,18 @@ class HashtagPage extends PureComponent { </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + hashtag: { id: 'hashtag', defaultMessage: 'Hashtag' }, + hashtagTimeline: { id: 'hashtag_timeline', defaultMessage: 'Hashtag timeline' }, +}) + +HashtagPage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + params: PropTypes.object.isRequired, +} + +export default injectIntl(connect()(HashtagPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/home_page.js b/app/javascript/gabsocial/pages/home_page.js index 8bb66ab3..dbae588d 100644 --- a/app/javascript/gabsocial/pages/home_page.js +++ b/app/javascript/gabsocial/pages/home_page.js @@ -21,34 +21,8 @@ import { ProgressPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - home: { id: 'home', defaultMessage: 'Home' }, -}) - -const mapStateToProps = (state) => ({ - totalQueuedItemsCount: state.getIn(['timelines', 'home', 'totalQueuedItemsCount']), - isPro: state.getIn(['accounts', me, 'is_pro']), -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenHomePageSettingsModal() { - dispatch(openModal(MODAL_HOME_TIMELINE_SETTINGS)) - }, -}) - -export default -@injectIntl -@connect(mapStateToProps, mapDispatchToProps) class HomePage extends PureComponent { - static propTypes = { - children: PropTypes.node.isRequired, - intl: PropTypes.object.isRequired, - onOpenHomePageSettingsModal: PropTypes.func.isRequired, - totalQueuedItemsCount: PropTypes.number.isRequired, - isPro: PropTypes.bool, - } - state = { lazyLoaded: false, } @@ -81,24 +55,29 @@ class HomePage extends PureComponent { trailing: true, }) + onOpenHomePageSettingsModal = () => { + this.props.dispatch(openModal(MODAL_HOME_TIMELINE_SETTINGS)) + } + render() { const { - intl, children, - totalQueuedItemsCount, - onOpenHomePageSettingsModal, + intl, isPro, + totalQueuedItemsCount, } = this.props const { lazyLoaded } = this.state + const title = intl.formatMessage(messages.home) + return ( <DefaultLayout page='home' - title={intl.formatMessage(messages.home)} + title={title} actions={[ { icon: 'ellipsis', - onClick: onOpenHomePageSettingsModal, + onClick: this.onOpenHomePageSettingsModal, }, ]} layout={[ @@ -115,7 +94,7 @@ class HomePage extends PureComponent { > <PageTitle - path={intl.formatMessage(messages.home)} + path={title} badge={totalQueuedItemsCount} /> @@ -130,4 +109,23 @@ class HomePage extends PureComponent { </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + home: { id: 'home', defaultMessage: 'Home' }, +}) + +const mapStateToProps = (state) => ({ + totalQueuedItemsCount: state.getIn(['timelines', 'home', 'totalQueuedItemsCount']), + isPro: state.getIn(['accounts', me, 'is_pro']), +}) + +HomePage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + isPro: PropTypes.bool, + totalQueuedItemsCount: PropTypes.number.isRequired, +} + +export default injectIntl(connect(mapStateToProps)(HomePage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/introduction_page.js b/app/javascript/gabsocial/pages/introduction_page.js index b98ffda4..087c09d8 100644 --- a/app/javascript/gabsocial/pages/introduction_page.js +++ b/app/javascript/gabsocial/pages/introduction_page.js @@ -4,12 +4,10 @@ import IntroductionLayout from '../layouts/introduction_layout' export default class IntroductionPage extends PureComponent { render() { - const { children } = this.props - return ( <IntroductionLayout> <PageTitle path='Welcome to Gab' /> - {children} + {this.props.children} </IntroductionLayout> ) } diff --git a/app/javascript/gabsocial/pages/list_page.js b/app/javascript/gabsocial/pages/list_page.js index e2d3ea8c..d7f08601 100644 --- a/app/javascript/gabsocial/pages/list_page.js +++ b/app/javascript/gabsocial/pages/list_page.js @@ -4,7 +4,6 @@ import { defineMessages, injectIntl } from 'react-intl' import { openModal } from '../actions/modal' import { MODAL_LIST_EDITOR, - // MODAL_LIST_TIMELINE_SETTINGS, } from '../constants' import PageTitle from '../features/ui/util/page_title' import DefaultLayout from '../layouts/default_layout' @@ -16,68 +15,38 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - list: { id: 'list', defaultMessage: 'List' }, -}) - -const mapStateToProps = (state, props) => ({ - list: state.getIn(['lists', props.params.id]), -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenListEditModal(list) { - if (!list) return - const listId = list.get('id') - dispatch(openModal(MODAL_LIST_EDITOR, { id: listId })) - }, - // : todo : - // onOpenListTimelineSettingsModal() { - // dispatch(openModal(MODAL_LIST_TIMELINE_SETTINGS)) - // }, -}) - -export default -@injectIntl -@connect(mapStateToProps, mapDispatchToProps) class ListPage extends ImmutablePureComponent { - - static propTypes = { - intl: PropTypes.object.isRequired, - list: ImmutablePropTypes.map, - children: PropTypes.node.isRequired, - onOpenListEditModal: PropTypes.func.isRequired, - // onOpenListTimelineSettingsModal: PropTypes.func.isRequired, - } - handleOnOpenListEditModal = () => { - this.props.onOpenListEditModal(this.props.list) + onOpenListEditModal = () => { + const { list } = this.props + + if (!list) return + + this.props.dispatch(openModal(MODAL_LIST_EDITOR, { + id: list.get('id'), + })) } render() { const { - intl, children, + intl, list, - onOpenListEditModal, - // onOpenListTimelineSettingsModal } = this.props - const title = !!list ? list.get('title') : '' + const listTitle = !!list ? list.get('title') : '' + const title = intl.formatMessage(messages.list) return ( <DefaultLayout showBackBtn - title={intl.formatMessage(messages.list)} + title={title} page='list' actions={[ { icon: 'cog', - onClick: this.handleOnOpenListEditModal, + onClick: this.onOpenListEditModal, }, - // { - // icon: 'ellipsis', - // onClick: onOpenListTimelineSettingsModal, - // }, ]} layout={[ <WrappedBundle component={ListDetailsPanel} componentParams={{ list: list, onEdit: this.handleOnOpenListEditModal }} />, @@ -86,9 +55,26 @@ class ListPage extends ImmutablePureComponent { LinkFooter, ]} > - <PageTitle path={[title, intl.formatMessage(messages.list)]} /> + <PageTitle path={[listTitle, title]} /> { children } </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + list: { id: 'list', defaultMessage: 'List' }, +}) + +const mapStateToProps = (state, props) => ({ + list: state.getIn(['lists', props.params.id]), +}) + +ListPage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + list: ImmutablePropTypes.map, +} + +export default injectIntl(connect(mapStateToProps)(ListPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/lists_page.js b/app/javascript/gabsocial/pages/lists_page.js index febce807..8e6ade00 100644 --- a/app/javascript/gabsocial/pages/lists_page.js +++ b/app/javascript/gabsocial/pages/lists_page.js @@ -2,48 +2,33 @@ import { openModal } from '../actions/modal' import { defineMessages, injectIntl } from 'react-intl' import PageTitle from '../features/ui/util/page_title' import DefaultLayout from '../layouts/default_layout' +import { MODAL_LIST_CREATE } from '../constants' import { LinkFooter, TrendsPanel, WhoToFollowPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - lists: { id: 'lists', defaultMessage: 'Lists' }, -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenListCreateModal() { - dispatch(openModal('LIST_CREATE')) - }, -}) - -export default -@injectIntl -@connect(null, mapDispatchToProps) class ListsPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - onOpenListCreateModal: PropTypes.func.isRequired, + onOpenListCreateModal = () => { + this.props.dispatch(openModal(MODAL_LIST_CREATE)) } render() { - const { - intl, - children, - onOpenListCreateModal, - } = this.props + const { children, intl } = this.props + + const title = intl.formatMessage(messages.lists) return ( <DefaultLayout - title={intl.formatMessage(messages.lists)} + showBackBtn + title={title} page='lists' actions={[ { icon: 'add', - onClick: onOpenListCreateModal, + onClick: this.onOpenListCreateModal, }, ]} layout={[ @@ -51,12 +36,23 @@ class ListsPage extends PureComponent { WhoToFollowPanel, LinkFooter, ]} - showBackBtn > - <PageTitle path={intl.formatMessage(messages.lists)} /> + <PageTitle path={title} /> {children} </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + lists: { id: 'lists', defaultMessage: 'Lists' }, +}) + +ListsPage.propTypes = { + intl: PropTypes.object.isRequired, + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, +} + +export default injectIntl(connect()(ListsPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/modal_page.js b/app/javascript/gabsocial/pages/modal_page.js index 052a4d92..37e1da97 100644 --- a/app/javascript/gabsocial/pages/modal_page.js +++ b/app/javascript/gabsocial/pages/modal_page.js @@ -6,13 +6,7 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -export default class ModalPage extends PureComponent { - - static propTypes = { - title: PropTypes.string, - page: PropTypes.string, - children: PropTypes.node, - } +class ModalPage extends PureComponent { render() { const { @@ -42,4 +36,12 @@ export default class ModalPage extends PureComponent { ) } -} \ No newline at end of file +} + +ModalPage.propTypes = { + title: PropTypes.string, + page: PropTypes.string, + children: PropTypes.node, +} + +export default ModalPage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/news_page.js b/app/javascript/gabsocial/pages/news_page.js index 632adaad..cc59df66 100644 --- a/app/javascript/gabsocial/pages/news_page.js +++ b/app/javascript/gabsocial/pages/news_page.js @@ -8,19 +8,14 @@ import { VerifiedAccountsPanel, } from '../features/ui/util/async_components' -export default class NewsPage extends PureComponent { - - static propTypes = { - title: PropTypes.string.isRequired, - children: PropTypes.node.isRequired, - } +class NewsPage extends PureComponent { render() { const { children, title } = this.props return ( <DefaultLayout - page='explore' + page='news' title={title} noComposeButton showBackBtn @@ -39,3 +34,10 @@ export default class NewsPage extends PureComponent { } } + +NewsPage.propTypes = { + children: PropTypes.node.isRequired, + title: PropTypes.string.isRequired, +} + +export default NewsPage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/notifications_page.js b/app/javascript/gabsocial/pages/notifications_page.js index 307fbc77..d0fa8b5a 100644 --- a/app/javascript/gabsocial/pages/notifications_page.js +++ b/app/javascript/gabsocial/pages/notifications_page.js @@ -12,6 +12,61 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' +class NotificationsPage extends PureComponent { + + onChangeActiveFilter(notificationType) { + this.props.dispatch(setFilter('active', notificationType)) + + if (notificationType === 'all') { + this.context.router.history.push('/notifications') + } else if (notificationType === 'follow_requests') { + this.context.router.history.push(`/notifications/follow_requests`) + } else { + this.context.router.history.push(`/notifications?view=${notificationType}`) + } + } + + render() { + const { + children, + intl, + locked, + notificationCount, + selectedFilter, + } = this.props + + let filters = NOTIFICATION_FILTERS + if (!locked && filters.indexOf('follow_requests') > -1) { + filters.splice(filters.indexOf('follow_requests')) + } + + const tabs = filters.map((filter) => ({ + title: intl.formatMessage(messages[filter]), + onClick: () => this.onChangeActiveFilter(filter), + active: selectedFilter.toLowerCase() === filter.toLowerCase(), + })) + + const title = intl.formatMessage(messages.notifications) + + return ( + <DefaultLayout + title={title} + page='notifications' + layout={[ + NotificationFilterPanel, + TrendsPanel, + WhoToFollowPanel, + LinkFooter, + ]} + tabs={tabs} + > + <PageTitle badge={notificationCount} path={title} /> + {children} + </DefaultLayout> + ) + } +} + const messages = defineMessages({ notifications: { id: 'tabs_bar.notifications', defaultMessage: 'Notifications' }, mention: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' }, @@ -29,80 +84,17 @@ const mapStateToProps = (state) => ({ locked: !!state.getIn(['accounts', me, 'locked']), }) -const mapDispatchToProps = (dispatch) => ({ - setFilter(value) { - dispatch(setFilter('active', value)) - }, -}) +NotificationsPage.contextTypes = { + router: PropTypes.object.isRequired, +} -export default -@injectIntl -@connect(mapStateToProps, mapDispatchToProps) -class NotificationsPage extends PureComponent { +NotificationsPage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + locked: PropTypes.bool, + notificationCount: PropTypes.number.isRequired, + selectedFilter: PropTypes.string.isRequired, +} - static contextTypes = { - router: PropTypes.object.isRequired, - } - - static propTypes = { - children: PropTypes.node.isRequired, - intl: PropTypes.object.isRequired, - notificationCount: PropTypes.number.isRequired, - setFilter: PropTypes.func.isRequired, - selectedFilter: PropTypes.string.isRequired, - locked: PropTypes.bool, - } - - onChangeActiveFilter(notificationType) { - this.props.setFilter(notificationType) - - if (notificationType === 'all') { - this.context.router.history.push('/notifications') - } else if (notificationType === 'follow_requests') { - this.context.router.history.push(`/notifications/follow_requests`) - } else { - this.context.router.history.push(`/notifications?view=${notificationType}`) - } - } - - render() { - const { - children, - intl, - notificationCount, - selectedFilter, - locked - } = this.props - - let filters = NOTIFICATION_FILTERS - if (!locked && filters.indexOf('follow_requests') > -1) { - filters.splice(filters.indexOf('follow_requests')) - } - - const tabs = filters.map((filter) => ({ - title: intl.formatMessage(messages[filter]), - onClick: () => this.onChangeActiveFilter(filter), - active: selectedFilter.toLowerCase() === filter.toLowerCase(), - })) - - return ( - <DefaultLayout - title={intl.formatMessage(messages.notifications)} - page='notifications' - layout={[ - NotificationFilterPanel, - TrendsPanel, - WhoToFollowPanel, - LinkFooter, - ]} - tabs={tabs} - > - <PageTitle - badge={notificationCount} - path={intl.formatMessage(messages.notifications)} - /> - {children} - </DefaultLayout> - ) - } -}{} \ No newline at end of file +export default injectIntl(connect(mapStateToProps)(NotificationsPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/pro_page.js b/app/javascript/gabsocial/pages/pro_page.js index 621b6e68..5c257909 100644 --- a/app/javascript/gabsocial/pages/pro_page.js +++ b/app/javascript/gabsocial/pages/pro_page.js @@ -7,19 +7,8 @@ import { ProgressPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - title: { 'id': 'column.pro', 'defaultMessage': 'Pro feed' }, -}) - -export default -@injectIntl class ProPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - } - render() { const { intl, children } = this.props @@ -40,4 +29,16 @@ class ProPage extends PureComponent { </DefaultLayout> ) } -} \ No newline at end of file + +} + +const messages = defineMessages({ + title: { 'id': 'column.pro', 'defaultMessage': 'Pro feed' }, +}) + +ProPage.propTypes = { + children: PropTypes.node.isRequired, + intl: PropTypes.object.isRequired, +} + +export default injectIntl(ProPage) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/profile_page.js b/app/javascript/gabsocial/pages/profile_page.js index 4eb377dc..006a324e 100644 --- a/app/javascript/gabsocial/pages/profile_page.js +++ b/app/javascript/gabsocial/pages/profile_page.js @@ -9,46 +9,10 @@ import ColumnIndicator from '../components/column_indicator' import Block from '../components/block' import ProfileLayout from '../layouts/profile_layout' -const mapStateToProps = (state, { params: { username } }) => { - const accounts = state.getIn(['accounts']) - const account = accounts.find(acct => username.toLowerCase() === acct.getIn(['acct'], '').toLowerCase()) - - const accountId = !!account ? account.get('id') : -1 - const isBlocked = state.getIn(['relationships', accountId, 'blocked_by'], false) - const isLocked = state.getIn(['accounts', accountId, 'locked'], false) - const isFollowing = state.getIn(['relationships', accountId, 'following'], false) - - const unavailable = (me === accountId) ? false : (isBlocked || (isLocked && !isFollowing)) - - const getAccount = makeGetAccount() - - return { - unavailable, - account: accountId !== -1 ? getAccount(state, accountId) : null, - } -} - -const mapDispatchToProps = (dispatch) => ({ - onFetchAccountByUsername(username) { - dispatch(fetchAccountByUsername(username)) - }, -}) - -export default -@connect(mapStateToProps, mapDispatchToProps) class ProfilePage extends ImmutablePureComponent { - static propTypes = { - children: PropTypes.node, - params: PropTypes.object.isRequired, - account: ImmutablePropTypes.map, - onFetchAccountByUsername: PropTypes.func.isRequired, - unavailable: PropTypes.bool.isRequired, - noSidebar: PropTypes.bool, - } - componentDidMount() { - this.props.onFetchAccountByUsername(this.props.params.username) + this.props.dispatch(fetchAccountByUsername(this.props.params.username)) } render() { @@ -89,4 +53,34 @@ class ProfilePage extends ImmutablePureComponent { ) } -} \ No newline at end of file +} + +const mapStateToProps = (state, { params: { username } }) => { + const accounts = state.getIn(['accounts']) + const account = accounts.find(acct => username.toLowerCase() === acct.getIn(['acct'], '').toLowerCase()) + + const accountId = !!account ? account.get('id') : -1 + const isBlocked = state.getIn(['relationships', accountId, 'blocked_by'], false) + const isLocked = state.getIn(['accounts', accountId, 'locked'], false) + const isFollowing = state.getIn(['relationships', accountId, 'following'], false) + + const unavailable = (me === accountId) ? false : (isBlocked || (isLocked && !isFollowing)) + + const getAccount = makeGetAccount() + + return { + unavailable, + account: accountId !== -1 ? getAccount(state, accountId) : null, + } +} + +ProfilePage.propTypes = { + account: ImmutablePropTypes.map, + children: PropTypes.node, + dispatch: PropTypes.func.isRequired, + noSidebar: PropTypes.bool, + params: PropTypes.object.isRequired, + unavailable: PropTypes.bool.isRequired, +} + +export default connect(mapStateToProps)(ProfilePage) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/search_page.js b/app/javascript/gabsocial/pages/search_page.js index 801acc2e..daf9c722 100644 --- a/app/javascript/gabsocial/pages/search_page.js +++ b/app/javascript/gabsocial/pages/search_page.js @@ -11,34 +11,12 @@ import { SignUpPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - search: { id: 'search', defaultMessage: 'Search' }, - top: { id: 'top', defaultMessage: 'Top' }, - people: { id: 'people', defaultMessage: 'People' }, - groups: { id: 'groups', defaultMessage: 'Groups' }, - hashtags: { id: 'hashtags', defaultMessage: 'Hashtags' }, -}) - -const mapStateToProps = (state) => ({ - value: state.getIn(['search', 'value']), -}) - -export default -@injectIntl -@connect(mapStateToProps) class SearchPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - children: PropTypes.node.isRequired, - value: PropTypes.string, - } + componentWillMount() { + const { intl } = this.props - render() { - const { intl, children, value } = this.props - - const title = intl.formatMessage(messages.search) - const tabs = [ + this.tabs = [ { title: intl.formatMessage(messages.top), to: '/search' @@ -56,7 +34,16 @@ class SearchPage extends PureComponent { to: '/search/hashtags' }, ] + } + render() { + const { + children, + intl, + value, + } = this.props + + const title = intl.formatMessage(messages.search) const qos = !!value ? value : '' return ( @@ -64,7 +51,7 @@ class SearchPage extends PureComponent { noComposeButton title={title} showBackBtn - tabs={tabs} + tabs={this.tabs} page={`search.${qos}`} layout={[ SignUpPanel, @@ -74,7 +61,7 @@ class SearchPage extends PureComponent { ]} > <PageTitle path={title} /> - + <Responsive max={BREAKPOINT_EXTRA_SMALL}> <div className={[_s.default, _s.px10].join(' ')}> <Search /> @@ -86,4 +73,24 @@ class SearchPage extends PureComponent { ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + search: { id: 'search', defaultMessage: 'Search' }, + top: { id: 'top', defaultMessage: 'Top' }, + people: { id: 'people', defaultMessage: 'People' }, + groups: { id: 'groups', defaultMessage: 'Groups' }, + hashtags: { id: 'hashtags', defaultMessage: 'Hashtags' }, +}) + +const mapStateToProps = (state) => ({ + value: state.getIn(['search', 'value']), +}) + +SearchPage.propTypes = { + intl: PropTypes.object.isRequired, + children: PropTypes.node.isRequired, + value: PropTypes.string, +} + +export default injectIntl(connect(mapStateToProps)(SearchPage)) \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/settings_page.js b/app/javascript/gabsocial/pages/settings_page.js index 7964f9b1..965ef1c3 100644 --- a/app/javascript/gabsocial/pages/settings_page.js +++ b/app/javascript/gabsocial/pages/settings_page.js @@ -1,14 +1,13 @@ import SettingsLayout from '../layouts/settings_layout' -export default class SettingsPage extends PureComponent { - - static propTypes = { - tabs: PropTypes.array, - title: PropTypes.string, - } +class SettingsPage extends PureComponent { render() { - const { children, title, tabs } = this.props; + const { + children, + tabs, + title, + } = this.props return ( <SettingsLayout @@ -19,4 +18,13 @@ export default class SettingsPage extends PureComponent { </SettingsLayout> ) } -} \ No newline at end of file + +} + +SettingsPage.propTypes = { + children: PropTypes.node.isRequired, + tabs: PropTypes.array, + title: PropTypes.string, +} + +export default SettingsPage \ No newline at end of file diff --git a/app/javascript/gabsocial/pages/shortcuts_page.js b/app/javascript/gabsocial/pages/shortcuts_page.js index cf96330c..1c5333d6 100644 --- a/app/javascript/gabsocial/pages/shortcuts_page.js +++ b/app/javascript/gabsocial/pages/shortcuts_page.js @@ -9,28 +9,10 @@ import { WhoToFollowPanel, } from '../features/ui/util/async_components' -const messages = defineMessages({ - shortcuts: { id: 'shortcuts', defaultMessage: 'Shortcuts' }, -}) - -const mapDispatchToProps = (dispatch) => ({ - onOpenEditShortcutsModal() { - dispatch(openModal(MODAL_EDIT_SHORTCUTS)) - }, -}) - -export default -@injectIntl -@connect(null, mapDispatchToProps) class ShortcutsPage extends PureComponent { - static propTypes = { - intl: PropTypes.object.isRequired, - onOpenEditShortcutsModal: PropTypes.func.isRequired, - } - handleOnOpenEditShortcutsModal = () => { - this.props.onOpenEditShortcutsModal() + this.props.dispatch(openModal(MODAL_EDIT_SHORTCUTS)) } render() { @@ -59,4 +41,16 @@ class ShortcutsPage extends PureComponent { </DefaultLayout> ) } -} \ No newline at end of file +} + +const messages = defineMessages({ + shortcuts: { id: 'shortcuts', defaultMessage: 'Shortcuts' }, +}) + +ShortcutsPage.propTypes = { + children: PropTypes.node.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, +} + +export default injectIntl(connect()(ShortcutsPage)) \ No newline at end of file