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 import { favIconPngUrl, favIconUrl } from "../utils";
  15
  16 export interface AppProps {
  17   siteRes: GetSiteResponse;
  18 }
  19
  20 export class App extends Component<AppProps, any> {
  21   constructor(props: any, context: any) {
  22     super(props, context);
  23   }
  24   render() {
  25     let siteRes = this.props.siteRes;
  26     return (
  27       <>
  28         <Provider i18next={i18n}>
  29           <div>
  30             <Theme localUserView={siteRes.my_user} />
  31             {siteRes &&
  32               siteRes.site_view &&
  33               this.props.siteRes.site_view.site.icon && (
  34                 <Helmet>
  35                   <link
  36                     id="favicon"
  37                     rel="shortcut icon"
  38                     type="image/x-icon"
  39                     href={this.props.siteRes.site_view.site.icon || favIconUrl}
  40                   />
  41                   <link
  42                     rel="apple-touch-icon"
  43                     href={
  44                       this.props.siteRes.site_view.site.icon || favIconPngUrl
  45                     }
  46                   />
  47                 </Helmet>
  48               )}
  49             <Navbar site_res={this.props.siteRes} />
  50             <div class="mt-4 p-0 fl-1">
  51               <Switch>
  52                 {routes.map(({ path, exact, component: C, ...rest }) => (
  53                   <Route
  54                     key={path}
  55                     path={path}
  56                     exact={exact}
  57                     render={props => <C {...props} {...rest} />}
  58                   />
  59                 ))}
  60                 <Route render={props => <NoMatch {...props} />} />
  61               </Switch>
  62               <Symbols />
  63             </div>
  64             <Footer site={this.props.siteRes} />
  65           </div>
  66         </Provider>
  67       </>
  68     );
  69   }
  70 }