Fix #110 - Make web UI use browser history, change links in e-mails to link to that
This commit is contained in:
		
							parent
							
								
									c4eb63c1d4
								
							
						
					
					
						commit
						d42ed78aa4
					
				
					 10 changed files with 51 additions and 46 deletions
				
			
		|  | @ -52,7 +52,7 @@ const StatusContent = React.createClass({ | |||
| 
 | ||||
|     if (e.button === 0) { | ||||
|       e.preventDefault(); | ||||
|       this.context.router.push(`/statuses/tag/${hashtag}`); | ||||
|       this.context.router.push(`/timelines/tag/${hashtag}`); | ||||
|     } | ||||
|   }, | ||||
| 
 | ||||
|  |  | |||
|  | @ -1,39 +1,44 @@ | |||
| import { Provider }       from 'react-redux'; | ||||
| import configureStore     from '../store/configureStore'; | ||||
| import { Provider } from 'react-redux'; | ||||
| import configureStore from '../store/configureStore'; | ||||
| import { | ||||
|   refreshTimelineSuccess, | ||||
|   updateTimeline, | ||||
|   deleteFromTimelines, | ||||
|   refreshTimeline | ||||
| }                         from '../actions/timelines'; | ||||
| } from '../actions/timelines'; | ||||
| import { setAccessToken } from '../actions/meta'; | ||||
| import { setAccountSelf } from '../actions/accounts'; | ||||
| import PureRenderMixin    from 'react-addons-pure-render-mixin'; | ||||
| import PureRenderMixin from 'react-addons-pure-render-mixin'; | ||||
| import createBrowserHistory from 'history/lib/createBrowserHistory'; | ||||
| import { | ||||
|   applyRouterMiddleware, | ||||
|   useRouterHistory, | ||||
|   Router, | ||||
|   Route, | ||||
|   hashHistory, | ||||
|   IndexRoute | ||||
| }                         from 'react-router'; | ||||
| import { useScroll }      from 'react-router-scroll'; | ||||
| import UI                 from '../features/ui'; | ||||
| import Account            from '../features/account'; | ||||
| import Status             from '../features/status'; | ||||
| import GettingStarted     from '../features/getting_started'; | ||||
| import PublicTimeline     from '../features/public_timeline'; | ||||
| import AccountTimeline    from '../features/account_timeline'; | ||||
| import HomeTimeline       from '../features/home_timeline'; | ||||
| import MentionsTimeline   from '../features/mentions_timeline'; | ||||
| import Compose            from '../features/compose'; | ||||
| import Followers          from '../features/followers'; | ||||
| import Following          from '../features/following'; | ||||
| import Reblogs            from '../features/reblogs'; | ||||
| import Favourites         from '../features/favourites'; | ||||
| import HashtagTimeline    from '../features/hashtag_timeline'; | ||||
| } from 'react-router'; | ||||
| import { useScroll } from 'react-router-scroll'; | ||||
| import UI from '../features/ui'; | ||||
| import Account from '../features/account'; | ||||
| import Status from '../features/status'; | ||||
| import GettingStarted from '../features/getting_started'; | ||||
| import PublicTimeline from '../features/public_timeline'; | ||||
| import AccountTimeline from '../features/account_timeline'; | ||||
| import HomeTimeline from '../features/home_timeline'; | ||||
| import MentionsTimeline from '../features/mentions_timeline'; | ||||
| import Compose from '../features/compose'; | ||||
| import Followers from '../features/followers'; | ||||
| import Following from '../features/following'; | ||||
| import Reblogs from '../features/reblogs'; | ||||
| import Favourites from '../features/favourites'; | ||||
| import HashtagTimeline from '../features/hashtag_timeline'; | ||||
| 
 | ||||
| const store = configureStore(); | ||||
| 
 | ||||
| const browserHistory = useRouterHistory(createBrowserHistory)({ | ||||
|   basename: '/web' | ||||
| }); | ||||
| 
 | ||||
