Progress

app/javascript/gabsocial/features/ui/ui.js

@@ -30,38 +30,39 @@ import HomePage from '../../pages/home_page'
 import NotificationsPage from '../../pages/notifications_page'
 import ListPage from '../../pages/list_page'
 import ListsPage from '../../pages/lists_page'
+import BasicPage from '../../pages/basic_page'
 import SettingsPage from '../../pages/settings_page'
 // import GroupSidebarPanel from '../groups/sidebar_panel'
 
 import {
-  Status,
-  // GettingStarted,
-  CommunityTimeline,
+  AccountGallery,
   AccountTimeline,
-  // AccountGallery,
-  HomeTimeline,
+  Blocks,
+  CommunityTimeline,
+  DomainBlocks,
+  Explore,
+  Favorites,
+  FavoritedStatuses,
   Followers,
   Following,
-  // Reblogs,
-  // DirectTimeline,
-  // HashtagTimeline,
-  Notifications,
-  // FollowRequests,
+  FollowRequests,
   GenericNotFound,
-  FavoritedStatuses,
-  // Blocks,
-  // DomainBlocks,
-  // Mutes,
-  Search,
-  // Explore,
+  GettingStarted,
   GroupsCollection,
-  GroupTimeline,
-  ListTimeline,
-  ListsDirectory,
-  GroupMembers,
-  GroupRemovedAccounts,
   GroupCreate,
   GroupEdit,
+  GroupMembers,
+  GroupRemovedAccounts,
+  GroupTimeline,
+  HashtagTimeline,
+  HomeTimeline,
+  ListsDirectory,
+  ListTimeline,
+  Mutes,
+  Notifications,
+  Reblogs,
+  Search,
+  Status,
 } from './util/async-components'
 import { me, meUsername } from '../../initial_state'
 
