test

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

@@ -1,9 +1,9 @@
 import { connect, Dispatch } from 'react-redux';
 import {
-    ProbeDetail,
+    ProbeDetailInfo,
     StateProps as ProbeDetailStateProps,
     DispatchProps as ProbeDetailDispatchProps,
-} from './components/ProbeDetail';
+} from './components/ProbeDetailInfo';
 
 export function mapStateToProps(state: any, props: any): ProbeDetailStateProps {
     return {
@@ -16,4 +16,4 @@ export function mapDispatchToProps(dispatch: Dispatch<any>): ProbeDetailDispatch
     };
 }
 
-export default connect(mapStateToProps, mapDispatchToProps)(ProbeDetail);
+export default connect(mapStateToProps, mapDispatchToProps)(ProbeDetailInfo);

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

@@ -21,38 +21,23 @@ export interface DispatchProps {
 export type Props = StateProps & DispatchProps;
 
 export interface State {
+  probe: Probe;
 }
 
-export class ProbeDetail extends React.Component<Props, State> {
+
+export class ProbeDetailInfo extends React.Component<Props, State> {
 
   constructor(props: Props, context: State) {
     super(props, context);
     this.state = {
-      params: null,
+      probe: null,
     };
   }
 
-  public render(): JSX.Element {
-    return (
-      <Container fluid>
-        Probe Detail....id: {this.props.id}
-        {/* <ProbeBasicInfo probe={null} />
-        <TargetTable /> */}
-      </Container>
-    );
-  }
-}
-
-export interface DetailProps {
-  probe: Probe;
-}
-
-export class ProbeBasicInfo extends React.Component<DetailProps, State> {
-
-  constructor(props: DetailProps, context: State) {
-    super(props, context);
-    this.state = {
-    };
+  public componentWillMount(): void {
+    this.setState({
+      probe: null,
+    });
   }
 
   public handleStartStop(event: any, data: any): void {
@@ -62,65 +47,55 @@ export class ProbeBasicInfo extends React.Component<DetailProps, State> {
     alert('Discovery');
   }
 
-  // public showStartStopBtn(): JSX.Element {
-  //   let temp: any = null;
-  //   temp = this.props.probe;
-  //   if (temp.metaProbeStatus.name === 'STARTED') {
-  //     return <Button content='Stop' icon='stop' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
-  //   } else {
-  //     return <Button content='Start' icon='play' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
-  //   }
-  // }
-
   public render(): JSX.Element {
     return (
-      <Container fluid>
-        {/* <Header as='h3' dividing>Probe Info</Header>
+      <Container>
         <Table celled={false}>
           <Table.Body>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Domain</Header>
               </Table.Cell>
-              <Table.Cell>{this.props.probe.domain.name}</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Status</Header>
               </Table.Cell>
-              <Table.Cell>{this.props.probe.status.name}</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Host IP</Header>
               </Table.Cell>
-              <Table.Cell>????</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Host Name</Header>
               </Table.Cell>
-              <Table.Cell>????</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Authorized at</Header>
               </Table.Cell>
-              <Table.Cell>{this.props.probe.createDate}</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
             <Table.Row>
               <Table.Cell collapsing>
                 <Header size='small'>Description</Header>
               </Table.Cell>
-              <Table.Cell>{this.props.probe.description}</Table.Cell>
+              <Table.Cell>todo</Table.Cell>
             </Table.Row>
           </Table.Body>
         </Table>
 
         <Button content='Discovery' icon='search' labelPosition='left' floated={'right'} positive onClick={this.handleDiscovery} />
-        {this.showStartStopBtn()} */}
+        {/* {this.showStartStopBtn()} */}
 
       </Container>
     );
   }
 }
+

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

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { Table, Header, Container, Form, Checkbox, Button } from 'semantic-ui-react';
-import { ProbeDetail } from './ProbeDetail';
 import { ListContainer } from '@overflow/commons/react/component/ListContainer';
 import Probe from '@overflow/probe/api/model/Probe';
 import Domain from '@overflow/domain/api/model/Domain';