| const Mastodon = React.createClass({ | ||||
| 
 | ||||
|   propTypes: { | ||||
|  | @ -78,24 +83,24 @@ const Mastodon = React.createClass({ | |||
|   render () { | ||||
|     return ( | ||||
|       <Provider store={store}> | ||||
|         <Router history={hashHistory} render={applyRouterMiddleware(useScroll())}> | ||||
|         <Router history={browserHistory} render={applyRouterMiddleware(useScroll())}> | ||||
|           <Route path='/' component={UI}> | ||||
|             <IndexRoute component={GettingStarted} /> | ||||
|             <Route path='/statuses/new' component={Compose} /> | ||||
| 
 | ||||
|             <Route path='/statuses/home' component={HomeTimeline} /> | ||||
|             <Route path='/statuses/mentions' component={MentionsTimeline} /> | ||||
|             <Route path='/statuses/all' component={PublicTimeline} /> | ||||
|             <Route path='/statuses/tag/:id' component={HashtagTimeline} /> | ||||
|             <Route path='timelines/home' component={HomeTimeline} /> | ||||
|             <Route path='timelines/mentions' component={MentionsTimeline} /> | ||||
|             <Route path='timelines/public' component={PublicTimeline} /> | ||||
|             <Route path='timelines/tag/:id' component={HashtagTimeline} /> | ||||
| 
 | ||||
|             <Route path='/statuses/:statusId' component={Status} /> | ||||
|             <Route path='/statuses/:statusId/reblogs' component={Reblogs} /> | ||||
|             <Route path='/statuses/:statusId/favourites' component={Favourites} /> | ||||
|             <Route path='statuses/new' component={Compose} /> | ||||
|             <Route path='statuses/:statusId' component={Status} /> | ||||
|             <Route path='statuses/:statusId/reblogs' component={Reblogs} /> | ||||
|             <Route path='statuses/:statusId/favourites' component={Favourites} /> | ||||
| 
 | ||||
|             <Route path='/accounts/:accountId' component={Account}> | ||||
|             <Route path='accounts/:accountId' component={Account}> | ||||
|               <IndexRoute component={AccountTimeline} /> | ||||
|               <Route path='/accounts/:accountId/followers' component={Followers} /> | ||||
|               <Route path='/accounts/:accountId/following' component={Following} /> | ||||
|               <Route path='followers' component={Followers} /> | ||||
|               <Route path='following' component={Following} /> | ||||
|             </Route> | ||||
|           </Route> | ||||
|         </Router> | ||||
|  |  | |||
|  | @ -88,7 +88,7 @@ const Search = React.createClass({ | |||
|     if (suggestion.type === 'account') { | ||||
|       this.context.router.push(`/accounts/${suggestion.id}`); | ||||
|     } else { | ||||
|       this.context.router.push(`/statuses/tag/${suggestion.id}`); | ||||
|       this.context.router.push(`/timelines/tag/${suggestion.id}`); | ||||
|     } | ||||
|   }, | ||||
| 
 | ||||
|  |  | |||
|  | @ -9,7 +9,7 @@ const GettingStarted = () => { | |||
|         <p>You can follow people if you know their username and the domain they are on by entering an e-mail-esque address into the form in the bottom of the sidebar.</p> | ||||
|         <p>If the target user is on the same domain as you, just the username will work. The same rule applies to mentioning people in statuses.</p> | ||||
|         <p>The developer of this project can be followed as Gargron@mastodon.social</p> | ||||
|         <p>Also <Link to='/statuses/all' style={{ color: '#2b90d9', textDecoration: 'none' }}>check out the public timeline for a start</Link>!</p> | ||||
|         <p>Also <Link to='/timelines/public' style={{ color: '#2b90d9', textDecoration: 'none' }}>check out the public timeline for a start</Link>!</p> | ||||
|       </div> | ||||
|     </Column> | ||||
|   ); | ||||
|  |  | |||
|  | @ -19,7 +19,7 @@ const NavigationBar = React.createClass({ | |||
| 
 | ||||
|         <div style={{ flex: '1 1 auto', marginLeft: '8px', color: '#9baec8' }}> | ||||
|           <strong style={{ fontWeight: '500', display: 'block', color: '#fff' }}>{this.props.account.get('acct')}</strong> | ||||
|           <a href='/settings/profile' style={{ color: 'inherit', textDecoration: 'none' }}>Settings</a> · <Link to='/statuses/all' style={{ color: 'inherit', textDecoration: 'none' }}>Public timeline</Link> · <a href='/auth/sign_out' data-method='delete' style={{ color: 'inherit', textDecoration: 'none' }}>Logout</a> | ||||
|           <a href='/settings/profile' style={{ color: 'inherit', textDecoration: 'none' }}>Settings</a> · <Link to='/timelines/public' style={{ color: 'inherit', textDecoration: 'none' }}>Public timeline</Link> · <a href='/auth/sign_out' data-method='delete' style={{ color: 'inherit', textDecoration: 'none' }}>Logout</a> | ||||
|         </div> | ||||
|       </div> | ||||
|     ); | ||||
|  |  | |||
|  | @ -28,9 +28,9 @@ const TabsBar = () => { | |||
|   return ( | ||||
|     <div style={outerStyle}> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/new'><i className='fa fa-fw fa-pencil' /> Compose</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/home'><i className='fa fa-fw fa-home' /> Home</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/mentions'><i className='fa fa-fw fa-at' /> Mentions</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/all'><i className='fa fa-fw fa-globe' /> Public</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/timelines/home'><i className='fa fa-fw fa-home' /> Home</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/timelines/mentions'><i className='fa fa-fw fa-at' /> Mentions</Link> | ||||
|       <Link style={tabStyle} activeStyle={tabActiveStyle} to='/timelines/all'><i className='fa fa-fw fa-globe' /> Public</Link> | ||||
|     </div> | ||||
|   ); | ||||
| }; | ||||
|  |  | |||
		Reference in a new issue