package-lock.json

@@ -1359,7 +1359,7 @@
     },
     "ansi-escapes": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
       "integrity": "sha512-UgAb8H9D41AQnu/PbWlCofQVcnV4Gs2bBJi9eZPxfU/hgglFh3SMDMENRIqdr7H6XFnXdoknctFByVsCOotTVw=="
     },
     "ansi-html": {
@@ -1532,7 +1532,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -1550,7 +1550,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -1772,7 +1772,7 @@
     },
     "array-equal": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
       "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
     },
     "array-filter": {
@@ -1875,7 +1875,7 @@
         },
         "util": {
           "version": "0.10.3",
-          "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+          "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz",
           "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
           "requires": {
             "inherits": "2.0.1"
@@ -1944,6 +1944,14 @@
       "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
       "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg=="
     },
+    "attr-accept": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-1.1.3.tgz",
+      "integrity": "sha512-iT40nudw8zmCweivz6j58g+RT33I4KbaIvRUhjNmDwO2WmsQUxFEZZYZ5w3vXe5x5MX9D7mfvA/XaLOZYFR9EQ==",
+      "requires": {
+        "core-js": "^2.5.0"
+      }
+    },
     "autoprefixer": {
       "version": "9.4.4",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.4.4.tgz",
@@ -2046,7 +2054,7 @@
         },
         "chalk": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
           "requires": {
             "ansi-styles": "^2.2.1",
@@ -2111,7 +2119,7 @@
       "dependencies": {
         "jsesc": {
           "version": "1.3.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
+          "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
           "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
         }
       }
@@ -2163,7 +2171,7 @@
     },
     "babel-plugin-istanbul": {
       "version": "4.1.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz",
+      "resolved": "http://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz",
       "integrity": "sha512-PWP9FQ1AhZhS01T/4qLSKoHGY/xvkZdVBGlKM/HuxxS3+sC66HhTNR7+MpbO/so/cz/wY94MeSWJuP1hXIPfwQ==",
       "requires": {
         "babel-plugin-syntax-object-rest-spread": "^6.13.0",
@@ -2193,7 +2201,7 @@
     },
     "babel-plugin-syntax-object-rest-spread": {
       "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+      "resolved": "http://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
       "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
     },
     "babel-plugin-transform-object-rest-spread": {
@@ -2708,14 +2716,14 @@
       "dependencies": {
         "resolve": {
           "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "resolved": "http://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
           "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         }
       }
     },
     "browserify-aes": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
+      "resolved": "http://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
       "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
       "requires": {
         "buffer-xor": "^1.0.3",
@@ -2749,7 +2757,7 @@
     },
     "browserify-rsa": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
       "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
       "requires": {
         "bn.js": "^4.1.0",
@@ -2798,7 +2806,7 @@
     },
     "buffer": {
       "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "resolved": "http://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
       "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "requires": {
         "base64-js": "^1.0.2",
@@ -2916,7 +2924,7 @@
     },
     "callsites": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
       "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
     },
     "camel-case": {
@@ -3229,7 +3237,7 @@
     },
     "clone-deep": {
       "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
+      "resolved": "http://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
       "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY=",
       "requires": {
         "for-own": "^0.1.3",
@@ -3301,7 +3309,7 @@
     },
     "colors": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "resolved": "http://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
       "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
     "combined-stream": {
@@ -3433,7 +3441,7 @@
     },
     "content-disposition": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "resolved": "http://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
       "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
     },
     "content-type": {
@@ -3509,7 +3517,7 @@
     },
     "create-hash": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
+      "resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
       "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
       "requires": {
         "cipher-base": "^1.0.1",
@@ -3521,7 +3529,7 @@
     },
     "create-hmac": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
+      "resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
       "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
       "requires": {
         "cipher-base": "^1.0.3",
@@ -3592,7 +3600,7 @@
     },
     "css-color-names": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
+      "resolved": "http://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
       "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
     "css-declaration-sorter": {
@@ -3727,12 +3735,12 @@
       "dependencies": {
         "jsesc": {
           "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
           "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
         },
         "regexpu-core": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
+          "resolved": "http://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
           "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=",
           "requires": {
             "regenerate": "^1.2.1",
@@ -3742,12 +3750,12 @@
         },
         "regjsgen": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
+          "resolved": "http://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
           "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc="
         },
         "regjsparser": {
           "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+          "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
           "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
           "requires": {
             "jsesc": "~0.5.0"
@@ -4217,7 +4225,7 @@
       "dependencies": {
         "globby": {
           "version": "6.1.0",
-          "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+          "resolved": "http://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
           "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
           "requires": {
             "array-union": "^1.0.1",
@@ -4229,7 +4237,7 @@
           "dependencies": {
             "pify": {
               "version": "2.3.0",
-              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+              "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
               "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
             }
           }
@@ -4319,7 +4327,7 @@
     },
     "diffie-hellman": {
       "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
+      "resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
       "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
       "requires": {
         "bn.js": "^4.1.0",
@@ -4431,7 +4439,7 @@
       "dependencies": {
         "domelementtype": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "resolved": "http://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
           "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
         }
       }
@@ -4508,7 +4516,7 @@
     },
     "duplexer": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "resolved": "http://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
       "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
     "duplexify": {
@@ -4890,7 +4898,7 @@
         },
         "doctrine": {
           "version": "1.5.0",
-          "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
+          "resolved": "http://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
           "integrity": "sha1-N53Ocw9hZvds76TmcHoVmwLFpvo=",
           "requires": {
             "esutils": "^2.0.2",
@@ -4899,7 +4907,7 @@
         },
         "load-json-file": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+          "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
           "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
           "requires": {
             "graceful-fs": "^4.1.2",
@@ -5059,7 +5067,7 @@
     },
     "events": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
+      "resolved": "http://registry.npmjs.org/events/-/events-1.1.1.tgz",
       "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
     },
     "eventsource": {
@@ -5133,7 +5141,7 @@
     },
     "expand-range": {
       "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "resolved": "http://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
       "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
       "requires": {
         "fill-range": "^2.1.0"
@@ -5199,7 +5207,7 @@
       "dependencies": {
         "array-flatten": {
           "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+          "resolved": "http://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
           "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
         },
         "debug": {
@@ -5359,7 +5367,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -5377,7 +5385,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -5706,7 +5714,7 @@
     },
     "finalhandler": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
+      "resolved": "http://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
       "integrity": "sha512-Y1GUDo39ez4aHAw7MysnUD5JzYX+WaIj8I57kO3aEPT1fFRL4sr7mjei97FgnwhAyyzRYmQZaTHb2+9uZ1dPtg==",
       "requires": {
         "debug": "2.6.9",
@@ -5909,7 +5917,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -5927,7 +5935,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -6696,7 +6704,7 @@
     },
     "get-stream": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
       "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
     },
     "get-value": {
@@ -6776,7 +6784,7 @@
     },
     "globby": {
       "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-8.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/globby/-/globby-8.0.1.tgz",
       "integrity": "sha512-oMrYrJERnKBLXNLVTqhm3vPEdJ/b2ZE28xN4YARiix1NOIOBPEpOUnm844K1iu/BkphCaf2WNFwMszv8Soi1pw==",
       "requires": {
         "array-union": "^1.0.1",
@@ -7076,7 +7084,7 @@
     },
     "hoek": {
       "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.1.tgz",
+      "resolved": "http://registry.npmjs.org/hoek/-/hoek-4.2.1.tgz",
       "integrity": "sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA=="
     },
     "hoist-non-react-statics": {
@@ -7187,7 +7195,7 @@
     },
     "htmlparser2": {
       "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.3.0.tgz",
+      "resolved": "http://registry.npmjs.org/htmlparser2/-/htmlparser2-3.3.0.tgz",
       "integrity": "sha1-zHDQWln2VC5D8OaFyYLhTJJKnv4=",
       "requires": {
         "domelementtype": "1",
@@ -7211,7 +7219,7 @@
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
           "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
           "requires": {
             "core-util-is": "~1.0.0",
@@ -7222,7 +7230,7 @@
         },
         "string_decoder": {
           "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
           "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
         }
       }
@@ -7234,7 +7242,7 @@
     },
     "http-errors": {
       "version": "1.6.3",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
+      "resolved": "http://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
       "integrity": "sha1-i1VoC7S+KDoLW/TqLjhYC+HZMg0=",
       "requires": {
         "depd": "~1.1.2",
@@ -7260,7 +7268,7 @@
     },
     "http-proxy-middleware": {
       "version": "0.18.0",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz",
+      "resolved": "http://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz",
       "integrity": "sha512-Fs25KVMPAIIcgjMZkVHJoKg9VcXcC1C8yb9JUgeDvVXY0S/zgVIhMb+qVswDIgtJe2DfckMSY2d6TuTEutlk6Q==",
       "requires": {
         "http-proxy": "^1.16.2",
@@ -7346,7 +7354,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -7364,7 +7372,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -7796,7 +7804,7 @@
     },
     "is-accessor-descriptor": {
       "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+      "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
       "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
       "requires": {
         "kind-of": "^3.0.2"
@@ -7822,7 +7830,7 @@
     },
     "is-builtin-module": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
       "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
       "requires": {
         "builtin-modules": "^1.0.0"
@@ -7856,7 +7864,7 @@
     },
     "is-data-descriptor": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+      "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
       "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
       "requires": {
         "kind-of": "^3.0.2"
@@ -7958,7 +7966,7 @@
     },
     "is-obj": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
       "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
     },
     "is-path-cwd": {
@@ -8461,7 +8469,7 @@
     },
     "jest-get-type": {
       "version": "22.4.3",
-      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-22.4.3.tgz",
+      "resolved": "http://registry.npmjs.org/jest-get-type/-/jest-get-type-22.4.3.tgz",
       "integrity": "sha512-/jsz0Y+V29w1chdXVygEKSz2nBoHoYqNShPe+QgxSNjAuP1i8+k4LbQNrfoliKej0P45sivkSCh7yiD6ubHS3w=="
     },
     "jest-haste-map": {
@@ -9048,7 +9056,7 @@
     },
     "load-json-file": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
       "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "requires": {
         "graceful-fs": "^4.1.2",
@@ -9367,7 +9375,7 @@
     },
     "media-typer": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+      "resolved": "http://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
       "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
     },
     "mem": {
@@ -9592,7 +9600,7 @@
     },
     "mkdirp": {
       "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
       "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
       "requires": {
         "minimist": "0.0.8"
@@ -10168,7 +10176,7 @@
     },
     "os-homedir": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "resolved": "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
       "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
     },
     "os-locale": {
@@ -10183,7 +10191,7 @@
     },
     "os-tmpdir": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "resolved": "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
       "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
     },
     "osenv": {
@@ -10207,7 +10215,7 @@
     },
     "p-is-promise": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
       "integrity": "sha1-nJRWmJ6fZYgBewQ01WCXZ1w9oF4="
     },
     "p-limit": {
@@ -10261,7 +10269,7 @@
     },
     "parse-asn1": {
       "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz",
+      "resolved": "http://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.1.tgz",
       "integrity": "sha512-KPx7flKXg775zZpnp9SxJlz00gTd4BmJ2yJufSc44gMCRrRQ7NSzAcSJQfifuOLgW6bEi+ftrALtsgALeB2Adw==",
       "requires": {
         "asn1.js": "^4.0.0",
@@ -10313,7 +10321,7 @@
     },
     "path-browserify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
       "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
     "path-dirname": {
@@ -10328,7 +10336,7 @@
     },
     "path-is-absolute": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
       "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
     },
     "path-is-inside": {
@@ -10380,7 +10388,7 @@
     },
     "pify": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
       "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
     },
     "pinkie": {
@@ -10444,7 +10452,7 @@
       "dependencies": {
         "async": {
           "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+          "resolved": "http://registry.npmjs.org/async/-/async-1.5.2.tgz",
           "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
         },
         "debug": {
@@ -13906,7 +13914,7 @@
     },
     "pretty-bytes": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz",
+      "resolved": "http://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz",
       "integrity": "sha1-sr+C5zUNZcbDOqlaqlpPYyf2HNk="
     },
     "pretty-error": {
@@ -14867,6 +14875,15 @@
         "scheduler": "^0.11.2"
       }
     },
+    "react-dropzone": {
+      "version": "8.0.4",
+      "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-8.0.4.tgz",
+      "integrity": "sha512-RL9lCPbAbVifUShqpH009BhGPiyx6T+STpr3Ig+WnArOtJBFRfLjzB4mghUGFzDorZ++Mhc3FD12d7Oxd/SWSg==",
+      "requires": {
+        "attr-accept": "^1.1.3",
+        "prop-types": "^15.6.2"
+      }
+    },
     "react-error-overlay": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.1.2.tgz",
@@ -15158,7 +15175,7 @@
     },
     "readable-stream": {
       "version": "2.3.6",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+      "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
       "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
       "requires": {
         "core-util-is": "~1.0.0",
@@ -15257,7 +15274,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -15275,7 +15292,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -15606,7 +15623,7 @@
       "dependencies": {
         "jsesc": {
           "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
           "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
         }
       }
@@ -15635,7 +15652,7 @@
       "dependencies": {
         "css-select": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+          "resolved": "http://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
           "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
           "requires": {
             "boolbase": "~1.0.0",
@@ -15751,7 +15768,7 @@
     },
     "require-uncached": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz",
+      "resolved": "http://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz",
       "integrity": "sha1-Tg1W1slmL9MeQwEcS5WqSZVUIdM=",
       "requires": {
         "caller-path": "^0.1.0",
@@ -15768,7 +15785,7 @@
         },
         "callsites": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/callsites/-/callsites-0.2.0.tgz",
+          "resolved": "http://registry.npmjs.org/callsites/-/callsites-0.2.0.tgz",
           "integrity": "sha1-r6uWJikQp/M8GaV3WCXGnzTjUMo="
         },
         "resolve-from": {
@@ -15849,7 +15866,7 @@
     },
     "rgba-regex": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
       "integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM="
     },
     "rimraf": {
@@ -15914,7 +15931,7 @@
     },
     "safe-regex": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
       "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
       "requires": {
         "ret": "~0.1.10"
@@ -16018,7 +16035,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -16036,7 +16053,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -16547,7 +16564,7 @@
     },
     "sha.js": {
       "version": "2.4.11",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
+      "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
       "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
       "requires": {
         "inherits": "^2.0.1",
@@ -16567,7 +16584,7 @@
       "dependencies": {
         "kind-of": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
+          "resolved": "http://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
           "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU=",
           "requires": {
             "is-buffer": "^1.0.2"
@@ -16919,7 +16936,7 @@
     },
     "sprintf-js": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "resolved": "http://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
       "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
     },
     "sshpk": {
@@ -16995,7 +17012,7 @@
     },
     "stream-browserify": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
       "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=",
       "requires": {
         "inherits": "~2.0.1",
@@ -17083,7 +17100,7 @@
     },
     "string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+      "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "requires": {
         "safe-buffer": "~5.1.0"
@@ -17101,7 +17118,7 @@
     },
     "strip-ansi": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
       "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
       "requires": {
         "ansi-regex": "^2.0.0"
@@ -17126,7 +17143,7 @@
     },
     "strip-eof": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
       "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
     },
     "strip-indent": {
@@ -17268,7 +17285,7 @@
     },
     "table": {
       "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/table/-/table-4.0.3.tgz",
+      "resolved": "http://registry.npmjs.org/table/-/table-4.0.3.tgz",
       "integrity": "sha512-S7rnFITmBH1EnyKcvxBh1LjYeQMmnZtCXSEbHcH6S0NoKit24ZuFO/T1vDcLdYsLQkM188PVVhQmzKIuThNkKg==",
       "requires": {
         "ajv": "^6.0.1",
@@ -17427,7 +17444,7 @@
     },
     "through": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz",
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
     "through2": {
@@ -17525,7 +17542,7 @@
     },
     "topo": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
+      "resolved": "http://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
       "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
       "requires": {
         "hoek": "4.x.x"
@@ -17578,7 +17595,7 @@
     },
     "tty-browserify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
       "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
     },
     "tunnel-agent": {
@@ -17659,7 +17676,7 @@
       "dependencies": {
         "cacache": {
           "version": "10.0.4",
-          "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
+          "resolved": "http://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
           "integrity": "sha512-Dph0MzuH+rTQzGPNT9fAnrPmMmjKfST6trxJeK7NQuHRaVw24VzPRWTmg9MpcwOVQZO0E1FBICUlFeNaKPIfHA==",
           "requires": {
             "bluebird": "^3.5.1",
@@ -18015,7 +18032,7 @@
     },
     "vm-browserify": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
+      "resolved": "http://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
       "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM=",
       "requires": {
         "indexof": "0.0.1"
@@ -18209,7 +18226,7 @@
             },
             "is-accessor-descriptor": {
               "version": "0.1.6",
-              "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+              "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
               "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -18227,7 +18244,7 @@
             },
             "is-data-descriptor": {
               "version": "0.1.4",
-              "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+              "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
               "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
               "requires": {
                 "kind-of": "^3.0.2"
@@ -18893,7 +18910,7 @@
     },
     "wrap-ansi": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
       "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
       "requires": {
         "string-width": "^1.0.1",
@@ -18910,7 +18927,7 @@
         },
         "string-width": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
           "requires": {
             "code-point-at": "^1.0.0",
@@ -18983,7 +19000,7 @@
     },
     "yargs": {
       "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz",
+      "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz",
       "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==",
       "requires": {
         "cliui": "^4.0.0",

package.json

@@ -7,9 +7,11 @@
     "@material-ui/lab": "^3.0.0-alpha.28",
     "antd": "^3.11.2",
     "axios": "^0.18.0",
+    "form-data": "^2.3.3",
     "node-sass": "^4.11.0",
     "react": "^16.6.3",
     "react-dom": "^16.6.3",
+    "react-dropzone": "^8.0.4",
     "react-loader-spinner": "^2.3.0",
     "react-md-spinner": "^0.3.0",
     "react-redux": "^6.0.0",

src/actions/addNewStaffAction.js

@@ -22,7 +22,8 @@ export const closeModal = payload => ({
     payload
 })
 
-export const AddNewStaff = payload => {
+
+export const AddNewStaffAction = payload => {
     return dispatch => {
         dispatch(addNewStaffRequest())
         axios.post(`http://127.0.0.1:2000/api/staffs`, payload)
@@ -31,4 +32,32 @@ export const AddNewStaff = payload => {
             .catch(err =>
                 dispatch(addNewStaffRequestFail(err)))
     }
+}
+
+const addPhotoRequest = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST,
+    payload
+})
+
+const addNewPhotoRequestSuccess = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST_SUCCESS,
+    payload
+})
+
+const addNewPhotoRequestFail = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST_FAIL,
+    payload
+})
+
+
+export const pushPhoto = payload => {
+    console.log(payload)
+    return dispatch => {
+        dispatch(addPhotoRequest())
+        axios.post(`http://127.0.0.1:2000/upload`, payload)
+            .then(res =>
+                setTimeout(() => dispatch(addNewPhotoRequestSuccess(res)), 1000))
+            .catch(err =>
+                dispatch(addNewPhotoRequestFail(err)))
+    }
 }

src/actions/searchStaffAction.js

@@ -33,7 +33,7 @@ export const searchStaff = payload => {
                 res => {
                     setTimeout(() => {
                         dispatch(searchStaffRequestSuccess(res))
-                    }, 1)
+                    }, Math.random()*1000)
                 })
             .catch(
                 err => {

src/actions/usersAuthActions.js

@@ -29,3 +29,5 @@ export const getUsersData = (payload) => {
             })
     }
 }
+
+    

src/components/AllStaffs/FullInfoAboutStaff.js

@@ -1,37 +1,136 @@
 import React, { Component, Fragment } from 'react';
 
-import Loader from 'react-loader-spinner'
+import Loader from 'react-loader-spinner';
+import { Menu, Icon, Carousel } from 'antd';
 
 class FullInfoAboutStaff extends Component {
+    constructor(props) {
+        super(props)
+        
+        this.state = {
+            count: 0,
+        }
+    }
+
+    // nextCount = () => {
+    //     // console.log(this.arr)
+    //     // console.log(this.arr.length)
+
+    //     if (this.state.count == this.arr.length - 1) {
+    //         this.setState({ count: 0 })
+    //         console.log("sdgdfg")
+    //     }
+    //     else {
+    //         this.setState({ count: this.state.count + 1 })
+    //     }
+
+    // }
+
+    // backCount = () => {
+    //     if (this.state.count === 0) {
+    //         this.setState({ count: this.arr.length - 1 })
+    //     }
+    //     else {
+    //         this.setState({ count: this.state.count - 1 })
+    //     }
+
+    // }
+
+    // componentDidMount(){
+    //     const { InfoStaff } = this.props
+    //     let str;
+
+    //     str = InfoStaff.map(el => {
+    //         console.log(el.img)
+    //         let str1 = el.img.substr(29)
+    //         for (var i = 0, b = 24; i < str1.length; i = i + 25) {
+
+    //             this.arr.push(str1.substr(i, b))
+    //         }
+
+    //     })
+    // }
+
     render() {
+        console.log(this.arr)
         const { InfoStaff, isFetching } = this.props
-        
-        let data;
-            if(isFetching===true){
-                data = <div> 
-                    <Loader 
-                        type="Triangle"
-                        color="#1890ff"
-                        height="75"	
-                        width="75"
-                    /> 
-                </div> 
-            }
-            else {
-                data = InfoStaff.map((el,key)=>(
-                    <div className="staff" key={key}>
-                        {el.title} {el.price} {el.description} {el.img} 
-                    </div>)
-                )
+        let arr = [];
+        let str;
+        // let str1
+        // let str2
+        // str = InfoStaff.map(el=> el.img.substr(0,29));
+        // str1 = InfoStaff.map(el=> el.img.substr(29,24));
+        // str2 = InfoStaff.map(el=> el.img.substr(54));
+        // console.log(str[0])
+        // console.log(str1[0])
+        // console.log(str2[0])
+
+
+
+        str = InfoStaff.map(el => {
+            console.log(el.img)
+            let str1 = el.img.substr(29)
+            for (var i = 0, b = 24; i < str1.length; i = i + 25) {
+
+                arr.push(str1.substr(i, b))
+
             }
+
+        })
+
+
+
+
+
+        let data, data1;
+        if (isFetching === true) {
+            data = <div className="loader">
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"
+                    width="100"
+                />
+            </div>
+        }
+        else {
+            data = InfoStaff.map((el, key) => (
+
+                <div>
+                    {/* <img src={str+str1} width="325" height="190" className="imgStaff"  alt="lorem" />
+                    <img src={str+str2} width="325" height="190" className="imgStaff"  alt="lorem" /> */}
+
+                    {el.title} {el.price} {el.description}
+                </div>)
+
+            )
+            data1 = <div className="carusel">
+                    <Carousel effect="fade">
+                        {arr.map(el => <div>
+                            <img src={`http://127.0.0.1:2000/static/${el}`} className="fullImgStaff" alt="lorem" />
+                        </div>)}   
+                    </Carousel>
+                </div>
+            
+            // arr.map(el => <div><img src={`http://127.0.0.1:2000/static/${el}`} className="fullImgStaff" alt="lorem" /></div>)
+            // data1 = arr.map(el => console.log() )
+        }
+
         return (
 
-            <Fragment>
-                
-             {data} 
-                    
-            </Fragment>
+            <div className="staffinfo" >
+
+                {/* <div class="carusel">
+                    <div class="back but" onClick={this.backCount} ><Icon type="left" /></div>
+                    <div class="el-carusel">
+                        <img src={`http://127.0.0.1:2000/static/${this.arr[this.state.count]}`} width="325" height="190" className="fullImgStaff" alt="lorem" />
+                    </div>
+                    <div class="next but" onClick={this.nextCount} ><Icon type="left" /></div>
+                </div> */}
+
+                {data1}
 
+                {data}
+            </div>
         );
     }
 }

src/components/AllStaffs/index.js

@@ -5,40 +5,43 @@ import Loader from 'react-loader-spinner';
 import AddNewStaff from '../../components/BtnAddNewStaff'
 
 class AllStaffs extends Component {
-    
+
     render() {
-        const { inputStaffs, isFetching } = this.props
+        const { inputStaffs, isFetching, isAdmin, getUser } = this.props
         let data;
-            if(isFetching===true){            
-                data = <div className="loader"> 
-                    <Loader type="Triangle"
-                        color="#FD7F71"
-                        height="100"	
-                        width="100"
-                    /> 
-                </div> 
-            } else {
-                data = <div className="staffs">
-                    {inputStaffs.map((el,key)=>(
-                        <Link to={`/staff/${el.id}`} key={key}>
-                            <div className="staff">
-                                <img src={el.img} width="325" height="190" className="imgStaff"  alt="lorem" />
-                                <div className="titlleAndPrice">
-                                    <h4>{el.title}</h4>
-                                    <h4>Цена: {el.price}</h4>
-                                </div>
+
+        if (isFetching === true) {
+
+            data = <div className="loader">
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"
+                    width="100"
+                />
+            </div>
+        } else {
+            data = <div className="staffs">
+                {inputStaffs.map((el, key) => (
+                    <Link to={`/staff/${el.id}`} key={key}>
+                        <div className="staff">
+                            <img src={el.img.substr(0, 53)} width="325" height="190" className="imgStaff" alt="lorem" />
+                            <div className="titlleAndPrice">
+                                <h4>{el.title}</h4>
+                                <h4>Цена: {el.price}</h4>
                             </div>
-                        </Link> 
-                    ))}    
-                </div>
-            }
+
+                        </div>
+                    </Link>
+                ))}
+            </div>
+        }
         return (
 
-           <div className="contentStaffs">
+            <div className="contentStaffs">
                 {data}
-                <AddNewStaff/>
-           </div> 
-            
+                <AddNewStaff isAdmin={isAdmin} getUser={getUser} />
+            </div>
+
         );
     }
 }

src/components/Auth/authButtons.js

@@ -5,7 +5,7 @@ class Authbuttons extends Component {
     render() {
         return (
             <div className="auth__button">
-                <Link to="/auth"  >
+                <Link to="/auth" >
                     <button className="button btn1">
                         Войти
                     </button>

src/components/Auth/authorisation.js

@@ -2,16 +2,20 @@ import React from "react";
 import { reduxForm, Field } from "redux-form";
 import Authbuttons from './authButtons'
 
-import {Link} from "react-router-dom"
+import { Link, Redirect} from "react-router-dom"
 
 import {authValidate} from "../../utils/authValidate";
 import {authRenderField} from "../../common/authRenderField"
 
 
 const Form = props => {
-    const { handleSubmit, getUsersData } = props
+
+    const { handleSubmit, getUsersData, pristine, inputData } = props
+
     const submit = (values) => {
+        
         getUsersData(values);
+       
         
     }
     return (
@@ -36,7 +40,8 @@ const Form = props => {
                         className="input"
                     />
                 </div>
-               <button className="auth__submit-button" onClick={handleSubmit(submit)}><Link to="/">Войти</Link></button>
+               <button className="auth__submit-button" onClick={handleSubmit(submit)}><Link to="/">Войти</Link> </button>
+               
             </form>
         </div>
 

src/components/Auth/registration.js

@@ -17,9 +17,8 @@ const RegistrForm = props => {
         postUsersData(values)
     }
 
-    return (   
-        <div className="formdiv">
-            <div>
+    return (
+        <div >
             <Authbuttons />
             <form onSubmit={handleSubmit(submit)} className="form">
                 <div>
@@ -72,22 +71,21 @@ const RegistrForm = props => {
                     </div>
                 </div>
                 <div>
-                    <button type="submit" 
-                        disabled={pristine} 
+                    <button type="submit"
+                        disabled={pristine}
                         className="button"
                     >
                         Отправить
                     </button>
-                    <button type="button" 
-                        disabled={pristine} 
-                        onClick={reset} 
+                    <button type="button"
+                        disabled={pristine}
+                        onClick={reset}
                         className="button"
                     >
                         Очистить поля
                     </button>
                 </div>
             </form>
-            </div>
         </div>
 
     )

src/components/BtnAddNewStaff/index.js

@@ -7,9 +7,19 @@ import { Link } from "react-router-dom";
 
 class BtnAddNewStaff extends Component {
     render() {
+        const {isAdmin, getUser  } = this.props
+        let localS = JSON.parse(localStorage.getItem("login"));
+        
+        let data;
+        if (localS===null){
+           data =<div><Link to="/auth" className="topbutton"><Icon type="plus" style={{fontSize: '30px'}} /></Link></div> 
+        }
+        else if(isAdmin!==undefined || getUser.isAdmin!==undefined){
+            data = <div> <Link to="/newStaff" className="topbutton"><Icon type="plus" style={{fontSize: '30px'}} /></Link></div>
+        }
         return (
             <Fragment>
-               <Link to="/newStaff" className="topbutton"><Icon type="plus" style={{fontSize: '30px'}} /></Link>
+            {data}
             </Fragment>
         );
     }

src/components/FormsAdd/FormAddNewStaff/SendingStaffForm.js

@@ -1,27 +1,47 @@
 import React, { Component } from 'react';
 import { Field, reduxForm } from 'redux-form';
 
+import FormData from 'form-data'
 
-class SendingForm extends  Component  {
+class SendingForm extends Component {
+    constructor(props) {
+        super(props)
+        this.state = { image: 'http://zabavnik.club/wp-content/uploads/vopros_2_14000037-939x1024.jpg' }
 
-    onChange = e =>{
-        //console.log(e.target.files[0])
-        this.setState({image: e.target.files[0].name})
     }
+
+    onChange = e => {
+        const { pushPhoto, photo } = this.props
+        //this.setState({image: e.target.files[0]})
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+
+        pushPhoto(data)
+    }
+
     submit = values => {
-        const { AddNewStaff } = this.props
+        const { AddNewStaffAction, getUser, photo } = this.props
         //const { image } = this.state
-        values.img = "http://zabavnik.club/wp-content/uploads/vopros_2_14000037-939x1024.jpg"
+
+        let massive = []
+        // massive = photo.map(el => el.data.fileName)
+        // console.log(photo)
+        values.img = `http://127.0.0.1:2000/static/${photo.map(el => el.data.fileName)}`
         values.staff = "Машина"
         values.state = 1
-        values.userId = 1
-        
-        AddNewStaff(values)
-    };
-    render(){
-         const { handleSubmit, pristine, reset, submitting, allCategory } = this.props
-    return (
-        
+        values.userId = getUser.id
+        console.log(values)
+        AddNewStaffAction(values)
+    }
+
+    render() {
+
+        const { handleSubmit, pristine, reset, submitting, allCategory, photo } = this.props
+        console.log(photo)
+
+
+        return (
+
             <div className="formdiv">
                 <form onSubmit={handleSubmit(this.submit)} className="form">
                     <Field
@@ -52,13 +72,36 @@ class SendingForm extends  Component  {
                     <Field
                         name="categoryId"
                         component="select"
-                        
+
                         className="input"
                     >
                         <option >Выберите рубрику</option>
                         {allCategory.map(el => <option value={el.id}> {el.title}</option>)}
                     </Field>
 
+                    <div className="file">
+                        <label className='upload-zone'>
+                            <i>&nbsp;</i>
+                            <input type='file' className='files' onChange={this.onChange} />
+
+                        </label>
+                        <label className='upload-zone zone2'>
+                            <i>&nbsp;</i>
+                            <input type='file' className='files' onChange={this.onChange} />
+
+                        </label>
+                        <label className='upload-zone zone3'>
+                            <i>&nbsp;</i>
+                            <input type='file' className='files' onChange={this.onChange} />
+
+                        </label>
+                        <label className='upload-zone zone4'>
+                            <i>&nbsp;</i>
+                            <input type='file' className='files' onChange={this.onChange} />
+
+                        </label>
+                    </div>
+
                     <div className="buttonConteiner">
                         <button type="submit" disabled={pristine || submitting} className="button" >
                             Submit
@@ -67,12 +110,14 @@ class SendingForm extends  Component  {
                             Clear Values
                         </button>
                     </div>
+
+
                 </form>
 
             </div>
-        
-    )
-  }
+
+        )
+    }
 }
 
 export default reduxForm({

src/components/FormsAdd/FormAddNewStaff/index.js

@@ -15,14 +15,14 @@ class FormAddNewStaff extends Component {
     }
     render() {
         
-        const { isFetching, AddNewStaff, allCategory } = this.props
+        const { isFetching, AddNewStaffAction, allCategory, getUser, photo, pushPhoto } = this.props
         let data;
         if (allCategory.data===undefined){
             data = []
         }
         else{ 
             const category = allCategory.data.filter(el => el.parentId !== 0)
-            data = <Form AddNewStaff={AddNewStaff} allCategory={category}/>
+            data = <Form AddNewStaffAction={AddNewStaffAction} allCategory={category}  getUser={ getUser } photo={ photo } pushPhoto={ pushPhoto } />
         }
         return (
             <Fragment>

src/components/Header/searchLine.js

@@ -6,7 +6,7 @@ class SearchLine extends Component {
     
     changeHandler = e => {
         this.props.changeInputValue(e.target.value)
-        this.props.searchStaff(e.target.value)        
+        //athis.props.searchStaff(e.target.value)        
     }
     
     send = () => {

src/components/LeftMenu/index.js

@@ -18,27 +18,42 @@ class LeftMenu extends Component {
 
     render() {
 
-        const { allCategory, mainCategory, isAdmin, getUser } = this.props
-        let localS = JSON.parse(localStorage.getItem("login"));
+        const { allCategory, mainCategory,  getUser, isAdmin } = this.props
+        
+            let localS = JSON.parse(localStorage.getItem("login")); 
+            
+            let data; 
+           
+            if(localS===null) {
+                data = [];
+                }
+               
+             else if(Boolean(isAdmin) || Boolean(getUser.isAdmin)){
+                data =  <Menu key="addCatigory1" theme="dark" defaultSelectedKeys={['1']} mode="inline">    
+                <Menu.Item key="addCatigory">
+                    <Link to="/addCategory">
+                        <Icon type="plus" />
+                        <span >Добавить категорию</span>
+                    </Link>
+                </Menu.Item>
+            </Menu>
+            }
+             
+            else{
+                data =[];
+            }
 
         return (
             <div>
-                <Layout style={{ minHeight: '100vh', 'background': 'red' }}>
+                <Layout style={{ minHeight: '100vh' }}>
                     <Sider collapsible
                         collapsed={this.state.collapsed}
                         onCollapse={this.onCollapse}
                     >
-                        {Boolean(isAdmin) && Boolean(getUser.isAdmin) || (localS !== null && <Menu key="addCatigory1" theme="dark" defaultSelectedKeys={['1']} mode="inline">
-                            <Menu.Item key="addCatigory">
-                                <Link to="/addCategory">
-                                    <Icon type="plus" />
-                                    <span >Добавить категорию</span>
-                                </Link>
-                            </Menu.Item>
-                        </Menu>)}
-                        <DrawCategory allCategory={allCategory}
-                            mainCategory={mainCategory}
-                        />
+                        {data}                        
+                        <DrawCategory allCategory={allCategory} 
+                            mainCategory={mainCategory}  
+                        />  
                     </Sider>
                 </Layout>
             </div>

src/components/SearchStaffsPage/SearchFullInfoStaff.js

@@ -7,14 +7,13 @@ class SearchFullInfoStaff extends Component {
 
         let data;
             if(isFetching===true){
-                data = <div> 
-                    <Loader 
-                type="Triangle"
-                color="#1890ff"
-                height="75"	
-                width="75"
-             /> 
-             </div>
+                data = <div className="loader"> 
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"	
+                    width="100"
+                /> 
+            </div> 
             }
             else {
                 data = fullInfoSearchData.map((el,key)=>(<div key={key}> {el.title} {el.price} {el.description} </div>)

src/components/SearchStaffsPage/index.js

@@ -9,14 +9,13 @@ class searchStaffs extends Component {
             
         let data;
             if(isFetching===true){
-                data = <div> <div> 
-                <Loader 
-            type="Triangle"
-            color="#1890ff"
-            height="75"	
-            width="75"
-         /> 
-         </div> </div> 
+                data = <div className="loader"> 
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"	
+                    width="100"
+                /> 
+            </div> 
             }
             else{
                 data = <div className="staffs">

src/components/usersProtectPage/PrivateRoute.js

@@ -5,12 +5,11 @@ import { Route } from "react-router-dom";
 export default ({ component: Component, data, params, ...rest }) => (
     <Route
         {...rest}
-        render={props => {
 
-            return <Component {...data}  {...props} />
-            // else {
-            //   return <Redirect to='/' />
-            // }
+        render= {props =>{
+            
+            return <Component {...data}  {...props}  />
+
         }}
     />
 

src/constants/actionTypes.js

@@ -31,7 +31,9 @@
     export const ADD_NEW_STAFF_REQUEST = "ADD_NEW_STAFF_REQUEST";
     export const ADD_NEW_STAFF_REQUEST_SUCCESS = "ADD_NEW_STAFF_REQUEST_SUCCESS";
     export const ADD_NEW_STAFF_REQUEST_FAIL = "ADD_NEW_STAFF_REQUEST_FAIL";
-
+    export const PUSH_NEW_PHOTO_REQUEST = "PUSH_NEW_PHOTO_REQUEST";
+    export const PUSH_NEW_PHOTO_REQUEST_SUCCESS = "PUSH_NEW_PHOTO_REQUEST_SUCCESS";
+    export const PUSH_NEW_PHOTO_REQUEST_FAIL = "PUSH_NEW_PHOTO_REQUEST_FAIL";
     //searchStaffAction
     export const CHANGE_INPUT_VALUE = "CHANGE_INPUT_VALUE";
     export const SEARCH_STAFF_REQUEST = "SEARCH_STAFF_REQUEST";
@@ -53,7 +55,7 @@
     export const USER_AUTH_REQUEST = "USER_AUTH_REQUEST";
     export const USER_AUTH_REQUEST_SUCCESS = "USER_AUTH_REQUEST_SUCCESS";
     export const USER_AUTH_REQUEST_FAIL = "USER_AUTH_REQUEST_FAIL";
-
+    
     //usersRegistrAction
     export const USER_REG_REQUEST = "USER_REG_REQUEST";
     export const USER_REG_REQUEST_SUCCESS = "USER_REG_REQUEST_SUCCESS";

src/container/AddNewStaff.js

@@ -1,7 +1,9 @@
 import React, { Component, Fragment } from 'react';
 
 import { connect } from 'react-redux';
-import * as actions from "../actions/addNewStaffAction";
+import { AddNewStaffAction, closeModal, pushPhoto } from "../actions/addNewStaffAction";
+
+import { getUsersDataById } from "../actions/getUserById"
 
 import { bindActionCreators } from "redux";
 
@@ -9,20 +11,34 @@ import FormAddNewStaff from '../components/FormsAdd/FormAddNewStaff';
 import EditModal from "../components/Modal";
 
 class AddNewStaff extends Component {
+    componentDidMount() {
 
+        const { getUsersDataById } = this.props
+              let localS = JSON.parse(localStorage.getItem("login"));
+                if(localS===null){
+                }
+                else{
+                    getUsersDataById(localS)
+                }
+              
+    }
     closeEditModal = () => {
         const { closeModal } = this.props;
         closeModal();
     }
     render() {
-        const { showModal, error, isFetching, AddNewStaff } = this.props
-        
+        const { showModal, error, isFetching, AddNewStaffAction, getUser, photo, pushPhoto } = this.props
+
         return (
 
             <Fragment>
                 <Fragment>
-                    <FormAddNewStaff AddNewStaff={AddNewStaff} 
-                        isFetching={isFetching} 
+                    <FormAddNewStaff AddNewStaffAction={AddNewStaffAction} 
+                        isFetching={isFetching}
+                        getUser={ getUser }
+                        photo={ photo } 
+                        pushPhoto={ pushPhoto }
+
                     />
                 </Fragment>
                 <EditModal visible={showModal}
@@ -39,12 +55,14 @@ class AddNewStaff extends Component {
 
 const mapStateToProps = state => ({
     staffData: state.addStaff.staffData,
+    photo: state.addStaff.photo,
     isFetching: state.addStaff.isFetching,
     showModal: state.addStaff.showModal,
-    error: state.addStaff.error
+    error: state.addStaff.error,
+    getUser: state.getUserById.getUser,
 });
 
-const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ AddNewStaffAction, getUsersDataById, closeModal, pushPhoto }, dispatch);
 
 export default AddNewStaff = connect(
     mapStateToProps,

src/container/CategoryStaffInfo.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import { connect} from 'react-redux';
 import * as actions from "../actions/getStaffByCategoryIdAction";
 import { bindActionCreators } from "redux";
@@ -29,13 +29,13 @@ class CategoryStaffInfo extends Component {
         
        
         return (
-            <div>
+            <Fragment>
                 <Header />
-                <div className="contentDiv">
+                <div className="menuAndContent">
                     <LeftMenu />
                     <CategoryStaffs infoCategory={infoCategory} isFetching={isFetching}  />
                 </div>
-            </div>
+            </Fragment>
         );
     }
 }

src/container/LeftMenu.js

@@ -7,8 +7,10 @@ import CategoryMenu from '../components/LeftMenu';
 
 class LeftMenu extends Component {
 
-    componentWillMount() {
+    componentDidMount() {
+       
         this.props.getCategoriesData();
+        
         // this.props.getAllCategory()
        
     }
@@ -24,6 +26,7 @@ class LeftMenu extends Component {
                     podCategory={podCategory}
                     isAdmin = { isAdmin }
                     getUser={ getUser } 
+                    
                 />
             </Fragment>
         );

src/container/MainPage.js

@@ -13,17 +13,6 @@ import AllStaffs from "../components/AllStaffs"
 
 class MainPage extends Component {
    
-    //  componentDidUpdate(prevProps){
-
-    //     let localS = JSON.parse(localStorage.getItem("login"));
-    //     console.log("prevProps-" ,prevProps, "this.props-", this.props)
-    //     if ( prevProps.isFetching !== this.props.isFetching ){
-    //         console.log(2342)
-    //         this.setState({trig: !this.state.trig})
-    //        //this.props.getStaffsData()
-    //     }
-
-    // }
     componentDidMount() {
         
         const { getStaffsData, getUsersDataById } = this.props
@@ -42,14 +31,14 @@ class MainPage extends Component {
     render() {
 
         const { inputStaffs, isFetching, getUser } = this.props
-        const { name, isAdmin, id } = this.props
+        const {  name, isAdmin, id } = this.props
 
         return (
             <Fragment>
-                <Header name={name} getUser={getUser} id={id} />
+                <Header name={ name } getUser={ getUser } id={ id }/>
                 <div className="menuAndContent">
-                    <LeftMenu isAdmin={isAdmin} getUser={getUser} />
-                    <AllStaffs inputStaffs={inputStaffs} isFetching={isFetching} />
+                    <LeftMenu isAdmin = {isAdmin} getUser={ getUser } />
+                    <AllStaffs inputStaffs={inputStaffs} isFetching={isFetching} isAdmin = {isAdmin} getUser={ getUser } />
                 </div>
             </Fragment>
         );

src/container/MainPageStaffInfo.js

@@ -1,6 +1,9 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import { connect} from 'react-redux';
-import * as actions from "../actions/getStaffByIdAction";
+import {getStaffsDataById} from "../actions/getStaffByIdAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
 import { bindActionCreators } from "redux";
 
 import FullInfoAboutStaff from '../components/AllStaffs/FullInfoAboutStaff'
@@ -9,19 +12,26 @@ import Header from '../container/Header'
 
 class MainPageStaffInfo extends Component {
         componentDidMount(){
-            const { getStaffsDataById, match } = this.props
+            const { getStaffsDataById, match, getUsersDataById } = this.props
             getStaffsDataById(match.params.id)
+            let localS = JSON.parse(localStorage.getItem("login"));
+                if(localS===null){
+
+                }
+                else{
+                    getUsersDataById(localS)
+                }
         }
     render() {
-       
+            const { getUser } = this.props
         return (
-            <div>
-
-                <Header />
-                <LeftMenu/>
-                <FullInfoAboutStaff {...this.props} />
-
-            </div>
+            <Fragment>
+                <Header getUser={ getUser } />
+                <div className="menuAndContent">
+                    <LeftMenu getUser={ getUser }/>
+                    <FullInfoAboutStaff {...this.props} />
+                </div>
+            </Fragment>
         );
     }
 }
@@ -30,10 +40,11 @@ const mapStateToProps = state => ({
 
     InfoStaff: state.staffById.infoStaffs,
     isFetching: state.staffById.isFetching,
+    getUser: state.getUserById.getUser,
 
   });
   
-  const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+  const mapDispatchToProps = dispatch => bindActionCreators({ getUsersDataById, getStaffsDataById }, dispatch);
   
   export default MainPageStaffInfo = connect(
         mapStateToProps,

src/container/SearchStaff.js

@@ -1,10 +1,13 @@
-import React, { Component } from 'react';
-import { connect} from 'react-redux';
-import * as actions from "../actions/searchStaffAction";
+import React, { Component, Fragment } from 'react';
+import { connect } from 'react-redux';
+import { searchStaff } from "../actions/searchStaffAction";
+
+import { getUsersDataById } from "../actions/getUserById"
 
 import { bindActionCreators } from "redux";
 
 
+
 import SearchStaffsPage from "../components/SearchStaffsPage"
 import LeftMenu from '../container/LeftMenu'
 import Header from '../container/Header'
@@ -13,31 +16,43 @@ import Header from '../container/Header'
 
 
 class SearchStaff extends Component {
-    componentDidMount(){
-        const { searchStaff, match } = this.props
+    componentDidMount() {
+        const { searchStaff, match, getUsersDataById } = this.props
         searchStaff(match.params.title)
-      }
-      render() {
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
+    }
+    render() {
+        const { getUser } = this.props
+
         console.log(this.props)
         return (
-          <div>
-            <Header />
-            <LeftMenu />
-            <SearchStaffsPage {...this.props} />
-          </div>       
+            <Fragment>
+                <Header getUser={getUser} />
+                <div className="menuAndContent">
+                    <LeftMenu getUser={getUser} />
+                    <SearchStaffsPage {...this.props} />
+                </div>  
+          </Fragment>       
         );
-      }
+    }
 }
 
 
 const mapStateToProps = state => ({
     searchData: state.searchStaff.searchData,
     isFetching: state.searchStaff.isFetching,
+    getUser: state.getUserById.getUser,
 });
 
-const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ searchStaff, getUsersDataById }, dispatch);
 
 export default SearchStaff = connect(
-      mapStateToProps,
-      mapDispatchToProps
+    mapStateToProps,
+    mapDispatchToProps
 )(SearchStaff);

src/container/SearchStaffsInfo.js

@@ -1,6 +1,9 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import { connect} from 'react-redux';
-import * as actions from "../actions/searchStaffByIdAction";
+import {getSeacrhStaffsDataById} from "../actions/searchStaffByIdAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
 import { bindActionCreators } from "redux";
 
 import SearchFullInfoStaff from '../components/SearchStaffsPage/SearchFullInfoStaff'
@@ -9,17 +12,26 @@ import Header from '../container/Header'
 
 class SearchInfoStaffsInfo extends Component {
         componentDidMount(){
-            const { getSeacrhStaffsDataById, match } = this.props
+            const { getSeacrhStaffsDataById, match, getUsersDataById } = this.props
             getSeacrhStaffsDataById(match.params.id)
+            let localS = JSON.parse(localStorage.getItem("login"));
+            if(localS===null){
+
+            }
+            else{
+                getUsersDataById(localS)
+            }
         }
     render() {
-       
+        const {  getUser } = this.props
         return (
-            <div>
-                <Header />
-                <LeftMenu />
-                <SearchFullInfoStaff {...this.props}/>
-            </div>
+            <Fragment>
+                <Header getUser={ getUser } />
+                <div className="menuAndContent">
+                    <LeftMenu getUser={ getUser } />
+                    <SearchFullInfoStaff {...this.props}/>
+                </div>
+            </Fragment>
         );
     }
 }
@@ -28,10 +40,11 @@ const mapStateToProps = state => ({
 
     fullInfoSearchData: state.searchStaffById.fullInfoSearchData,
     isFetching: state.searchStaffById.isFetching,
+    getUser: state.getUserById.getUser,
 
   });
   
-  const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+  const mapDispatchToProps = dispatch => bindActionCreators({ getSeacrhStaffsDataById, getUsersDataById }, dispatch);
   
   export default SearchInfoStaffsInfo = connect(
         mapStateToProps,

src/container/UserProfile.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 
 import { Link } from "react-router-dom";
 
@@ -12,6 +12,8 @@ import { getParams } from "../actions/getUserById"
 
 import { bindActionCreators } from "redux";
 
+import Header from '../container/Header'
+
 class UserProfile extends Component {
 
     singOut = () => {
@@ -22,23 +24,31 @@ class UserProfile extends Component {
 
     componentDidMount() {
         const { getUsersDataById } = this.props
-            
-              let localS = JSON.parse(localStorage.getItem("login"));
-                if(localS===null){
-
-                }
-                else{
-                    getUsersDataById(localS)
-                }     
+        console.log(this.props);
+
+
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
     }
     render() {
         console.log(this.props)
-
+        const { getUser } = this.props
+        const { staffs } = this.props.getUser
         return (
-            <div>
-                {this.props.getUser.name}
-                <button onClick={this.singOut}><Link to="/">Выход</Link></button>
-            </div>
+            <Fragment>
+                <Header getUser={ getUser } />
+                <div className="menuAndContent">
+                    {staffs !== undefined && <div className="profil"><h2>{getUser.name}</h2>
+                        {staffs.map((el, key) => <div key={key}> {el.title} </div>)}
+                        <button onClick={this.singOut}><Link to="/">Выход</Link></button>
+                    </div>}
+                </div>
+            </Fragment>
         );
     }
 }
@@ -47,7 +57,7 @@ class UserProfile extends Component {
 const mapStateToProps = state => ({
     inputData: state.usersAuth.inputData,
     getUser: state.getUserById.getUser,
-    
+
 });
 
 const mapDispatchToProps = dispatch => bindActionCreators({ getUsersData, getUsersDataById, getParams }, dispatch);

src/container/renderAuthorisation.js

@@ -3,7 +3,7 @@ import { bindActionCreators } from "redux";
 import { connect} from 'react-redux';
 
 import Form from "../components/Auth/authorisation";
-import * as actions from "../actions/usersAuthActions";
+import { getUsersData } from "../actions/usersAuthActions";
 
 class RenderAuthorisation extends Component {      
     render() {
@@ -17,9 +17,10 @@ class RenderAuthorisation extends Component {
 
 
 const mapStateToProps = state => ({
+  inputData: state.usersAuth.inputData
 });
 
-const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+const mapDispatchToProps = dispatch => bindActionCreators({ getUsersData }, dispatch);
 
 export default RenderAuthorisation = connect(
   mapStateToProps,

src/container/renderRegistration.js

@@ -8,9 +8,9 @@ import * as actions from "../actions/usersRegistrActions";
 class RenderRegistration extends Component {
     render() {
         return (
-            <Fragment>
+            <div className="formdiv">
                 <RegistrForm {...this.props} />
-            </Fragment>
+            </div>
         );
     }
 }

src/reducer/addStaff.js

@@ -2,13 +2,14 @@ import * as types from '../constants/actionTypes';
 
 const initState = {
     staffData: [],
+    photo: [],
     isFetching: false,
     error: null,
     showModal: false
 }
 
 export default ( state = initState, { type, payload } ) => {
-    
+    console.log(payload)
     switch (type){
         case types.ADD_NEW_STAFF_REQUEST: {
             return {
@@ -37,6 +38,28 @@ export default ( state = initState, { type, payload } ) => {
                 ...state,
                 showModal: false
             }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                photo: state.photo.concat(payload),
+                isFetching: false,
+               
+            }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                
+            }
         }
          default: return state;
     }

src/reducer/categoryById.js

@@ -8,6 +8,7 @@ const initState = {
 
 export default (state = initState, { type, payload }) => {
     switch (type) {
+
         case types.CATEGORY_REQUEST_BY_ID: {
             return {
                 ...state,

src/reducer/usersAuthorisation.js

@@ -8,6 +8,7 @@ const initState = {
   };
 
 export default (state = initState, {type, payload} ) => {
+ 
     switch(type) {
         case types.USER_AUTH_REQUEST: {
             return {
@@ -38,6 +39,7 @@ export default (state = initState, {type, payload} ) => {
             }
         }
         
+        
         default: return state;
     }
 };

src/router.js

@@ -3,13 +3,13 @@ import { Switch, Route, withRouter } from "react-router-dom";
 import { connect } from 'react-redux';
 import { bindActionCreators } from "redux";
 
-import PrivateRoute from './components/usersProtectPage/PrivateRoute'
 
-import { getUsersDataById } from "./actions/getUserById"
-import { getUsersData } from './actions/usersAuthActions'
+
+
+
 
 import MainPage from "./container/MainPage";
-import userProfile from './container/UserProfile'
+
 import RenderAuthorisation from "./container/renderAuthorisation"
 import RenderRegistration from "./container/renderRegistration"
 import CategoryStaffInfo from './container/CategoryStaffInfo'
@@ -23,32 +23,44 @@ import AddNewCategory from './container/AddNewCategory'
 // import RegistrForm from './components/Auth/registration'
 // import UserProtect from './components/usersProtectPage/'
 // import UserProfile from './components/Header/Myprofile'
-//import addCategory from './components/privateRouterComponents/addCategoryIfAdmin'
+
+
+import PrivateRoute from './components/usersProtectPage/PrivateRoute'
+
+import userProfile from  './container/UserProfile'
+
+import { getUsersDataById } from "./actions/getUserById"
+
+import { getUsersData } from './actions/usersAuthActions'
+
+import addCategory from './components/privateRouterComponents/addCategoryIfAdmin'
 
 class Router extends Component {
-    render() {
-
-        const { inputData, params } = this.props
-
-        return (
-            <Fragment>
-                <Switch>
-                    <PrivateRoute path="/" data={inputData} params={params} exact component={MainPage} />
-                    {/* <Route path="/" exact component={MainPage} /> */}
-                    <Route path="/user/:id" exact component={userProfile} />
-                    <Route path="/authorisation" exact component={RenderAuthorisation} />
-                    <Route path="/auth" exact component={RenderAuthorisation} />
-                    <Route path="/registration" exact component={RenderRegistration} />
-                    <Route path="/category/staff/:id" exact component={CategoryStaffInfo} />
-                    <Route path="/staff/:id" exact component={MainPageStaffInfo} />
-                    <Route path="/search/:title" exact component={SearchStaffs} />
-                    <Route path="/search/Staff/:id" exact component={SearchStaffsInfo} />
-                    <Route path="/newStaff" exact component={AddNewStaff} />
-                    <Route path="/addCategory" exact component={AddNewCategory} />
-                </Switch>
-            </Fragment>
-        )
-    }
+
+   render() {
+       
+       const { inputData, trig, params} = this.props
+      
+       return (
+    <div>
+	    <Switch>
+            <PrivateRoute path="/"   data= { inputData } params = {params} exact component={MainPage} />
+            {/* <Route path="/" exact component={MainPage} /> */}
+            <Route path="/user/:id" exact component={userProfile} />
+            <Route path="/authorisation" exact component={RenderAuthorisation} />
+            <Route path="/auth" exact component= {RenderAuthorisation}/>
+            <Route path="/registration" exact component={RenderRegistration} />
+            <Route path="/category/staff/:id" exact component={CategoryStaffInfo} />
+            <Route path="/staff/:id" exact component={MainPageStaffInfo} />
+            <Route path="/search/:title"   exact component={SearchStaffs} />
+                <Route path="/search/Staff/:id" exact component={SearchStaffsInfo} />
+            <Route path="/newStaff" exact component={AddNewStaff} />
+            <Route path="/addCategory" exact component={AddNewCategory} />
+	    </Switch>
+    </div>
+       )
+   }
+
 }
 
 const mapStateToProps = state => ({

src/style/components/_allStaff.scss

@@ -42,9 +42,44 @@
 
     .imgStaff{
         width: 100%;
+        height: 80%;
         padding: 5px ;
        
     }
+    .staffinfo{
+        width: 100%;
+        height: 100%;
+        margin: 10px;
+        padding: 1%;
+        border: none;
+        outline: none;
+        border: 0px;
+        cursor: pointer;
+        color: #FD7F71;
+        transition: .3s ease-out;
+        border-radius: 10px;
+        background-color: #fff;
+        box-shadow: 0 1px 1px rgba(187, 216, 216, 0.6), 
+            0 3px 3px rgba(187, 216, 216, 0.4), 
+            0 8px 16px rgba(187, 216, 216, 0.3);
+
+        .titlleAndPrice{
+            display: flex;
+            justify-content: space-around;
+            padding-top: 10px;
+
+        }
+
+        .fullImgStaff{
+            width: 480px;
+            height: 320px;
+            border: none;
+            outline: none;
+            border: 1px;
+            border-radius: 10px;    
+            animation-timing-function: linear;
+        }
+    }
 
     .loader{
         position: fixed;
@@ -109,6 +144,97 @@
 // }
 
 
+.carusel{
+    border: none;
+        outline: none;
+        border: 0px;
+    border-radius: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.viwe-carusel{
+    height: 100%;
+    width: var(--main-width);
+    display: flex;
+    flex-direction: row;
+    overflow: hidden;
+}
+.el-carusel{
+    height: 100%;
+    border: none;
+        outline: none;
+        border: 0px;
+    border-radius: 10px;
+    width: var(--main-width);
+    user-select: none;
+    animation-timing-function: linear;
+}
+.el-carusel::befor{
+    animation: eye 3s ease-in-out infinite;
+}
+.scropl-carusel{
+    width: 99999px;
+    display: flex;
+    transition: all 2s ease-in-out;
+}
+.scropl-carusel-finish{
+    width: 99999px;
+    display: flex;
+    transition: all 0s ease-in-out;
+}
+.img-carusel{
+  width: 100%;
+  height: 100%;
+}
+.but{
+  display: flex;
+  font-size: 2rem;
+  color: #424271;
+  background-color: #efeded;
+  height: 50px;
+  width: 50px;
+  /*position: relative;
+  top: 125px;*/
+  transform: translate(100%);
+  font-weight: bold;
+  opacity: 0.5;
+  user-select: none;
+}
+.but:hover{
+  color: #ccd024;
+  cursor: pointer;
+  opacity: 1;
+}
+.back{
+  z-index: 1;
+  align-items: center;
+  justify-content: center;
+  /*transform: translateX(100%);*/
+}
+.next{
+  z-index: 1;
+  align-items: center;
+  justify-content: center;
+  transform: rotate(180deg) translate(100%);
+}
+
+
+.ant-carousel{
+    width: 480px;
+}
 
+.ant-carousel .slick-slide {
+    width: 480px;
+    text-align: center;
+    height: 320px;
+    line-height: 160px;
+    overflow: hidden;
+  }
   
+  .ant-carousel .slick-slide h3 {
+    color: #fff;
+  }
+
+ 
 

src/style/components/_form.scss

@@ -12,17 +12,12 @@
     
     .form {
         box-sizing: border-box;
-        width: 460px;
+        width: 500px;
         box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
         padding-bottom: 40px;
         border-radius: 3px;
         background-color: rgba(247, 240, 240, 0.7);
         
-        
-        h1 {
-            box-sizing: border-box;
-            padding: 20px;
-        }
     }
 
     .input {
@@ -86,6 +81,11 @@
         }
     }
 
+    .file{
+        width: 100%;
+        height: 100px;
+    }
+
     .buttonConteiner{
         display: flex;
         justify-content: center;
@@ -237,4 +237,7 @@ input[type=number]::-webkit-outer-spin-button {
   .zone4{
     left: 63%;
     top: 60%;
+  }
+  .auth__button{
+    
   }

src/style/components/_formLogin.scss

@@ -186,12 +186,10 @@ h1, .input::-webkit-input-placeholder, .button {
     background-color: #FD7F71
   }
   .auth__button{
-  
     width: 100%;
     display : flex;
     padding-top: 30px;
     padding-bottom: 30px;
-    
   }
   .btn1{
     width: 180px;

src/style/components/_userProfil.scss

@@ -0,0 +1,14 @@
+.profil{
+    width: 100%;
+    height: 75vh;
+    margin: 10px;
+    padding: 1%;
+    border: none;
+    border: 0px;
+    color: #FD7F71;
+    border-radius: 10px;
+    background-color: #fff; 
+    h2{
+        text-align: center;
+    }
+}

src/style/components/auth.scss

@@ -116,3 +116,4 @@ h1 {
     padding-bottom: 10px;
     padding-top: 10px;
 }
+

src/style/index.scss

@@ -6,11 +6,12 @@
 
 @import "layout/container";
 
-@import "components/header";
 @import "components/allStaff";
-@import "components/leftMenu";
-// @import "components/formLogin";
 @import "components/form";
+// @import "components/formLogin";
+@import "components/header";
+@import "components/leftMenu";
+@import "components/userProfil";
 
 // @import './components/auth.scss';