Progress

app/javascript/gabsocial/pages/community_page.js

@@ -0,0 +1,60 @@
+import { Fragment } from 'react'
+import { openModal } from '../actions/modal'
+import GroupSidebarPanel from '../components/panel/groups_panel'
+import LinkFooter from '../components/link_footer'
+import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
+import ProgressPanel from '../components/panel/progress_panel'
+import TrendsPanel from '../components/panel/trends_panel'
+import HashtagsPanel from '../components/panel/hashtags_panel'
+import DefaultLayout from '../layouts/default_layout'
+import TimelineComposeBlock from '../components/timeline_compose_block'
+import Divider from '../components/divider'
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenCommunityPageSettingsModal() {
+    dispatch(openModal('COMMUNITY_TIMELINE_SETTINGS'))
+  },
+})
+
+export default
+@connect(null, mapDispatchToProps)
+class CommunityPage extends PureComponent {
+
+  static propTypes = {
+    onOpenCommunityPageSettingsModal: PropTypes.func.isRequired,
+  }
+
+  componentDidMount() {
+    document.title = '(1) Community - Gab'
+  }
+
+  render() {
+    const { children, onOpenCommunityPageSettingsModal } = this.props
+
+    return (
+      <DefaultLayout
+        title='Community Timeline'
+        actions={[
+          {
+            icon: 'ellipsis',
+            onClick: onOpenCommunityPageSettingsModal,
+          },
+        ]}
+        layout={(
+          <Fragment>
+            <ProgressPanel />
+            <TrendsPanel />
+            <HashtagsPanel />
+            <WhoToFollowPanel />
+            <GroupSidebarPanel />
+            <LinkFooter />
+          </Fragment>
+        )}
+      >
+        <TimelineComposeBlock autoFocus={false} />
+        <Divider />
+        {children}
+      </DefaultLayout>
+    )
+  }
+}

app/javascript/gabsocial/pages/groups_page.js

@@ -1,9 +1,24 @@
 import { Fragment } from 'react'
+import { openModal } from '../actions/modal'
 import LinkFooter from '../components/link_footer'
 import GroupsPanel from '../components/panel/groups_panel'
+import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
 import DefaultLayout from '../layouts/default_layout'
 
