discovery

src/ts/@overflow/discovery/react/components/Discovery.tsx

@@ -52,12 +52,12 @@ export class Discovery extends React.Component<Props, State> {
     this.handleProbeChange.bind(this);
     this.state = {
       startPopup:false,
-      probeTemp:probeTemp,
+      probeTemp:null,
     };
   }
 
   public componentWillMount():void {
-
+    this.setState({probeTemp:probeTemp});
   }
 
   public handleProbeChange(obj: Object): void {
@@ -78,7 +78,7 @@ export class Discovery extends React.Component<Props, State> {
     return (
       <Container fluid>
         <Header as='h3' dividing> Discovery Details</Header>
-        <DiscoveryProbe probe={this.state.probeTemp}/>
+        {/*<DiscoveryProbe probe={this.state.probeTemp}/>*/}
         <br />
         <DiscoveryTable onProbeChange={this.handleProbeChange.bind(this)} />
 

src/ts/@overflow/probe/react/ProbeDetail.tsx

@@ -4,6 +4,9 @@ import {
     StateProps as ProbeDetailStateProps,
     DispatchProps as ProbeDetailDispatchProps,
 } from './components/ProbeDetailInfo';
+import { push as routerPush } from 'react-router-redux';
+import Probe from '@overflow/probe/api/model/Probe';
+
 
 export function mapStateToProps(state: any, props: any): ProbeDetailStateProps {
     return {
@@ -13,6 +16,9 @@ export function mapStateToProps(state: any, props: any): ProbeDetailStateProps {
 
 export function mapDispatchToProps(dispatch: Dispatch<any>): ProbeDetailDispatchProps {
     return {
+      // onDiscoverySelect: ( id: string) => {
+      //   dispatch(routerPush('/discovery/' + id ));
+      // },
     };
 }
 

src/ts/@overflow/probe/react/components/ProbeDetailInfo.tsx

@@ -9,19 +9,22 @@ import {
 } from 'semantic-ui-react';
 // import { TargetTable } from '@overflow/target/react/components/TargetList';
 import Probe from '@overflow/probe/api/model/Probe';
+import {Discovery} from '../../../discovery/react/components/Discovery';
 
 export interface StateProps {
   id: string;
 }
 
 export interface DispatchProps {
-
+  // onDiscoverySelect(id:string):void;
 }
 
 export type Props = StateProps & DispatchProps;
 
 export interface State {
   probe: Probe;
+  id: string;
+  isDiscovery:boolean;
 }
 
 
@@ -31,23 +34,37 @@ export class ProbeDetailInfo extends React.Component<Props, State> {
     super(props, context);
     this.state = {
       probe: null,
+      id: '44',
+      isDiscovery: false,
     };
   }
 
   public componentWillMount(): void {
     this.setState({
       probe: null,
+      id: '44',
+      isDiscovery: false,
     });
   }
 
   public handleStartStop(event: any, data: any): void {
     console.log(event);
   }
-  public handleDiscovery(event: any, data: any): void {
-    alert('Discovery');
+
+  public handleDiscovery = (event: any, data: any): void => {
+    console.log(event);
+    // let probeId = String(this.state.id);
+    // this.props.onDiscoverySelect(this.state.id);
+    // if (this.state.isDiscovery) {
+    //   this.setState({isDiscovery: false});
+    // } else {
+    //   this.setState({isDiscovery: true});
+    // }
+
   }
+
   public showStartStopBtn(): JSX.Element {
-    return <Button content='Stop' icon='stop' labelPosition='left' negative />;
+    return <Button content='Stop' icon='stop' labelPosition='left' negative/>;
   }
 
   public render(): JSX.Element {
@@ -96,17 +113,26 @@ export class ProbeDetailInfo extends React.Component<Props, State> {
             <Table.Row>
               <Table.HeaderCell colSpan='2'>
                 {this.showStartStopBtn()}
-                <Button content='Discovery' icon='search' labelPosition='left' floated={'right'} positive onClick={this.handleDiscovery} />
+                <Button content='Discovery' icon='search' labelPosition='left' floated={'right'} positive onClick={this.handleDiscovery}/>
               </Table.HeaderCell>
             </Table.Row>
           </Table.Footer>
 
         </Table>
-
         {/* {this.showStartStopBtn()} */}
 
       </Container>
     );
   }
+
+  private showDiscovery = ():JSX.Element => {
+    if (!this.state.isDiscovery) {
+      this.setState({isDiscovery:true});
+      return <Discovery/>;
+    } else {
+      this.setState({isDiscovery:false});
+      return null;
+    }
+  }
 }