src/shared/components/app.tsx

   1 import { Component } from 'inferno';
   2 import { Route, Switch } from 'inferno-router';
   3 import { Provider } from 'inferno-i18next';
   4 import { Helmet } from 'inferno-helmet';
   5 import { i18n } from '../i18next';
   6 import { routes } from '../routes';
   7 import { Navbar } from './navbar';
   8 import { Footer } from './footer';
   9 import { NoMatch } from './no-match';
  10 import { Theme } from './theme';
  11 import { Symbols } from './symbols';
  12 import { GetSiteResponse } from 'lemmy-js-client';
  13 import './styles.scss';
  14
  15 export interface AppProps {
  16   site: GetSiteResponse;
  17 }
  18
  19 export class App extends Component<AppProps, any> {
  20   constructor(props: any, context: any) {
  21     super(props, context);
  22   }
  23   render() {
  24     return (
  25       <>
  26         <Provider i18next={i18n}>
  27           <div>
  28             <Theme user={this.props.site.my_user} />
  29             {this.props.site &&
  30               this.props.site.site &&
  31               this.props.site.site.icon && (
  32                 <Helmet>
  33                   <link
  34                     id="favicon"
  35                     rel="icon"
  36                     type="image/x-icon"
  37                     href={this.props.site.site.icon}
  38                   />
  39                 </Helmet>
  40               )}
  41             <Navbar site={this.props.site} />
  42             <div class="mt-4 p-0 fl-1">
  43               <Switch>
  44                 {routes.map(({ path, exact, component: C, ...rest }) => (
  45                   <Route
  46                     key={path}
  47                     path={path}
  48                     exact={exact}
  49                     render={props => <C {...props} {...rest} />}
  50                   />
  51                 ))}
  52                 <Route render={props => <NoMatch {...props} />} />
  53               </Switch>
  54               <Symbols />
  55             </div>
  56             <Footer site={this.props.site} />
  57           </div>
  58         </Provider>
  59       </>
  60     );
  61   }
  62 }