Merge pull request #27 from apuc/authentication

fixes

package-lock.json

@@ -2929,6 +2929,22 @@
         "indent-string": "^4.0.0"
       }
     },
+    "airbnb-prop-types": {
+      "version": "2.16.0",
+      "resolved": "https://registry.npmjs.org/airbnb-prop-types/-/airbnb-prop-types-2.16.0.tgz",
+      "integrity": "sha512-7WHOFolP/6cS96PhKNrslCLMYAI8yB1Pp6u6XmxozQOiZbsI5ycglZr5cHhBFfuRcQQjzCMith5ZPZdYiJCxUg==",
+      "requires": {
+        "array.prototype.find": "^2.1.1",
+        "function.prototype.name": "^1.1.2",
+        "is-regex": "^1.1.0",
+        "object-is": "^1.1.2",
+        "object.assign": "^4.1.0",
+        "object.entries": "^1.1.2",
+        "prop-types": "^15.7.2",
+        "prop-types-exact": "^1.2.0",
+        "react-is": "^16.13.1"
+      }
+    },
     "ajv": {
       "version": "6.12.6",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -3076,6 +3092,15 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
+    "array.prototype.find": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.1.1.tgz",
+      "integrity": "sha512-mi+MYNJYLTx2eNYy+Yh6raoQacCsNeeMUaspFPh9Y141lFSsWxxB8V9mM2ye+eqiRs917J6/pJ4M9ZPzenWckA==",
+      "requires": {
+        "define-properties": "^1.1.3",
+        "es-abstract": "^1.17.4"
+      }
+    },
     "array.prototype.flat": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.2.4.tgz",
@@ -4449,6 +4474,11 @@
       "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz",
       "integrity": "sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA=="
     },
+    "consolidated-events": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/consolidated-events/-/consolidated-events-2.0.2.tgz",
+      "integrity": "sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ=="
+    },
     "constants-browserify": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
@@ -5253,6 +5283,14 @@
         "esutils": "^2.0.2"
       }
     },
+    "document.contains": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/document.contains/-/document.contains-1.0.2.tgz",
+      "integrity": "sha512-YcvYFs15mX8m3AO1QNQy3BlIpSMfNRj3Ujk2BEJxsZG+HZf7/hZ6jr7mDpXrF8q+ff95Vef5yjhiZxm8CGJr6Q==",
+      "requires": {
+        "define-properties": "^1.1.3"
+      }
+    },
     "dom-accessibility-api": {
       "version": "0.5.4",
       "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.4.tgz",
@@ -7049,11 +7087,27 @@
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
       "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
     },
+    "function.prototype.name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.4.tgz",
+      "integrity": "sha512-iqy1pIotY/RmhdFZygSSlW0wko2yxkSCKqsuv4pr8QESohpYyG/Z7B/XXvPRKTJS//960rgguE5mSRUsDdaJrQ==",
+      "requires": {
+        "call-bind": "^1.0.2",
+        "define-properties": "^1.1.3",
+        "es-abstract": "^1.18.0-next.2",
+        "functions-have-names": "^1.2.2"
+      }
+    },
     "functional-red-black-tree": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
       "integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc="
     },
+    "functions-have-names": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.2.tgz",
+      "integrity": "sha512-bLgc3asbWdwPbx2mNk2S49kmJCuQeu0nfmaOgbs8WIyzzkw3r4htszdIi9Q9EMezDPTYuJx2wvjZ/EwgAthpnA=="
+    },
     "gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -12359,6 +12413,16 @@
         "react-is": "^16.8.1"
       }
     },
+    "prop-types-exact": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/prop-types-exact/-/prop-types-exact-1.2.0.tgz",
+      "integrity": "sha512-K+Tk3Kd9V0odiXFP9fwDHUYRyvK3Nun3GVyPapSIs5OBkITAm15W0CPFD/YKTkMUAbc0b9CUwRQp2ybiBIq+eA==",
+      "requires": {
+        "has": "^1.0.3",
+        "object.assign": "^4.1.0",
+        "reflect.ownkeys": "^0.2.0"
+      }
+    },
     "prop-types-extra": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
@@ -12763,6 +12827,18 @@
         "prop-types": "^15.7.2"
       }
     },
+    "react-outside-click-handler": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz",
+      "integrity": "sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==",
+      "requires": {
+        "airbnb-prop-types": "^2.15.0",
+        "consolidated-events": "^1.1.1 || ^2.0.0",
+        "document.contains": "^1.0.1",
+        "object.values": "^1.1.0",
+        "prop-types": "^15.7.2"
+      }
+    },
     "react-overlays": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-5.0.1.tgz",
@@ -13107,6 +13183,11 @@
       "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
       "integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
     },
