From 1a3e1c7fd309fb9b97b398018ef00523dd38b86e Mon Sep 17 00:00:00 2001
From: insanity <insanity@loafle.com>
Date: Mon, 24 Jul 2017 17:39:51 +0900
Subject: [PATCH 1/3] route example

---
 .../app/views/layout/ProbeDetailLayout.tsx    |  4 ++--
 .../@overflow/app/views/layout/TitleBar.tsx   | 19 ++++++++++++---
 .../app/views/layout/TitleBarContainer.tsx    | 24 +++++++++++++++++++
 3 files changed, 42 insertions(+), 5 deletions(-)
 create mode 100644 src/ts/@overflow/app/views/layout/TitleBarContainer.tsx

diff --git a/src/ts/@overflow/app/views/layout/ProbeDetailLayout.tsx b/src/ts/@overflow/app/views/layout/ProbeDetailLayout.tsx
index 7edd350..2326eb3 100644
--- a/src/ts/@overflow/app/views/layout/ProbeDetailLayout.tsx
+++ b/src/ts/@overflow/app/views/layout/ProbeDetailLayout.tsx
@@ -3,7 +3,7 @@ import { Redirect, RouteComponentProps, RouteProps, Route, Switch } from 'react-
 import { Container, Menu, Sidebar, Segment, Icon, Breadcrumb, Grid, Dropdown } from 'semantic-ui-react';
 import { Header } from './Header';
 import { Footer } from './Footer';
-import { TitleBar } from './TitleBar';
+import TitleBarContainer from './TitleBarContainer';
 import LeftMenu from './LeftMenu';
 
 import ProbeDetail from '../../views/monitoring/probe/Detail';
@@ -40,7 +40,7 @@ export class ProbeDetailLayout extends React.Component<Props, State> {
         <LeftMenu />
         <Segment vertical style={{ margin: '0 0 0 210px', padding: '0' }}>
           <Header />
-          <TitleBar title='Probe Details' sub={sub} />
+          <TitleBarContainer sub={sub}/>
           <Switch>
             <Route exact={true} path={`${this.props.match.url}/:id`} component={ProbeDetail} />
             <Route exact={true} path={`${this.props.match.url}/:id/history`} component={ProbeHistory} />
diff --git a/src/ts/@overflow/app/views/layout/TitleBar.tsx b/src/ts/@overflow/app/views/layout/TitleBar.tsx
index 09c7776..aa0fd3c 100644
--- a/src/ts/@overflow/app/views/layout/TitleBar.tsx
+++ b/src/ts/@overflow/app/views/layout/TitleBar.tsx
@@ -1,6 +1,19 @@
 import * as React from 'react';
 import { Grid, Container, Breadcrumb, Header, Menu, Input, Segment } from 'semantic-ui-react';
-import { Redirect } from 'react-router-dom';
+
+
+export interface StateProps {
+  sub: any;
+}
+
+export interface DispatchProps {
+  onRedirect(path: string): void;
+}
+
+export type Props = StateProps & DispatchProps;
+
+export interface State {
+}
 
 export class TitleBar extends React.Component<any, any> {
 
@@ -10,9 +23,9 @@ export class TitleBar extends React.Component<any, any> {
     };
   }
 
-  public handleMenu(menu:any): JSX.Element {
+  public handleMenu(menu:any): any {
     console.log(menu.path);
-    return <Redirect to={menu.path} />;
+    this.props.onRedirect(menu.path);
   }
 
   public renderSubMenus(): JSX.Element {
diff --git a/src/ts/@overflow/app/views/layout/TitleBarContainer.tsx b/src/ts/@overflow/app/views/layout/TitleBarContainer.tsx
new file mode 100644
index 0000000..5ca518a
--- /dev/null
+++ b/src/ts/@overflow/app/views/layout/TitleBarContainer.tsx
@@ -0,0 +1,24 @@
+import { connect, Dispatch } from 'react-redux';
+import {
+    TitleBar,
+    StateProps as StateProps,
+    DispatchProps as DispatchProps,
+} from './TitleBar';
+
+import { push as routerPush } from 'react-router-redux';
+
+export function mapStateToProps(state: any, ownProps: any): StateProps {
+    return {
+      sub: ownProps.sub,
+    };
+}
+
+export function mapDispatchToProps(dispatch: Dispatch<any>): DispatchProps {
+    return {
+        onRedirect: (path: string) => {
+            dispatch(routerPush(path));
+        },
+    };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(TitleBar);

From 00ff9a7f9434004910409e01819984149c920fed Mon Sep 17 00:00:00 2001
From: insanity <insanity@loafle.com>
Date: Mon, 24 Jul 2017 17:40:47 +0900
Subject: [PATCH 2/3] route example

---
 src/ts/@overflow/app/views/layout/TitleBar.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/ts/@overflow/app/views/layout/TitleBar.tsx b/src/ts/@overflow/app/views/layout/TitleBar.tsx
index aa0fd3c..8db5ac5 100644
--- a/src/ts/@overflow/app/views/layout/TitleBar.tsx
+++ b/src/ts/@overflow/app/views/layout/TitleBar.tsx
@@ -15,7 +15,7 @@ export type Props = StateProps & DispatchProps;
 export interface State {
 }
 
-export class TitleBar extends React.Component<any, any> {
+export class TitleBar extends React.Component<Props, State> {
 
   constructor(props: any, context: any) {
     super(props, context);
@@ -42,8 +42,8 @@ export class TitleBar extends React.Component<any, any> {
   public render(): JSX.Element {
     return (
       <Menu fluid style={{ 'borderLeft': '0px', 'borderRight': '0px', 'boxShadow': 'none', 'borderRadius': '0' }}>
-        <Menu.Item name={this.props.title} style={{ width: '250px' }}>
-          <Header as='h3'>{this.props.title}
+        <Menu.Item name='TEMP' style={{ width: '250px' }}>
+          <Header as='h3'>TEMP
             <Header.Subheader>
               <Breadcrumb size='mini'>
                 <Breadcrumb.Section link>Home</Breadcrumb.Section>

From 1f33fa7d2f0fb7dd7def5d17ed9685b236fd431f Mon Sep 17 00:00:00 2001
From: snoop <snoop@loafle.com>
Date: Mon, 24 Jul 2017 17:41:40 +0900
Subject: [PATCH 3/3] added sensor detail

---
 .../app/views/layout/SensorDetailLayout.tsx   |  7 +++--
 .../app/views/monitoring/sensor/Detail.tsx    | 30 +++++++++++++++++++
 2 files changed, 34 insertions(+), 3 deletions(-)
 create mode 100644 src/ts/@overflow/app/views/monitoring/sensor/Detail.tsx

diff --git a/src/ts/@overflow/app/views/layout/SensorDetailLayout.tsx b/src/ts/@overflow/app/views/layout/SensorDetailLayout.tsx
index 53c1f5c..7396f0e 100644
--- a/src/ts/@overflow/app/views/layout/SensorDetailLayout.tsx
+++ b/src/ts/@overflow/app/views/layout/SensorDetailLayout.tsx
@@ -6,6 +6,7 @@ import { Footer } from './Footer';
 import { TitleBar } from './TitleBar';
 import LeftMenu from './LeftMenu';
 import SensorSetup from '../monitoring/sensor/Setup';
+import SensorDetail from '../monitoring/sensor/Detail';
 
 export interface Props extends RouteComponentProps<any> {
 }
@@ -37,9 +38,9 @@ class SensorDetailLayout extends React.Component<Props, State> {
           <Header />
           <TitleBar title='Probe Details' sub={sub} />
           <Switch>
-            {/*<Route path={`${this.props.match.url}/:id/`} component={SignIn}/>
-          <Route path={`${this.props.match.url}/:id/info/`} component={SignUp}/>
-          <Route path={`${this.props.match.url}/:id/history/`} component={EmailConfirm}/>*/}
+            <Route path={`${this.props.match.url}/:id/`} component={SensorDetail}/>
+          <Route path={`${this.props.match.url}/:id/info/`} component={SensorDetail}/>
+          {/*<Route path={`${this.props.match.url}/:id/history/`} component={EmailConfirm}/>*/}
            <Route path={`${this.props.match.url}/setup/`} component={SensorSetup} />
           </Switch>
           <Footer />
diff --git a/src/ts/@overflow/app/views/monitoring/sensor/Detail.tsx b/src/ts/@overflow/app/views/monitoring/sensor/Detail.tsx
new file mode 100644
index 0000000..1d81918
--- /dev/null
+++ b/src/ts/@overflow/app/views/monitoring/sensor/Detail.tsx
@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { RouteComponentProps } from 'react-router';
+import SensorDetailContainer from '@overflow/sensor/react/SensorDetail';
+import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
+import AppContext from '@overflow/commons/context';
+import inject from '@overflow/commons/context/decorator/inject';
+
+class SensorDetail extends React.Component<RouteComponentProps<object>, object> {
+  @inject()
+  private client: WebSocketRPC;
+
+  public constructor(props?: RouteComponentProps<object>, context?: object) {
+    super(props, context);
+
+    let con = AppContext.get<WebSocketRPC>();
+  }
+
+  public render(): JSX.Element {
+    return (
+        <SensorDetailContainer />
+    );
+  }
+
+  private test(@inject() c: WebSocketRPC): void {
+    console.log('');
+  }
+}
+
+
+export default SensorDetail;