-export default class GroupsPage extends PureComponent {
+
+const mapDispatchToProps = dispatch => ({
+  onOpenGroupCreateModal() {
+    dispatch(openModal('GROUP_CREATE'))
+  },
+})
+
+export default
+@connect(null, mapDispatchToProps)
+class GroupsPage extends PureComponent {
+
+  static propTypes = {
+    onOpenGroupCreateModal: PropTypes.func.isRequired,
+  }
 
   componentDidMount() {
     document.title = 'Groups - Gab'
@@ -18,7 +33,7 @@ export default class GroupsPage extends PureComponent {
   }
 
   render() {
-    const { children } = this.props
+    const { children, onOpenGroupCreateModal } = this.props
 
     const tabs = [
       {
@@ -44,12 +59,13 @@ export default class GroupsPage extends PureComponent {
         title='Groups'
         actions={[
           {
-            icon: 'list-delete',
-            onClick: this.handleClickEditLists
+            icon: 'group-add',
+            onClick: onOpenGroupCreateModal
           },
         ]}
         layout={(
           <Fragment>
+            <WhoToFollowPanel />
             <GroupsPanel slim />
             <LinkFooter />
           </Fragment>

app/javascript/gabsocial/pages/hashtag_page.js

@@ -0,0 +1,61 @@
+import { Fragment } from 'react'
+import { openModal } from '../actions/modal'
+import GroupSidebarPanel from '../components/panel/groups_panel'
+import LinkFooter from '../components/link_footer'
+import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
+import ProgressPanel from '../components/panel/progress_panel'
+import UserPanel from '../components/panel/user_panel'
+import TrendsPanel from '../components/panel/trends_panel'
+import HashtagsPanel from '../components/panel/hashtags_panel'
+import DefaultLayout from '../layouts/default_layout'
+import TimelineComposeBlock from '../components/timeline_compose_block'
+import Divider from '../components/divider'
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenHashtagPageSettingsModal(hashtag) {
+    dispatch(openModal('HASHTAG_TIMELINE_SETTINGS', {
+      hashtag,
+    }))
+  },
+})
+
+export default
+@connect(null, mapDispatchToProps)
+class HashtagPage extends PureComponent {
+
+  static propTypes = {
+    onOpenHashtagPageSettingsModal: PropTypes.func.isRequired,
+  }
+
+  componentDidMount() {
+    document.title = '(1) Tag - Gab'
+  }
+
+  render() {
+    const { children, onOpenHashtagPageSettingsModal } = this.props
+
+    return (
+      <DefaultLayout
+        title='Hashtag'
+        actions={[
+          {
+            icon: 'ellipsis',
+            onClick: onOpenHashtagPageSettingsModal,
+          },
+        ]}
+        layout={(
+          <Fragment>
+            <ProgressPanel />
+            <TrendsPanel />
+            <HashtagsPanel />
+            <WhoToFollowPanel />
+            <GroupSidebarPanel />
+            <LinkFooter />
+          </Fragment>
+        )}
+      >
+        {children}
+      </DefaultLayout>
+    )
+  }
+}

app/javascript/gabsocial/pages/list_page.js

@@ -1,21 +1,37 @@
 import { Fragment } from 'react'
 import ImmutablePropTypes from 'react-immutable-proptypes'
 import ImmutablePureComponent from 'react-immutable-pure-component'
+import { openModal } from '../actions/modal'
 import LinkFooter from '../components/link_footer'
 import DefaultLayout from '../layouts/default_layout'
 import ListDetailsPanel from '../components/panel/list_details_panel'
+import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
+import TrendsPanel from '../components/panel/trends_panel'
 
 const mapStateToProps = (state, props) => ({
   list: state.getIn(['lists', props.params.id]),
-});
+})
+
+const mapDispatchToProps = (dispatch, { list }) => ({
+  onOpenListEditModal() {
+    dispatch(openModal('GROUP_DELETE', {
+      list,
+    }))
+  },
+  onOpenListTimelineSettingsModal() {
+    dispatch(openModal('LIST_TIMELINE_SETTINGS'))
+  },
+})
 
 export default
-@connect(mapStateToProps)
+@connect(mapStateToProps, mapDispatchToProps)
 class ListPage extends ImmutablePureComponent {
 
   static propTypes = {
     list: ImmutablePropTypes.map,
-  };
+    onOpenListEditModal: PropTypes.func.isRequired,
+    onOpenListTimelineSettingsModal: PropTypes.func.isRequired,
+  }
 
   componentDidMount() {
 		const { list } = this.props
@@ -23,27 +39,34 @@ class ListPage extends ImmutablePureComponent {
     document.title = `List / ${listTitle} - Gab`
   }
   
-  handleEditListTimeline () {
-    console.log("handleEditListTimeline")
-  }
-
   render() {
-    const { children, list } = this.props
+    const {
+      children,
+      list,
+      onOpenListEditModal,
+      onOpenListTimelineSettingsModal
+    } = this.props
 
-    const title = list ? list.get('title') : ''
+    const title = !!list ? list.get('title') : ''
 
     return (
       <DefaultLayout
         title={title}
         actions={[
+          {
+            icon: 'list-edit',
+            onClick: onOpenListEditModal,
+          },
           {
             icon: 'ellipsis',
-            onClick: this.handleEditListTimeline
+            onClick: onOpenListTimelineSettingsModal,
           },
         ]}
         layout={(
           <Fragment>
             <ListDetailsPanel />
+            <TrendsPanel />
+            <WhoToFollowPanel />
             <LinkFooter />
           </Fragment>
         )}

app/javascript/gabsocial/pages/lists_page.js

@@ -1,37 +1,38 @@
 import { Fragment } from 'react'
+import { openModal } from '../actions/modal';
 import LinkFooter from '../components/link_footer'
 import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
 import TrendsPanel from '../components/panel/trends_panel'
 import DefaultLayout from '../layouts/default_layout'
 
-export default class ListsPage extends PureComponent {
+const mapDispatchToProps = dispatch => ({
+  onOpenListCreateModal() {
+    dispatch(openModal('LIST_CREATE'))
+  },
+})
+
+export default
+@connect(null, mapDispatchToProps)
+class ListsPage extends PureComponent {
+
+  static propTypes = {
+    onOpenListCreateModal: PropTypes.func.isRequired,
+  }
 
   componentDidMount() {
     document.title = 'Lists - Gab'
   }
-  
-  handleClickNewList () {
-    console.log("handleClickNewList")
-  }
-
-  handleClickEditLists () {
-    console.log("handleClickEditLists")
-  }
 
   render() {
-    const { children } = this.props
+    const { children, onOpenListCreateModal } = this.props
 
     return (
       <DefaultLayout
         title='Lists'
         actions={[
-          {
-            icon: 'list-delete',
-            onClick: this.handleClickEditLists
-          },
           {
             icon: 'list-add',
-            onClick: this.handleClickNewList
+            onClick: onOpenListCreateModal
           },
         ]}
         layout={(

app/javascript/gabsocial/pages/shortcuts_page.js

@@ -0,0 +1,62 @@
+import { Fragment } from 'react'
+import { openModal } from '../actions/modal'
+import GroupSidebarPanel from '../components/panel/groups_panel'
+import LinkFooter from '../components/link_footer'
+import WhoToFollowPanel from '../components/panel/who_to_follow_panel'
+import ProgressPanel from '../components/panel/progress_panel'
+import UserPanel from '../components/panel/user_panel'
+import TrendsPanel from '../components/panel/trends_panel'
+import HashtagsPanel from '../components/panel/hashtags_panel'
+import DefaultLayout from '../layouts/default_layout'
+import TimelineComposeBlock from '../components/timeline_compose_block'
+import Divider from '../components/divider'
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenHomePageSettingsModal() {
+    dispatch(openModal('HOME_TIMELINE_SETTINGS'))
+  },
+})
+
+export default
+@connect(null, mapDispatchToProps)
+class ShortcutsPage extends PureComponent {
+
+  static propTypes = {
+    onOpenHomePageSettingsModal: PropTypes.func.isRequired,
+  }
+
+  componentDidMount() {
+    document.title = '(1) Home - Gab'
+  }
+
+  render() {
+    const { children, onOpenHomePageSettingsModal } = this.props
+
+    return (
+      <DefaultLayout
+        title='Shortcuts'
+        actions={[
+          {
+            icon: 'ellipsis',
+            onClick: onOpenHomePageSettingsModal,
+          },
+        ]}
+        layout={(
+          <Fragment>
+            <UserPanel />
+            <ProgressPanel />
+            <TrendsPanel />
+            <HashtagsPanel />
+            <WhoToFollowPanel />
+            <GroupSidebarPanel />
+            <LinkFooter />
+          </Fragment>
+        )}
+      >
+        <TimelineComposeBlock autoFocus={false} />
+        <Divider />
+        {children}
+      </DefaultLayout>
+    )
+  }
+}