+    "reflect.ownkeys": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz",
+      "integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA="
+    },
     "regenerate": {
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",

package.json

@@ -17,6 +17,7 @@
     "react-bootstrap": "^1.6.0",
     "react-dom": "^17.0.2",
     "react-loader-spinner": "^4.0.0",
+    "react-outside-click-handler": "^1.3.0",
     "react-phone-input-2": "^2.14.0",
     "react-redux": "^7.2.4",
     "react-router-dom": "^5.2.0",

src/components/Footer/footer.css

@@ -1,5 +1,5 @@
 footer {
-    padding: 0 5rem;
+    padding: 2rem 5rem;
   }
   
 footer>div {

src/components/Form/Form.module.css

@@ -2,7 +2,7 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  margin-top: 180px;
+  margin-top: 120px;
 }
 
 .form > label {

src/components/Outstaffing/OutstaffingBlock.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import OutsideClickHandler from 'react-outside-click-handler';
 import { useDispatch, useSelector } from 'react-redux';
 import { selectItems, selectedItems, filteredCandidates } from '../../redux/outstaffingSlice';
 import { fetchItemsForId } from '../../server/server';
@@ -50,6 +51,11 @@ const OutstaffingBlock = ({ dataTags = [], selected, img, header, positionId, is
   });
 
   return (
+    <OutsideClickHandler
+      onOutsideClick={() => {
+        isSelected && onSelect(null)
+      }}
+    >
     <div className={`${style.outstaffing__box} ${isSelected?style.outstaffing__box__selected:''}`} >
       <div className={`${style.outstaffing__box__img} ${selected ? style.border : ''}`} onClick={()=>handlePositionClick({dispatch, positionId, isSelected, onSelect})}>
         <h3>{header}</h3>
@@ -68,6 +74,7 @@ const OutstaffingBlock = ({ dataTags = [], selected, img, header, positionId, is
         )}
       </div>
     </div>
+    </OutsideClickHandler>
   );
 };
 

src/components/Sidebar/Sidebar.js

@@ -4,13 +4,15 @@ import maleBig from '../../images/medium_male_big.png';
 import style from './Sidebar.module.css';
 
 const getYearsString = (years) => {
-  let yearsString = 'года';
+  let yearsString;
   if (years%10 === 1) {
     yearsString = 'год';
   } else if (years === 11 || years === 12 || years === 13 || years === 14) {
     yearsString = 'лет';
   } else if (years%10 === 2 || years%10 === 3 || years%10 === 4) {
     yearsString = 'года';
+  } else {
+    yearsString = 'лет';
   }
   return `${years} ${yearsString}`;
 }
@@ -24,7 +26,7 @@ const Sidebar = ({ candidate }) => {
           <p className={style.candidateSidebar__info__e}>Опыт работы</p>
           <p className={style.candidateSidebar__info__y}>{getYearsString(candidate.years_of_exp)}</p>
         </> }
-                <Link to={`/candidate/${candidate.id}/form`}>
+            <Link to={`/candidate/${candidate.id}/form`}>
           <button className={style.candidateSidebar__info__btn}>Выбрать к собеседованию</button>
         </Link>
       </div>

src/server/authRedirect.js

@@ -0,0 +1,11 @@
+export const withAuthRedirect = actionCall => (link, index) => {
+    return actionCall(link, index)
+        .then(res => {
+            if(res.status && res.status == 401) {
+                localStorage.clear();
+            }
+
+            return res;
+        })
+        .catch(err => localStorage.clear())
+}

src/server/server.js

@@ -1,4 +1,6 @@
-export const fetchProfile = async (link, index) => {
+import { withAuthRedirect } from "./authRedirect"
+
+export const fetchProfile = withAuthRedirect(async (link, index) => {
   try {
     const response = await fetch(`${link}${index}`, {
       method: 'GET',
@@ -12,9 +14,9 @@ export const fetchProfile = async (link, index) => {
 
     return data
   } catch (error) {}
-}
+})
 
-export const fetchSkills = async (link) => {
+export const fetchSkills = withAuthRedirect(async (link) => {
   try {
     const response = await fetch(link, {
       method: 'GET',
@@ -28,9 +30,9 @@ export const fetchSkills = async (link) => {
 
     return data
   } catch (error) {}
-}
+})
 
-export const fetchItemsForId = async (link, id) => {
+export const fetchItemsForId = withAuthRedirect(async (link, id) => {
   console.log(`Bearer ${localStorage.getItem('auth_token')}`);
   try {
     const response = await fetch(`${link}${id}`, {
@@ -45,9 +47,9 @@ export const fetchItemsForId = async (link, id) => {
 
     return data
   } catch (error) {}
-}
+})
 
-export const fetchForm = async (link, info) => {
+export const fetchForm = withAuthRedirect(async (link, info) => {
   try {
     const response = await fetch(link, {
       method: 'POST',
@@ -62,7 +64,7 @@ export const fetchForm = async (link, info) => {
 
     return response
   } catch (error) {}
-}
+})
 
 export const fetchAuth = async ({ username, password, dispatch, catchError }) => {
   const baseURL = process.env.REACT_APP_BASE_URL;