@@ -86,7 +87,6 @@ const keyMap = {
   new: 'n',
   search: 's',
   forceNew: 'option+n',
-  focusColumn: ['1', '2', '3', '4', '5', '6', '7', '8', '9'],
   reply: 'r',
   Favorite: 'f',
   boost: 'b',
@@ -100,13 +100,10 @@ const keyMap = {
   goToNotifications: 'g n',
   goToStart: 'g s',
   goToFavorites: 'g f',
-  goToPinned: 'g p',
   goToProfile: 'g u',
   goToBlocked: 'g b',
   goToMuted: 'g m',
   goToRequests: 'g r',
-  toggleHidden: 'x',
-  toggleSensitive: 'h',
 }
 
 class SwitchingArea extends PureComponent {
@@ -146,7 +143,7 @@ class SwitchingArea extends PureComponent {
         <Redirect from='/' to='/home' exact />
         <WrappedRoute path='/home' exact page={HomePage} component={HomeTimeline} content={children} />
 
-        <WrappedRoute path='/timeline/all' exact page={HomePage} component={CommunityTimeline} content={children} />
+        <WrappedRoute path='/timeline/all' exact page={BasicPage} component={CommunityTimeline} content={children} componentParams={{ title: 'Hashtag Timeline' }} />
 
         <WrappedRoute path='/groups' exact page={GroupsPage} component={GroupsCollection} content={children} componentParams={{ activeTab: 'featured' }} />
         <WrappedRoute path='/groups/browse/member' exact page={GroupsPage} component={GroupsCollection} content={children} componentParams={{ activeTab: 'member' }} />
@@ -158,7 +155,7 @@ class SwitchingArea extends PureComponent {
         <WrappedRoute path='/groups/:id/edit' page={GroupPage} component={GroupEdit} content={children} />
         <WrappedRoute path='/groups/:id' page={GroupPage} component={GroupTimeline} content={children} />
 
-        { /* <WrappedRoute path='/tags/:id' publicRoute component={HashtagTimeline} content={children} /> */}
+        <WrappedRoute path='/tags/:id' publicRoute page={BasicPage} component={HashtagTimeline} content={children} componentParams={{ title: 'Hashtag' }} />
 
         <WrappedRoute path='/lists' exact page={ListsPage} component={ListsDirectory} content={children} />
         <WrappedRoute path='/list/:id' page={ListPage} component={ListTimeline} content={children} />
@@ -171,15 +168,15 @@ class SwitchingArea extends PureComponent {
         <WrappedRoute path='/search/groups' exact page={SearchPage} component={Search} content={children} />
 
         {/*
-        <WrappedRoute path='/settings/account' exact page={SettingsPage} component={Mutes} content={children} />
-        <WrappedRoute path='/settings/profile' exact page={SettingsPage} component={Mutes} content={children} />
+        <WrappedRoute path='/settings/account' exact page={SettingsPage} component={AccountSettings} content={children} />
+        <WrappedRoute path='/settings/profile' exact page={SettingsPage} component={ProfileSettings} content={children} />
         <WrappedRoute path='/settings/domain_blocks' exact page={SettingsPage} component={DomainBlocks} content={children} />
-        <WrappedRoute path='/settings/relationships' exact page={SettingsPage} component={DomainBlocks} content={children} />
-        <WrappedRoute path='/settings/filters' exact page={SettingsPage} component={DomainBlocks} content={children} />
+        <WrappedRoute path='/settings/relationships' exact page={SettingsPage} component={RelationshipSettings} content={children} />
+        <WrappedRoute path='/settings/filters' exact page={SettingsPage} component={Filters} content={children} />
         <WrappedRoute path='/settings/blocks' exact page={SettingsPage} component={Blocks} content={children} />
         <WrappedRoute path='/settings/mutes' exact page={SettingsPage} component={Mutes} content={children} />
-        <WrappedRoute path='/settings/development' exact page={SettingsPage} component={Mutes} content={children} />
-        <WrappedRoute path='/settings/billing' exact page={SettingsPage} component={Mutes} content={children} />
+        <WrappedRoute path='/settings/development' exact page={SettingsPage} component={Development} content={children} />
+        <WrappedRoute path='/settings/billing' exact page={SettingsPage} component={Billing} content={children} />
         */ }
 
         <Redirect from='/@:username' to='/:username' exact />
@@ -193,22 +190,25 @@ class SwitchingArea extends PureComponent {
 
         <Redirect from='/@:username/following' to='/:username/following' />
         <WrappedRoute path='/:username/following' page={ProfilePage} component={Following} content={children} />
-        { /*
-        <Redirect from='/@:username/media' to='/:username/media' />
-        <WrappedRoute path='/:username/media' component={AccountGallery} page={ProfilePage} content={children} />
-        */ }
+
+        <Redirect from='/@:username/photos' to='/:username/photos' />
+        <WrappedRoute path='/:username/photos' page={ProfilePage} component={AccountGallery} content={children} componentParams={{ mediaType: 'photo' }} />
+
+        <Redirect from='/@:username/videos' to='/:username/videos' />
+        <WrappedRoute path='/:username/videos' page={ProfilePage} component={AccountGallery} content={children} componentParams={{ mediaType: 'video' }} />
+
         <Redirect from='/@:username/favorites' to='/:username/favorites' />
         <WrappedRoute path='/:username/favorites' page={ProfilePage} component={FavoritedStatuses} content={children} />
 
-        { /*
         <Redirect from='/@:username/posts/:statusId' to='/:username/posts/:statusId' exact />
-        <WrappedRoute path='/:username/posts/:statusId' publicRoute exact component={Status} content={children} />
-        */ }
+        <WrappedRoute path='/:username/posts/:statusId' publicRoute exact page={BasicPage} component={Status} content={children} componentParams={{ title: 'Status' }} />
 
-        { /*
         <Redirect from='/@:username/posts/:statusId/reblogs' to='/:username/posts/:statusId/reblogs' />
-        <WrappedRoute path='/:username/posts/:statusId/reblogs' component={Reblogs} content={children} />
-        */}
+        <WrappedRoute path='/:username/posts/:statusId/reblogs' page={BasicPage} component={Reblogs} content={children} componentParams={{ title: 'Reblogs' }} />
+
+        <Redirect from='/@:username/posts/:statusId/favorites' to='/:username/posts/:statusId/favorites' />
+        <WrappedRoute path='/:username/posts/:statusId/favorites' page={BasicPage} component={Favorites} content={children} componentParams={{ title: 'Favorites' }} />
+
         <WrappedRoute page={ErrorPage} component={GenericNotFound} content={children} />
       </Switch>
     )
@@ -273,7 +273,7 @@ class UI extends PureComponent {
 
     if (e.dataTransfer && Array.from(e.dataTransfer.types).includes('Files')) {
       this.setState({
-        draggingOver: true
+        draggingOver: true,
       })
     }
   }
@@ -417,24 +417,6 @@ class UI extends PureComponent {
     this.props.dispatch(resetCompose())
   }
 
-  handleHotkeyFocusColumn = e => {
-    const index = (e.key * 1) + 1 // First child is drawer, skip that
-    const column = this.node.querySelector(`.column:nth-child(${index})`)
-    if (!column) return
-    const container = column.querySelector('.scrollable')
-
-    if (container) {
-      const status = container.querySelector('.focusable')
-
-      if (status) {
-        if (container.scrollTop > status.offsetTop) {
-          status.scrollIntoView(true)
-        }
-        status.focus()
-      }
-    }
-  }
-
   handleHotkeyBack = () => {
     if (window.history && window.history.length === 1) {
       this.context.router.history.push('/home') // homehack
@@ -467,10 +449,6 @@ class UI extends PureComponent {
     this.context.router.history.push(`/${meUsername}/favorites`)
   }
 
-  handleHotkeyGoToPinned = () => {
-    this.context.router.history.push(`/${meUsername}/pins`)
-  }
-
   handleHotkeyGoToProfile = () => {
     this.context.router.history.push(`/${meUsername}`)
   }
@@ -500,13 +478,11 @@ class UI extends PureComponent {
       new: this.handleHotkeyNew,
       search: this.handleHotkeySearch,
       forceNew: this.handleHotkeyForceNew,
-      focusColumn: this.handleHotkeyFocusColumn,
       back: this.handleHotkeyBack,
       goToHome: this.handleHotkeyGoToHome,
       goToNotifications: this.handleHotkeyGoToNotifications,
       goToStart: this.handleHotkeyGoToStart,
       goToFavorites: this.handleHotkeyGoToFavorites,
-      goToPinned: this.handleHotkeyGoToPinned,
       goToProfile: this.handleHotkeyGoToProfile,
       goToBlocked: this.handleHotkeyGoToBlocked,
       goToMuted: this.handleHotkeyGoToMuted,

app/javascript/gabsocial/features/ui/util/async-components.js

@@ -1,63 +1,3 @@
-export function EmojiPicker() {
-  return import(/* webpackChunkName: "emoji_picker" */'../../../components/emoji/emoji_picker')
-}
-
-export function Compose() {
-  return import(/* webpackChunkName: "features/compose" */'../../compose')
-}
-
-export function Notifications() {
-  return import(/* webpackChunkName: "features/notifications" */'../../notifications')
-}
-
-export function HomeTimeline() {
-  return import(/* webpackChunkName: "features/home_timeline" */'../../home_timeline')
-}
-
-export function CommunityTimeline() {
-  return import(/* webpackChunkName: "features/community_timeline" */'../../community_timeline')
-}
-
-export function HashtagTimeline() {
-  return import(/* webpackChunkName: "features/hashtag_timeline" */'../../hashtag_timeline')
-}
-
-export function ListTimeline() {
-  return import(/* webpackChunkName: "features/list_timeline" */'../../list_timeline')
-}
-
-export function GroupTimeline() {
-  return import(/* webpackChunkName: "features/group_timeline" */'../../group_timeline')
-}
-
-export function GroupMembers() {
-  return import(/* webpackChunkName: "features/group_members" */'../../group_members')
-}
-
-export function GroupRemovedAccounts() {
-  return import(/* webpackChunkName: "features/group_removed_accounts" */'../../group_removed_accounts')
-}
-
-export function GroupCreate() {
-  return import(/* webpackChunkName: "features/groups_create" */'../../group_create')
-}
-
-export function GroupEdit() {
-  return import(/* webpackChunkName: "features/groups/timeline" */'../../groups/edit')
-}
-
-export function GroupsCollection() {
-  return import(/* webpackChunkName: "features/groups_collection" */'../../g../../groups_collection')
-}
-
-export function ListsDirectory() {
-  return import(/* webpackChunkName: "features/lists_directory" */'../../lists_directory')
-}
-
-export function Status() {
-  return import(/* webpackChunkName: "features/status" */'../../status')
-}
-
 export function AccountTimeline() {
   return import(/* webpackChunkName: "features/account_timeline" */'../../account_timeline')
 }
@@ -66,6 +6,30 @@ export function AccountGallery() {
   return import(/* webpackChunkName: "features/account_gallery" */'../../account_gallery')
 }
 
+export function Blocks() {
+  return import(/* webpackChunkName: "features/blocks" */'../../blocks')
+}
+
+export function CommunityTimeline() {
+  return import(/* webpackChunkName: "features/community_timeline" */'../../community_timeline')
+}
+
+export function Compose() {
+  return import(/* webpackChunkName: "features/compose" */'../../compose')
+}
+
+export function DomainBlocks() {
+  return import(/* webpackChunkName: "features/domain_blocks" */'../../domain_blocks')
+}
+
+export function EmbedModal() {
+  return import(/* webpackChunkName: "modals/embed_modal" */'../../../components/modal/embed_modal')
+}
+
+export function EmojiPicker() {
+  return import(/* webpackChunkName: "emoji_picker" */'../../../components/emoji/emoji_picker')
+}
+
 export function Followers() {
   return import(/* webpackChunkName: "features/followers" */'../../followers')
 }
@@ -74,28 +38,68 @@ export function Following() {
   return import(/* webpackChunkName: "features/following" */'../../following')
 }
 
-export function Reblogs() {
-  return import(/* webpackChunkName: "features/reblogs" */'../../reblogs')
-}
-
 export function FollowRequests() {
   return import(/* webpackChunkName: "features/follow_requests" */'../../follow_requests')
 }
 
-export function GenericNotFound() {
-  return import(/* webpackChunkName: "features/generic_not_found" */'../../generic_not_found')
-}
-
 export function FavoritedStatuses() {
   return import(/* webpackChunkName: "features/favorited_statuses" */'../../favorited_statuses')
 }
 
-export function Blocks() {
-  return import(/* webpackChunkName: "features/blocks" */'../../blocks')
+export function GenericNotFound() {
+  return import(/* webpackChunkName: "features/generic_not_found" */'../../generic_not_found')
 }
 
-export function DomainBlocks() {
-  return import(/* webpackChunkName: "features/domain_blocks" */'../../domain_blocks')
+export function GroupsCollection() {
+  return import(/* webpackChunkName: "features/groups_collection" */'../../g../../groups_collection')
+}
+
+export function GroupCreate() {
+  return import(/* webpackChunkName: "features/groups_create" */'../../group_create')
+}
+
+export function GroupEdit() {
+  return import(/* webpackChunkName: "features/groups/timeline" */'../../groups/edit')
+}
+
+export function GroupMembers() {
+  return import(/* webpackChunkName: "features/group_members" */'../../group_members')
+}
+
+export function GroupRemovedAccounts() {
+  return import(/* webpackChunkName: "features/group_removed_accounts" */'../../group_removed_accounts')
+}
+
+export function GroupTimeline() {
+  return import(/* webpackChunkName: "features/group_timeline" */'../../group_timeline')
+}
+
+export function HashtagTimeline() {
+  return import(/* webpackChunkName: "features/hashtag_timeline" */'../../hashtag_timeline')
+}
+
+export function HomeTimeline() {
+  return import(/* webpackChunkName: "features/home_timeline" */'../../home_timeline')
+}
+
+export function ListAdder() {
+  return import(/*webpackChunkName: "features/list_adder" */'../../list_adder')
+}
+
+export function ListsDirectory() {
+  return import(/* webpackChunkName: "features/lists_directory" */'../../lists_directory')
+}
+
+export function ListEditor() {
+  return import(/* webpackChunkName: "features/list_editor" */'../../list_editor')
+}
+
+export function ListTimeline() {
+  return import(/* webpackChunkName: "features/list_timeline" */'../../list_timeline')
+}
+
+export function MediaGallery() {
+  return import(/* webpackChunkName: "status/media_gallery" */'../../../components/media_gallery')
 }
 
 export function Mutes() {
@@ -106,34 +110,30 @@ export function MuteModal() {
   return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal/mute_modal')
 }
 
-export function StatusRevisionModal() {
-  return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal/status_revision_modal')
+export function Notifications() {
+  return import(/* webpackChunkName: "features/notifications" */'../../notifications')
+}
+
+export function Reblogs() {
+  return import(/* webpackChunkName: "features/reblogs" */'../../reblogs')
 }
 
 export function ReportModal() {
   return import(/* webpackChunkName: "modals/report_modal" */'../../../components/modal/report_modal')
 }
 
-export function MediaGallery() {
-  return import(/* webpackChunkName: "status/media_gallery" */'../../../components/media_gallery')
+export function Search() {
+  return import(/*webpackChunkName: "features/search" */'../../search')
+}
+
+export function Status() {
+  return import(/* webpackChunkName: "features/status" */'../../status')
+}
+
+export function StatusRevisionModal() {
+  return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal/status_revision_modal')
 }
 
 export function Video() {
   return import(/* webpackChunkName: "features/video" */'../../video')
 }
-
-export function EmbedModal() {
-  return import(/* webpackChunkName: "modals/embed_modal" */'../../../components/modal/embed_modal')
-}
-
-export function ListEditor() {
-  return import(/* webpackChunkName: "features/list_editor" */'../../list_editor')
-}
-
-export function ListAdder() {
-  return import(/*webpackChunkName: "features/list_adder" */'../../list_adder')
-}
-
-export function Search() {
-  return import(/*webpackChunkName: "features/search" */'../../search')
-}