Add "not found" component to UI
This commit is contained in:
		
							parent
							
								
									a1db2a191b
								
							
						
					
					
						commit
						1e9d2c4b1e
					
				
					 5 changed files with 44 additions and 11 deletions
				
			
		| 
						 | 
				
			
			@ -1,15 +1,17 @@
 | 
			
		|||
import { FormattedMessage } from 'react-intl';
 | 
			
		||||
 | 
			
		||||
const LoadingIndicator = () => {
 | 
			
		||||
  const style = {
 | 
			
		||||
    textAlign: 'center',
 | 
			
		||||
    fontSize: '16px',
 | 
			
		||||
    fontWeight: '500',
 | 
			
		||||
    color: '#616b86',
 | 
			
		||||
    paddingTop: '120px'
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  return <div style={style}><FormattedMessage id='loading_indicator.label' defaultMessage='Loading...' /></div>;
 | 
			
		||||
const style = {
 | 
			
		||||
  textAlign: 'center',
 | 
			
		||||
  fontSize: '16px',
 | 
			
		||||
  fontWeight: '500',
 | 
			
		||||
  color: '#616b86',
 | 
			
		||||
  paddingTop: '120px'
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
const LoadingIndicator = () => (
 | 
			
		||||
  <div style={style}>
 | 
			
		||||
    <FormattedMessage id='loading_indicator.label' defaultMessage='Loading...' />
 | 
			
		||||
  </div>
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
export default LoadingIndicator;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -0,0 +1,17 @@
 | 
			
		|||
import { FormattedMessage } from 'react-intl';
 | 
			
		||||
 | 
			
		||||
const style = {
 | 
			
		||||
  textAlign: 'center',
 | 
			
		||||
  fontSize: '16px',
 | 
			
		||||
  fontWeight: '500',
 | 
			
		||||
  color: '#616b86',
 | 
			
		||||
  paddingTop: '120px'
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
const MissingIndicator = () => (
 | 
			
		||||
  <div style={style}>
 | 
			
		||||
    <FormattedMessage id='missing_indicator.label' defaultMessage='Not found' />
 | 
			
		||||
  </div>
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
export default MissingIndicator;
 | 
			
		||||
| 
						 | 
				
			
			@ -33,6 +33,7 @@ import Favourites from '../features/favourites';
 | 
			
		|||
import HashtagTimeline from '../features/hashtag_timeline';
 | 
			
		||||
import Notifications from '../features/notifications';
 | 
			
		||||
import FollowRequests from '../features/follow_requests';
 | 
			
		||||
import GenericNotFound from '../features/generic_not_found';
 | 
			
		||||
import { IntlProvider, addLocaleData } from 'react-intl';
 | 
			
		||||
import en from 'react-intl/locale-data/en';
 | 
			
		||||
import de from 'react-intl/locale-data/de';
 | 
			
		||||
| 
						 | 
				
			
			@ -125,6 +126,7 @@ const Mastodon = React.createClass({
 | 
			
		|||
              </Route>
 | 
			
		||||
 | 
			
		||||
              <Route path='follow_requests' component={FollowRequests} />
 | 
			
		||||
              <Route path='*' component={GenericNotFound} />
 | 
			
		||||
            </Route>
 | 
			
		||||
          </Router>
 | 
			
		||||
        </Provider>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -0,0 +1,10 @@
 | 
			
		|||
import Column from '../ui/components/column';
 | 
			
		||||
import MissingIndicator from '../../components/missing_indicator';
 | 
			
		||||
 | 
			
		||||
const GenericNotFound = () => (
 | 
			
		||||
  <Column>
 | 
			
		||||
    <MissingIndicator />
 | 
			
		||||
  </Column>
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
export default GenericNotFound;
 | 
			
		||||
| 
						 | 
				
			
			@ -48,7 +48,8 @@ const Status = React.createClass({
 | 
			
		|||
    dispatch: React.PropTypes.func.isRequired,
 | 
			
		||||
    status: ImmutablePropTypes.map,
 | 
			
		||||
    ancestorsIds: ImmutablePropTypes.list,
 | 
			
		||||
    descendantsIds: ImmutablePropTypes.list
 | 
			
		||||
    descendantsIds: ImmutablePropTypes.list,
 | 
			
		||||
    me: React.PropTypes.number
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
  mixins: [PureRenderMixin],
 | 
			
		||||
| 
						 | 
				
			
			@ -81,6 +82,7 @@ const Status = React.createClass({
 | 
			
		|||
 | 
			
		||||
  handleMentionClick (account) {
 | 
			
		||||
    this.props.dispatch(mentionCompose(account));
 | 
			
		||||
 | 
			
		||||
    if (isMobile(window.innerWidth)) {
 | 
			
		||||
      this.context.router.push('/statuses/new');
 | 
			
		||||
    }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue