member signup redirect

src/ts/@overflow/member/react/SignUp.tsx

@@ -9,12 +9,13 @@ import {
 import State from '../redux/state/SignUp';
 
 import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest';
-
+import { push as routerPush } from 'react-router-redux';
 import * as signupActions from '../redux/action/signUp';
 
 
 export function mapStateToProps(state: any): SignUpStateProps {
   return {
+    member: state.member,
   };
 }
 
@@ -24,6 +25,9 @@ export function mapDispatchToProps(dispatch: Dispatch<any>): SignUpDispatchProps
       dispatch(asyncRequestActions.request('MemberService', 'signup', signupActions.REQUEST, JSON.stringify(member)));
       // dispatch(signupActions.request(member));
     },
+    onRedirectHome: () => {
+      dispatch(routerPush('/'));
+    },
   };
 }
 

src/ts/@overflow/member/react/components/SignUp.tsx

@@ -10,10 +10,12 @@ import {
 import MemberStatus from '../../api/model/MemberStatus';
 
 export interface StateProps {
+  member?:Member;
 }
 
 export interface DispatchProps {
   onSignUp?(member: Member): void;
+  onRedirectHome():void;
 }
 
 export type Props = StateProps & DispatchProps;
@@ -56,48 +58,54 @@ export class SignUp extends React.Component<Props, State> {
   }
 
   public render(): JSX.Element {
-    return (
+
-      <Form>
+    let signupElement = <Form>
-        <Form.Input fluid value={this.state.email} placeholder='Email' onChange={
+      <Form.Input fluid value={this.state.email} placeholder='Email' onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ email: data.value });
+          this.setState({ email: data.value });
-          }} />
+        }} />
-        <Form.Input fluid placeholder='Name' onChange= {
+      <Form.Input fluid placeholder='Name' onChange= {
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ name: data.value });
+          this.setState({ name: data.value });
-          }
+        }
-        }/>
+      }/>
-        <Form.Input fluid placeholder='Password' type='password' onChange={
+      <Form.Input fluid placeholder='Password' type='password' onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ pass: data.value });
+          this.setState({ pass: data.value });
-          }
+        }
-        } />
+      } />
-        <Form.Input fluid placeholder='Password Confirm' type='password' onChange={
+      <Form.Input fluid placeholder='Password Confirm' type='password' onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ passCon: data.value });
+          this.setState({ passCon: data.value });
-          }
+        }
-        } />
+      } />
-        <Form.Input fluid placeholder='Company' onChange={
+      <Form.Input fluid placeholder='Company' onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ company: data.value });
+          this.setState({ company: data.value });
-          }
+        }
-        }/>
+      }/>
-        <Form.Select fluid value={this.state.country} placeholder='Select your country' options={options} onChange={
+      <Form.Select fluid value={this.state.country} placeholder='Select your country' options={options} onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ country: data.value });
+          this.setState({ country: data.value });
-          }
+        }
-        } />
+      } />
-        <Form.Input fluid placeholder='phone' onChange={
+      <Form.Input fluid placeholder='phone' onChange={
-          (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
+        (event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData) => {
-            this.setState({ phone: data.value });
+          this.setState({ phone: data.value });
-          }
+        }
-        } />
+      } />
-        <Form.Group>
+      <Form.Group>
-          <Button primary fluid style={{margin:'7'}} onClick={this.signUpClick}>   Sign Up  </Button>
+        <Button primary fluid style={{margin:'7'}} onClick={this.signUpClick}>   Sign Up  </Button>
-          <Button fluid style={{margin:'7'}}>    Cancel  </Button>
+        <Button fluid style={{margin:'7'}}>    Cancel  </Button>
-        </Form.Group>
+      </Form.Group>
-      </Form>
+    </Form>;
-    );
+    if (this.props.member !== undefined && this.props.member.id > 0) {
+      // Todo Please check the member registration e-mail.
+      this.props.onRedirectHome();
+    } else {
+      return signupElement;
+    }
+
   }
 
   private signUpClick = (event: React.SyntheticEvent<HTMLButtonElement>, data: ButtonProps):void => {

src/ts/@overflow/member/redux/reducer/signUp.ts

@@ -5,12 +5,20 @@ import Member from '@overflow/member/api/model/Member';
 import * as SignUpActionTypes from '../action/signUp';
 import SignUpState, { defaultState as signupDefaultState } from '../state/SignUp';
 
+//
+// [SignUpActionTypes.REQUEST_SUCCESS]: (state: SignUpState = signupDefaultState, action: Action<Member>): SignUpState => {
+//   return {
+//     ...state,
+//     member: <Member[]>action.payload,
+//   };
+// },
 const reducer: ReducersMapObject = {
   [SignUpActionTypes.REQUEST_SUCCESS]: (state: SignUpState = signupDefaultState, action: Action<Member>): SignUpState => {
-    console.log(state);
+    return {
-    console.log(action);
+      ...state,
-
+      member: <Member>action.payload,
-    return state;
+      isRegistered: true,
+    };
   },
   [SignUpActionTypes.REQUEST_FAILURE]: (state: SignUpState = signupDefaultState, action: Action<Error>): SignUpState => {
     return state;

src/ts/@overflow/member/redux/state/SignUp.ts

@@ -1,7 +1,7 @@
 import Member from '../../api/model/Member';
 
 export interface State {
-  readonly isRegistered: boolean;
+  readonly isRegistered?: boolean;
   readonly member?: Member;
   readonly error?: Error;
 }