Merge pull request #21 from sensebox/add-cookie-consent

add cookie consent

package-lock.json

@@ -7887,6 +7887,11 @@
         }
       }
     },
+    "js-cookie": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
+      "integrity": "sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ=="
+    },
     "js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -8833,9 +8838,9 @@
       }
     },
     "node-forge": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
-      "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ=="
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
+      "integrity": "sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA=="
     },
     "node-int64": {
       "version": "0.4.0",
@@ -10788,6 +10793,14 @@
         "whatwg-fetch": "^3.0.0"
       }
     },
+    "react-cookie-consent": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/react-cookie-consent/-/react-cookie-consent-5.2.0.tgz",
+      "integrity": "sha512-iRIDynmivejZgLICcpfGbQl94qLn6cjdEHZP0e+ibxzQ7t3zXzdDhsGDSYax8Qu6nGJnlv0bCBd8K0UJUQ5zwQ==",
+      "requires": {
+        "js-cookie": "^2.2.1"
+      }
+    },
     "react-dev-utils": {
       "version": "10.2.1",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.2.1.tgz",
@@ -11750,11 +11763,11 @@
       "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
     "selfsigned": {
-      "version": "1.10.7",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
-      "integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
+      "version": "1.10.8",
+      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.8.tgz",
+      "integrity": "sha512-2P4PtieJeEwVgTU9QEcwIRDQ/mXJLX8/+I3ur+Pg16nS8oNbrGxEso9NyYWy8NAmXiNl4dlAp5MwoNeCWzON4w==",
       "requires": {
-        "node-forge": "0.9.0"
+        "node-forge": "^0.10.0"
       }
     },
     "semver": {

package.json

@@ -19,6 +19,7 @@
     "moment": "^2.28.0",
     "prismjs": "^1.20.0",
     "react": "^16.13.1",
+    "react-cookie-consent": "^5.2.0",
     "react-dom": "^16.13.1",
     "react-redux": "^7.2.0",
     "react-router-dom": "^5.2.0",

src/App.js

@@ -13,6 +13,7 @@ import { ThemeProvider, createMuiTheme } from '@material-ui/core/styles';
 import Navbar from './components/Navbar';
 import Footer from './components/Footer';
 import Routes from './components/Routes';
+import Cookies from './components/Cookies';
 
 const theme = createMuiTheme({
   palette: {
@@ -37,6 +38,7 @@ function App() {
           <div className="wrapper">
             <Navbar />
             <Routes />
+            <Cookies />
             <Footer />
           </div>
         </Router>

src/components/Cookies.js

@@ -0,0 +1,25 @@
+import CookieConsent from "react-cookie-consent";
+
+import React, { Component } from 'react';
+
+
+class Cookies extends Component {
+
+    render() {
+        return (
+            <CookieConsent
+                location="bottom"
+                buttonText="Okay!!"
+                cookieName="cookieConsent"
+                style={{ background: "#2B373B" }}
+                buttonStyle={{ background: "white", color: "#4EAF47", fontSize: "1rem" }}
+                expires={150}
+            >
+                This website uses cookies to enhance the user experience.{" "}
+            </CookieConsent>
+        );
+    };
+}
+
+
+export default Cookies;