🔥 ⚡ Major Update

* Adds Actions, Redicers and Middlewares
* Adds Http Service
* Adds Cancel option for Http Service
* Adds HOC's for API Loader, Sidebar and Headers
* Adds Random key generator for Routes

src/modules/admin/admin.container.js

@@ -1,16 +1,33 @@
-import React, {Component} from 'react';
-
-class AdminContainer extends Component{
-    constructor(props){
+import React, { Component } from 'react';
+import { connect } from "react-redux";
+import WithHeaderFooter from '../../shared/header_footer.hoc';
+import WithSidebar from '../../shared/sidebar.hoc';
+class AdminContainer extends Component {
+    constructor(props) {
         console.log(props);
         super(props);
     }
 
-    render(){
-        return(
-            <div>Admin Container</div>
+    render() {
+        return (
+            <div className="container-fluid">
+                <div className="row">
+                    <div className="col-md-12">
+                        Admin Container
+                    </div>
+                </div>
+            </div>
         );
     }
 }
 
-export default AdminContainer;
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+
+export default connect(mapStateToProps)(
+    WithSidebar(WithHeaderFooter(AdminContainer))
+);

src/modules/dashboard/dashboard.container.js

@@ -1,12 +1,28 @@
-import React, {Component} from 'react';
+import React, { Component } from 'react';
+import { connect } from "react-redux";
+import WithHeaderFooter from '../../shared/header_footer.hoc';
+import WithSidebar from '../../shared/sidebar.hoc';
+class DashBoardContainer extends Component {
 
-class DashBoardContainer extends Component{
-
-    render(){
-        return(
-            <div>Dashboard</div>
+    render() {
+        return (
+            <div className="container-fluid">
+                <div className="row">
+                    <div className="col-md-12">
+                        Dashboard
+                    </div>
+                </div>
+            </div>
         );
     }
 }
 
-export default DashBoardContainer;
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+export default connect(mapStateToProps)(
+    WithSidebar(WithHeaderFooter(DashBoardContainer))
+);

src/modules/login/login.container.js

@@ -1,12 +1,50 @@
-import React,{Component} from 'react';
+import React, { Component } from 'react';
+import { connect } from "react-redux";
+import WithFooter from '../../shared/footer.hoc';
+import { loginMock } from './login.service';
+import { loginRequest } from '../../actions/login.action';
+import HttpService from '../../services/http.service';
+class LoginContainer extends Component {
 
-class LoginContainer extends Component{
+    state = {
 
-    render(){
-        return(
-            <div>Login</div>
+    };
+
+    onLogin = ()=>{
+        let params = {
+            email: "eve.holt@reqres.in",
+            password: "cityslicka"
+        };
+
+        // loginMock(params).then(res=>{
+        //     console.log(res);
+        // })
+        this.props.dispatch(loginRequest(params));
+        // HttpService.cancelRequest();
+    }
+
+    render() {
+        return (
+            <div className="container-fluid">
+                <div className="row">
+                    <div className="col-md-12">
+                        Login
+                    </div>                    
+                    <div className="col-md-12">
+                        <button className="btn btn-primary" onClick={this.onLogin}>Login</button>
+                    </div>
+                </div>
+            </div>
         );
     }
 }
 
-export default LoginContainer;
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+export default connect(mapStateToProps)(
+    WithFooter(LoginContainer)
+);

src/modules/login/login.service.js

@@ -0,0 +1,9 @@
+import HttpService from '../../services/http.service';
+
+export const loginMock = (params)=>{
+    return HttpService.fetch({
+        url: 'https://reqres.in/api/login',
+        method: 'post',
+        data: params
+    });
+}

src/modules/superadmin/superadmin.container.js

@@ -1,12 +1,57 @@
-import React, {Component} from 'react';
+import React, { Component } from 'react';
+import { connect } from "react-redux";
+import WithHeaderFooter from '../../shared/header_footer.hoc';
+import WithSidebar from '../../shared/sidebar.hoc';
+import { COMMON_REQUEST, COMMON_CANCEL } from '../../utils/constants';
+import HttpService from '../../services/http.service';
+class SuperAdminContainer extends Component {
 
-class SuperAdminContainer extends Component{
+    componentDidMount() {
 
-    render(){
-        return(
-            <div>SuperAdminContainer</div>
+    }
+
+    startRequest = () => {
+        this.props.dispatch({
+            type: COMMON_REQUEST
+        });
+        let params = {
+            url: 'https://reqres.in/api/users?page=2'
+        }
+        HttpService.fetch(params).then(res=>{
+            console.log(res);
+        })
+    }
+
+    stopRequest = () => {
+        // this.props.dispatch({
+        //     type: COMMON_CANCEL
+        // })
+        HttpService.cancelRequest();
+    }
+
+    render() {
+        return (
+            <div className="container-fluid">
+                <div className="row">
+                    <div className="col-md-12">
+                        SuperAdminContainer
+                    </div>
+                </div>
+                <div className="row">
+                    <div className="col-md-1"><button className="btn btn-primary" onClick={this.startRequest}>Start Request</button></div>
+                    <div className="col-md-1"><button className="btn btn btn-danger" onClick={this.stopRequest}>Stop Request</button></div>
+                </div>
+            </div>
         );
     }
 }
 
-export default SuperAdminContainer;
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+export default connect(mapStateToProps)(
+    WithSidebar(WithHeaderFooter(SuperAdminContainer))
+);