update odlux stage 3
[ccsdk/features.git] / sdnr / wt / odlux / framework / src / views / frame.tsx
index fd94331..f2f6f66 100644 (file)
@@ -1,3 +1,20 @@
+/**\r
+ * ============LICENSE_START========================================================================\r
+ * ONAP : ccsdk feature sdnr wt odlux\r
+ * =================================================================================================\r
+ * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.\r
+ * =================================================================================================\r
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except\r
+ * in compliance with the License. You may obtain a copy of the License at\r
+ *\r
+ * http://www.apache.org/licenses/LICENSE-2.0\r
+ *\r
+ * Unless required by applicable law or agreed to in writing, software distributed under the License\r
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express\r
+ * or implied. See the License for the specific language governing permissions and limitations under\r
+ * the License.\r
+ * ============LICENSE_END==========================================================================\r
+ */\r
 import * as React from 'react';\r
 import { HashRouter as Router, Route, Redirect, Switch } from 'react-router-dom';\r
 \r
@@ -13,6 +30,7 @@ import SnackDisplay from '../components/material-ui/snackDisplay';
 import Home from '../views/home';\r
 import Login from '../views/login';\r
 import About from '../views/about';\r
+import Test from '../views/test';\r
 \r
 import applicationService from '../services/applicationManager';\r
 import { SnackbarProvider } from 'notistack';\r
@@ -28,58 +46,73 @@ const styles = (theme: Theme) => createStyles({
   },\r
   content: {\r
     flexGrow: 1,\r
-    display: "flex", \r
+    display: "flex",\r
     flexDirection: "column",\r
     backgroundColor: theme.palette.background.default,\r
-    padding: theme.spacing.unit * 3,\r
+    padding: theme.spacing(3),\r
     minWidth: 0, // So the Typography noWrap works\r
   },\r
-  toolbar: theme.mixins.toolbar\r
+  toolbar: theme.mixins.toolbar as any\r
 });\r
 \r
-export const Frame = withStyles(styles)(({ classes }: WithStyles<typeof styles>) => {\r
-  const registrations = applicationService.applications;\r
-  return (\r
-    <SnackbarProvider maxSnack={3}>\r
-      <Router>\r
-        <div className={ classes.root }>\r
-          <SnackDisplay />\r
-          <ErrorDisplay />\r
-          <TitleBar />\r
-          <Menu />\r
-          <main className={ classes.content }>\r
-            <div className={ classes.toolbar } />\r
-            <Switch>\r
-              <Route exact path="/" component={ () => (\r
-                <AppFrame title={ "Home" } icon={ faHome } >\r
-                  <Home />\r
-                </AppFrame>\r
-              ) } />\r
-              <Route path="/about" component={ () => (\r
-                <AppFrame title={ "About" } icon={ faAddressBook } >\r
-                  <About />\r
-                </AppFrame>\r
-              ) } />\r
-              <Route path="/login" component={ () => (\r
-                <AppFrame title={ "Login" } icon={ faSignInAlt } >\r
-                  <Login />\r
-                </AppFrame>\r
-              ) } />\r
-              { Object.keys(registrations).map(p => {\r
-                const application = registrations[p];\r
-                return (<Route key={ application.name } path={ application.path || `/${ application.name }` } component={ () => (\r
-                  <AppFrame title={ application.title || (typeof application.menuEntry === 'string' && application.menuEntry) || application.name } icon={ application.icon } >\r
-                    <application.rootComponent />\r
+type FrameProps = WithStyles<typeof styles>;\r
+\r
+class FrameComponent extends React.Component<FrameProps>{\r
+\r
+  render() {\r
+    const registrations = applicationService.applications;\r
+    const { classes } = this.props;\r
+    return (\r
+      <SnackbarProvider maxSnack={3}>\r
+        <Router>\r
+          <div className={classes.root}>\r
+            <SnackDisplay />\r
+            <ErrorDisplay />\r
+            <TitleBar />\r
+            <Menu />\r
+            <main className={classes.content}>\r
+              {\r
+                <div className={classes.toolbar} /> //needed for margins, don't remove!\r
+              }\r
+              <Switch>\r
+                <Route exact path="/" component={() => (\r
+                  <AppFrame title={"Home"} icon={faHome} >\r
+                    <Home />\r
                   </AppFrame>\r
-                ) } />)\r
-              }) }\r
-              <Redirect to="/" />\r
-            </Switch>\r
-          </main>\r
-        </div>\r
-      </Router>\r
-    </SnackbarProvider>\r
-  );\r
-});\r
+                )} />\r
+                <Route path="/about" component={() => (\r
+                  <AppFrame title={"About"} icon={faAddressBook} >\r
+                    <About />\r
+                  </AppFrame>\r
+                )} />\r
+                {process.env.NODE_ENV === "development" ? <Route path="/test" component={() => (\r
+                  <AppFrame title={"Test"} icon={faAddressBook} >\r
+                    <Test />\r
+                  </AppFrame>\r
+                )} /> : null}\r
+                <Route path="/login" component={() => (\r
+                  <AppFrame title={"Login"} icon={faSignInAlt} >\r
+                    <Login />\r
+                  </AppFrame>\r
+                )} />\r
+                {Object.keys(registrations).map(p => {\r
+                  const application = registrations[p];\r
+                  return (<Route key={application.name} path={application.path || `/${application.name}`} component={() => (\r
+                    <AppFrame title={application.title || (typeof application.menuEntry === 'string' && application.menuEntry) || application.name} icon={application.icon} appId={application.name} >\r
+                      <application.rootComponent />\r
+                    </AppFrame>\r
+                  )} />)\r
+                })}\r
+                <Redirect to="/" />\r
+              </Switch>\r
+            </main>\r
+          </div>\r
+        </Router>\r
+      </SnackbarProvider>\r
+    );\r
+  }\r
+}\r
+\r
+export const Frame = withStyles(styles)(FrameComponent);\r
 \r
-export default Frame; \r
+export default Frame;\r