sdnr/wt/odlux/framework/src/views/frame.tsx

   1 /**\r
   2  * ============LICENSE_START========================================================================\r
   3  * ONAP : ccsdk feature sdnr wt odlux\r
   4  * =================================================================================================\r
   5  * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.\r
   6  * =================================================================================================\r
   7  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except\r
   8  * in compliance with the License. You may obtain a copy of the License at\r
   9  *\r
  10  * http://www.apache.org/licenses/LICENSE-2.0\r
  11  *\r
  12  * Unless required by applicable law or agreed to in writing, software distributed under the License\r
  13  * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express\r
  14  * or implied. See the License for the specific language governing permissions and limitations under\r
  15  * the License.\r
  16  * ============LICENSE_END==========================================================================\r
  17  */\r
  18 import * as React from 'react';\r
  19 import { HashRouter as Router, Route, Redirect, Switch } from 'react-router-dom';\r
  20 \r
  21 import { withStyles, WithStyles, createStyles, Theme } from '@material-ui/core/styles';\r
  22 import { faHome, faAddressBook, faSignInAlt } from '@fortawesome/free-solid-svg-icons';\r
  23 \r
  24 import AppFrame from '../components/routing/appFrame';\r
  25 import TitleBar from '../components/titleBar';\r
  26 import Menu from '../components/navigationMenu';\r
  27 import ErrorDisplay from '../components/errorDisplay';\r
  28 import SnackDisplay from '../components/material-ui/snackDisplay';\r
  29 \r
  30 import Home from '../views/home';\r
  31 import Login from '../views/login';\r
  32 import About from '../views/about';\r
  33 import Test from '../views/test';\r
  34 \r
  35 import applicationService from '../services/applicationManager';\r
  36 import { SnackbarProvider } from 'notistack';\r
  37 \r
  38 const styles = (theme: Theme) => createStyles({\r
  39   root: {\r
  40     flexGrow: 1,\r
  41     height: '100%',\r
  42     zIndex: 1,\r
  43     overflow: 'hidden',\r
  44     position: 'relative',\r
  45     display: 'flex',\r
  46   },\r
  47   content: {\r
  48     flexGrow: 1,\r
  49     display: "flex",\r
  50     flexDirection: "column",\r
  51     backgroundColor: theme.palette.background.default,\r
  52     padding: theme.spacing(3),\r
  53     minWidth: 0, // So the Typography noWrap works\r
  54   },\r
  55   toolbar: theme.mixins.toolbar\r
  56 });\r
  57 \r
  58 type FrameProps = WithStyles<typeof styles>;\r
  59 \r
  60 class FrameComponent extends React.Component<FrameProps>{\r
  61 \r
  62   render() {\r
  63     const registrations = applicationService.applications;\r
  64     const { classes } = this.props;\r
  65     return (\r
  66       <SnackbarProvider maxSnack={3}>\r
  67         <Router>\r
  68           <div className={classes.root}>\r
  69             <SnackDisplay />\r
  70             <ErrorDisplay />\r
  71             <TitleBar />\r
  72             <Menu />\r
  73             <main className={classes.content}>\r
  74               {\r
  75                 <div className={classes.toolbar} /> //needed for margins, don't remove!\r
  76               }\r
  77               <Switch>\r
  78                 <Route exact path="/" component={() => (\r
  79                   <AppFrame title={"Home"} icon={faHome} >\r
  80                     <Home />\r
  81                   </AppFrame>\r
  82                 )} />\r
  83                 <Route path="/about" component={() => (\r
  84                   <AppFrame title={"About"} icon={faAddressBook} >\r
  85                     <About />\r
  86                   </AppFrame>\r
  87                 )} />\r
  88                 {process.env.NODE_ENV === "development" ? <Route path="/test" component={() => (\r
  89                   <AppFrame title={"Test"} icon={faAddressBook} >\r
  90                     <Test />\r
  91                   </AppFrame>\r
  92                 )} /> : null}\r
  93                 <Route path="/login" component={() => (\r
  94                   <AppFrame title={"Login"} icon={faSignInAlt} >\r
  95                     <Login />\r
  96                   </AppFrame>\r
  97                 )} />\r
  98                 {Object.keys(registrations).map(p => {\r
  99                   const application = registrations[p];\r
 100                   return (<Route key={application.name} path={application.path || `/${application.name}`} component={() => (\r
 101                     <AppFrame title={application.title || (typeof application.menuEntry === 'string' && application.menuEntry) || application.name} icon={application.icon} appId={application.name} >\r
 102                       <application.rootComponent />\r
 103                     </AppFrame>\r
 104                   )} />)\r
 105                 })}\r
 106                 <Redirect to="/" />\r
 107               </Switch>\r
 108             </main>\r
 109           </div>\r
 110         </Router>\r
 111       </SnackbarProvider>\r
 112     );\r
 113   }\r
 114 }\r
 115 \r
 116 export const Frame = withStyles(styles)(FrameComponent);\r
 117 \r
 118 export default Frame;\r