Functionally complete full registration workflow

src/components/User/CompleteRegistration.jsx

@@ -1,7 +1,7 @@
 import React, { Component } from "react";
 import { connect } from "react-redux";
 import { Redirect } from "react-router-dom";
-import { Grid, Modal, Step } from "semantic-ui-react";
+import { Dimmer, Grid, Loader, Modal, Step } from "semantic-ui-react";
 
 import {
   setCompleteRegistrationStep
@@ -9,8 +9,14 @@ import {
 import {
   USER_INFO_STEP,
   CLIENT_OR_PROVIDER_STEP,
-  COMPLETE_INFORMATION_STEP
+  COMPLETE_INFORMATION_STEP,
+  CLIENT,
+  PROVIDER
 } from "../../constants/user.constants";
+import ClientOrProviderForm from "./ClientOrProviderForm";
+import InitializeClientForm from "./InitializeClientForm";
+import InitializeProviderForm from "./InitializeProviderForm";
+import InitializeUserInfoForm from "./InitializeUserInfoForm";
 
 class CompleteRegistration extends Component {
   onChangeStep = (event, data) => {
@@ -21,11 +27,16 @@ class CompleteRegistration extends Component {
   render() {
     const {
       userToken,
+      selfUser,
       completeRegistrationCurrentStep,
       completeRegistrationMaxStep,
       completeRegistrationClientOrProvider
     } = this.props;
     if (!userToken) return <Redirect to="/auth/login" />;
+    if (Object.keys(selfUser).length === 0)
+      return <Dimmer active><Loader /></Dimmer>;
+    if (selfUser.client || selfUser.provider)
+      return <Redirect to="/user/profile" />;
     return (
       <CompleteRegistrationView
         currentStep={completeRegistrationCurrentStep}
@@ -90,9 +101,14 @@ const CompleteRegistrationView = ({
           </Grid.Column>
         </Grid.Row>
         <Grid.Row>
-        {currentStep === USER_INFO_STEP && <p>User Info</p>}
-        {currentStep === CLIENT_OR_PROVIDER_STEP && <p>Client or Provider</p>}
-        {currentStep === COMPLETE_INFORMATION_STEP && <p>Complete Info</p>}
+          {currentStep === USER_INFO_STEP && <InitializeUserInfoForm />}
+          {currentStep === CLIENT_OR_PROVIDER_STEP && <ClientOrProviderForm />}
+          {currentStep === COMPLETE_INFORMATION_STEP &&
+            completeRegistrationClientOrProvider === CLIENT &&
+            <InitializeClientForm />}
+          {currentStep === COMPLETE_INFORMATION_STEP &&
+            completeRegistrationClientOrProvider === PROVIDER &&
+            <InitializeProviderForm />}
         </Grid.Row>
       </Grid>
     </Modal.Content>