From 8883eacd2a5e2f3f5637a6b71123dfcb2a64c3d5 Mon Sep 17 00:00:00 2001
From: Indrajith K L
Date: Thu, 12 Dec 2019 19:31:50 +0530
Subject: :fire: :zap: 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/shared/footer.css           | 13 +++++++++++
 src/shared/footer.hoc.js        | 35 ++++++++++++++++++++++++++++++
 src/shared/header.hoc.js        |  0
 src/shared/header_footer.hoc.js | 39 +++++++++++++++++++++++++++++++++
 src/shared/loader.css           | 48 +++++++++++++++++++++++++++++++++++++++++
 src/shared/loader.hoc.js        | 16 ++++++++++++++
 src/shared/sidebar.css          |  6 ++++++
 src/shared/sidebar.hoc.js       | 36 +++++++++++++++++++++++++++++++
 8 files changed, 193 insertions(+)
 create mode 100644 src/shared/footer.css
 create mode 100644 src/shared/footer.hoc.js
 delete mode 100644 src/shared/header.hoc.js
 create mode 100644 src/shared/header_footer.hoc.js
 create mode 100644 src/shared/loader.css
 create mode 100644 src/shared/loader.hoc.js
 create mode 100644 src/shared/sidebar.css
 create mode 100644 src/shared/sidebar.hoc.js

(limited to 'src/shared')

diff --git a/src/shared/footer.css b/src/shared/footer.css
new file mode 100644
index 0000000..048b0c6
--- /dev/null
+++ b/src/shared/footer.css
@@ -0,0 +1,13 @@
+.footer {
+    position: absolute;
+    bottom: 0;
+    width: 95%;
+    height: 60px;
+    line-height: 60px;
+    background-color: #f5f5f5;
+}
+
+.footer>.container {
+    padding-right: 15px;
+    padding-left: 15px;
+}
\ No newline at end of file
diff --git a/src/shared/footer.hoc.js b/src/shared/footer.hoc.js
new file mode 100644
index 0000000..535a52d
--- /dev/null
+++ b/src/shared/footer.hoc.js
@@ -0,0 +1,35 @@
+import React, { Component } from "react";
+import { Link } from 'react-router-dom';
+import { connect } from "react-redux";
+import { compose } from "redux";
+import './footer.css';
+
+const Footer = (HocComponent) => {
+    return class FooterComponent extends Component {
+
+        render() {
+            return (
+                <React.Fragment>
+                    <HocComponent {...this.props} />                    
+                    <footer className="footer">
+                        <div className="container">Footer</div>
+                    </footer>
+                    
+                </React.Fragment>
+            );
+        }
+    }
+}
+
+
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+const WithFooter = compose(
+    connect(mapStateToProps, null),
+    Footer
+)
+export default WithFooter;
\ No newline at end of file
diff --git a/src/shared/header.hoc.js b/src/shared/header.hoc.js
deleted file mode 100644
index e69de29..0000000
diff --git a/src/shared/header_footer.hoc.js b/src/shared/header_footer.hoc.js
new file mode 100644
index 0000000..0c093a6
--- /dev/null
+++ b/src/shared/header_footer.hoc.js
@@ -0,0 +1,39 @@
+import React, { Component } from "react";
+import { Link } from 'react-router-dom';
+import { connect } from "react-redux";
+import { compose } from "redux";
+
+const HeaderFooter = (HocComponent) => {
+    return class HeaderFooterComponent extends Component {
+
+        render() {
+            return (
+                <React.Fragment>                    
+                    <nav className="nav">
+                        <Link className="nav-link" to={"/dashboard"} >Dashboard</Link>
+                        <Link className="nav-link" to={"/superadmin"} >Superadmin</Link>
+                        <Link className="nav-link" to={"/admin"} >Admin</Link>
+                        <Link className="nav-link" to={"/login"} >Login</Link>
+                    </nav>
+                    <HocComponent {...this.props} />
+                    <footer className="footer">
+                        <div className="container">Footer</div>
+                    </footer>
+                </React.Fragment>
+            );
+        }
+    }
+}
+
+
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+const WithHeaderFooter = compose(
+    connect(mapStateToProps, null),
+    HeaderFooter
+)
+export default WithHeaderFooter;
\ No newline at end of file
diff --git a/src/shared/loader.css b/src/shared/loader.css
new file mode 100644
index 0000000..2ee47a2
--- /dev/null
+++ b/src/shared/loader.css
@@ -0,0 +1,48 @@
+.loader {
+    position: absolute;
+    z-index: 6;
+    top: 0px;
+    left: 0;
+    height: 4px;
+    width: 100%;
+    overflow: hidden;
+    background-color: #ddd;
+  }
+  
+  .loader:before {
+    display: block;
+    position: absolute;
+    content: "";
+    left: -200px;
+    width: 200px;
+    height: 4px;
+    background-color: #ff8373;
+    animation: loading 2s linear infinite;
+  }
+  
+  @keyframes loading {
+    from {
+      left: -200px;
+      width: 30%;
+    }
+  
+    50% {
+      width: 30%;
+    }
+  
+    70% {
+      width: 70%;
+    }
+  
+    80% {
+      left: 50%;
+    }
+  
+    95% {
+      left: 120%;
+    }
+  
+    to {
+      left: 100%;
+    }
+  }
\ No newline at end of file
diff --git a/src/shared/loader.hoc.js b/src/shared/loader.hoc.js
new file mode 100644
index 0000000..c60089e
--- /dev/null
+++ b/src/shared/loader.hoc.js
@@ -0,0 +1,16 @@
+import React from 'react';
+import "./loader.css";
+const WithLoader = HocComponent => {
+    return function ({ ...props }) {
+        return (
+            <div className="loader-container">
+                {props.isLoading && (
+                    <div className="loader"></div>
+                )}
+                <HocComponent {...props} />
+            </div>
+        );
+    };
+};
+
+export default WithLoader;
\ No newline at end of file
diff --git a/src/shared/sidebar.css b/src/shared/sidebar.css
new file mode 100644
index 0000000..cfb3e02
--- /dev/null
+++ b/src/shared/sidebar.css
@@ -0,0 +1,6 @@
+.sidebar{
+    background: #cccc;
+    width: 92px;
+    height: calc(100vh);
+    position: absolute;
+}
\ No newline at end of file
diff --git a/src/shared/sidebar.hoc.js b/src/shared/sidebar.hoc.js
new file mode 100644
index 0000000..30a18a3
--- /dev/null
+++ b/src/shared/sidebar.hoc.js
@@ -0,0 +1,36 @@
+import React, { Component } from "react";
+import { Link } from 'react-router-dom';
+import { connect } from "react-redux";
+import { compose } from "redux";
+import './sidebar.css';
+
+const Sidebar = (HocComponent) => {
+    return class SidebarComponent extends Component {
+
+        render() {
+            return (
+                <React.Fragment>
+                    <div className="sidebar">
+                        Sidebar
+                    </div>
+                    <div className="content">
+                        <HocComponent {...this.props} />
+                    </div>
+                </React.Fragment>
+            );
+        }
+    }
+}
+
+
+const mapStateToProps = state => {
+    return {
+
+    };
+};
+
+const WithSidebar = compose(
+    connect(mapStateToProps, null),
+    Sidebar
+)
+export default WithSidebar;
\ No newline at end of file
-- 
cgit v1.2.3