Merge branch 'master' of https://codefirst.iut.uca.fr/git/maxence.lanone/JTT_CrM

3 years ago · 3d2039dd87
parent 93aba8e766 24f1484dec
commit 3d2039dd87
34 changed files with 1155 additions and 40 deletions
--- a/public/JTT_CrM.code-workspace
+++ b/public/JTT_CrM.code-workspace
@ -0,0 +1,11 @@
+{
+	"folders": [
+		{
+			"path": ".."
+		},
+		{
+			"path": "../../Downloads/react-contact-management-app-master"
+		}
+	],
+	"settings": {}
+}
--- a/server-api/api.js
+++ b/server-api/api.js
@ -165,3 +165,14 @@ app.post('/User/Update/:id', (req, res) => {
        res.send('Post added...' + result.insertId);
    });
 });
+
+//Api pour les contacts de la page repertoire
+
+app.get('/Contact/All', (req, res) => {
+    let sql = 'SELECT * FROM contacts ORDER BY idcontact';
+    db.query(sql, (err, result) => {
+        if (err) throw err;
+        console.log(result);
+        res.send(result);
+    });
+});
--- a/server-api/package-lock.json
+++ b/server-api/package-lock.json
@ -11,6 +11,7 @@
      "dependencies": {
        "@emotion/react": "^11.10.5",
        "@emotion/styled": "^11.10.5",
+        "@google-cloud/local-auth": "^2.1.0",
        "@mui/material": "^5.10.13",
        "body": "^5.1.0",
        "body-parser": "^1.20.1",
@ -18,6 +19,7 @@
        "cors": "^2.8.5",
        "express": "^4.18.2",
        "fullcalendar": "^5.11.3",
+        "googleapis": "^105.0.0",
        "mysql": "^2.18.1",
        "parser": "^0.1.4"
      },
@ -576,6 +578,20 @@
      "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.0.tgz",
      "integrity": "sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg=="
    },
+    "node_modules/@google-cloud/local-auth": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@google-cloud/local-auth/-/local-auth-2.1.0.tgz",
+      "integrity": "sha512-ymZ1XuyKcRcro0aiMYz3hVGbZ+QZmN5V1Eyjvw2k1xqq76PwmDer0DIPxdxkLzfW9Inr8+g+MS9t9fZ7dOlTOQ==",
+      "dependencies": {
+        "arrify": "^2.0.1",
+        "google-auth-library": "^8.0.2",
+        "open": "^7.0.3",
+        "server-destroy": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
    "node_modules/@jridgewell/gen-mapping": {
      "version": "0.1.1",
      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@ -907,6 +923,38 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/agent-base": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
+      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
+      "dependencies": {
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 6.0.0"
+      }
+    },
+    "node_modules/agent-base/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/agent-base/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
    "node_modules/ansi-styles": {
      "version": "3.2.1",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@ -936,6 +984,14 @@
      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg=="
    },
+    "node_modules/arrify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-2.0.1.tgz",
+      "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/babel-plugin-macros": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
@ -956,6 +1012,25 @@
      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
      "dev": true
    },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ]
+    },
    "node_modules/bignumber.js": {
      "version": "9.0.0",
      "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.0.0.tgz",
@ -1092,6 +1167,11 @@
        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
      }
    },
+    "node_modules/buffer-equal-constant-time": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
+      "integrity": "sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA=="
+    },
    "node_modules/bytes": {
      "version": "3.1.2",
      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
@ -1366,6 +1446,14 @@
        "csstype": "^3.0.2"
      }
    },
+    "node_modules/ecdsa-sig-formatter": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
+      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
+      "dependencies": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
    "node_modules/ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -1507,6 +1595,16 @@
        }
      ]
    },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
+    },
+    "node_modules/fast-text-encoding": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.6.tgz",
+      "integrity": "sha512-VhXlQgj9ioXCqGstD37E/HBeqEGV/qOD/kmbVG8h5xKBYvM1L3lR1Zn4555cQ8GkYbJa8aJSipLPndE1k6zK2w=="
+    },
    "node_modules/fill-range": {
      "version": "7.0.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@ -1594,6 +1692,32 @@
      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
    },
+    "node_modules/gaxios": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-5.0.2.tgz",
+      "integrity": "sha512-TjtV2AJOZoMQqRYoy5eM8cCQogYwazWNYLQ72QB0kwa6vHHruYkGmhhyrlzbmgNHK1dNnuP2WSH81urfzyN2Og==",
+      "dependencies": {
+        "extend": "^3.0.2",
+        "https-proxy-agent": "^5.0.0",
+        "is-stream": "^2.0.0",
+        "node-fetch": "^2.6.7"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/gcp-metadata": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-5.0.1.tgz",
+      "integrity": "sha512-jiRJ+Fk7e8FH68Z6TLaqwea307OktJpDjmYnU7/li6ziwvVvU2RlrCyQo5vkdeP94chm0kcSCOOszvmuaioq3g==",
+      "dependencies": {
+        "gaxios": "^5.0.0",
+        "json-bigint": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
    "node_modules/gensync": {
      "version": "1.0.0-beta.2",
      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@ -1637,6 +1761,80 @@
        "node": ">=4"
      }
    },
+    "node_modules/google-auth-library": {
+      "version": "8.7.0",
+      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-8.7.0.tgz",
+      "integrity": "sha512-1M0NG5VDIvJZEnstHbRdckLZESoJwguinwN8Dhae0j2ZKIQFIV63zxm6Fo6nM4xkgqUr2bbMtV5Dgo+Hy6oo0Q==",
+      "dependencies": {
+        "arrify": "^2.0.0",
+        "base64-js": "^1.3.0",
+        "ecdsa-sig-formatter": "^1.0.11",
+        "fast-text-encoding": "^1.0.0",
+        "gaxios": "^5.0.0",
+        "gcp-metadata": "^5.0.0",
+        "gtoken": "^6.1.0",
+        "jws": "^4.0.0",
+        "lru-cache": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/google-p12-pem": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-4.0.1.tgz",
+      "integrity": "sha512-WPkN4yGtz05WZ5EhtlxNDWPhC4JIic6G8ePitwUWy4l+XPVYec+a0j0Ts47PDtW59y3RwAhUd9/h9ZZ63px6RQ==",
+      "dependencies": {
+        "node-forge": "^1.3.1"
+      },
+      "bin": {
+        "gp12-pem": "build/src/bin/gp12-pem.js"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/googleapis": {
+      "version": "105.0.0",
+      "resolved": "https://registry.npmjs.org/googleapis/-/googleapis-105.0.0.tgz",
+      "integrity": "sha512-wH/jU/6QpqwsjTKj4vfKZz97ne7xT7BBbKwzQEwnbsG8iH9Seyw19P+AuLJcxNNrmgblwLqfr3LORg4Okat1BQ==",
+      "dependencies": {
+        "google-auth-library": "^8.0.2",
+        "googleapis-common": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/googleapis-common": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/googleapis-common/-/googleapis-common-6.0.3.tgz",
+      "integrity": "sha512-Xyb4FsQ6PQDu4tAE/M/ev4yzZhFe2Gc7+rKmuCX2ZGk1ajBKbafsGlVYpmzGqQOT93BRDe8DiTmQb6YSkbICrA==",
+      "dependencies": {
+        "extend": "^3.0.2",
+        "gaxios": "^5.0.1",
+        "google-auth-library": "^8.0.2",
+        "qs": "^6.7.0",
+        "url-template": "^2.0.8",
+        "uuid": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/gtoken": {
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-6.1.2.tgz",
+      "integrity": "sha512-4ccGpzz7YAr7lxrT2neugmXQ3hP9ho2gcaityLVkiUecAiwiy60Ii8gRbZeOsXV19fYaRjgBSshs8kXw+NKCPQ==",
+      "dependencies": {
+        "gaxios": "^5.0.1",
+        "google-p12-pem": "^4.0.0",
+        "jws": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
    "node_modules/has": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
@ -1700,6 +1898,39 @@
        "node": ">= 0.8"
      }
    },
+    "node_modules/https-proxy-agent": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
+      "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
+      "dependencies": {
+        "agent-base": "6",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/https-proxy-agent/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/https-proxy-agent/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
    "node_modules/iconv-lite": {
      "version": "0.4.24",
      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@ -1773,6 +2004,20 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/is-docker": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
+      "bin": {
+        "is-docker": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/is-extglob": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@ -1803,6 +2048,28 @@
        "node": ">=0.12.0"
      }
    },
+    "node_modules/is-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
+      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-wsl": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+      "dependencies": {
+        "is-docker": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/isarray": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
@ -1825,6 +2092,14 @@
        "node": ">=4"
      }
    },
+    "node_modules/json-bigint": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-1.0.0.tgz",
+      "integrity": "sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==",
+      "dependencies": {
+        "bignumber.js": "^9.0.0"
+      }
+    },
    "node_modules/json-parse-even-better-errors": {
      "version": "2.3.1",
      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
@ -1842,6 +2117,25 @@
        "node": ">=6"
      }
    },
+    "node_modules/jwa": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/jwa/-/jwa-2.0.0.tgz",
+      "integrity": "sha512-jrZ2Qx916EA+fq9cEAeCROWPTfCwi1IVHqT2tapuqLEVVDKFDENFw1oL+MwrTvH6msKxsd1YTDVw6uKEcsrLEA==",
+      "dependencies": {
+        "buffer-equal-constant-time": "1.0.1",
+        "ecdsa-sig-formatter": "1.0.11",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "node_modules/jws": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jws/-/jws-4.0.0.tgz",
+      "integrity": "sha512-KDncfTmOZoOMTFG4mBlG0qUIOlc03fmzH+ru6RgYVZhPkyiy/92Owlt/8UEN+a4TXR1FQetfIpJE8ApdvdVxTg==",
+      "dependencies": {
+        "jwa": "^2.0.0",
+        "safe-buffer": "^5.0.1"
+      }
+    },
    "node_modules/lines-and-columns": {
      "version": "1.2.4",
      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@ -1858,6 +2152,17 @@
        "loose-envify": "cli.js"
      }
    },
+    "node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
    "node_modules/media-typer": {
      "version": "0.3.0",
      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@ -1948,6 +2253,33 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/node-fetch": {
+      "version": "2.6.7",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz",
+      "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
+      "dependencies": {
+        "whatwg-url": "^5.0.0"
+      },
+      "engines": {
+        "node": "4.x || >=6.0.0"
+      },
+      "peerDependencies": {
+        "encoding": "^0.1.0"
+      },
+      "peerDependenciesMeta": {
+        "encoding": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/node-forge": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.1.tgz",
+      "integrity": "sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==",
+      "engines": {
+        "node": ">= 6.13.0"
+      }
+    },
    "node_modules/node-releases": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.6.tgz",
@ -2033,6 +2365,21 @@
        "node": ">= 0.8"
      }
    },
+    "node_modules/open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "dependencies": {
+        "is-docker": "^2.0.0",
+        "is-wsl": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/parent-module": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@ -2373,6 +2720,11 @@
        "node": ">= 0.8.0"
      }
    },
+    "node_modules/server-destroy": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/server-destroy/-/server-destroy-1.0.1.tgz",
+      "integrity": "sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ=="
+    },
    "node_modules/setprototypeof": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
@ -2527,6 +2879,11 @@
        "nodetouch": "bin/nodetouch.js"
      }
    },
+    "node_modules/tr46": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
+      "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw=="
+    },
    "node_modules/type-is": {
      "version": "1.6.18",
      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
@ -2579,6 +2936,11 @@
        "browserslist": ">= 4.21.0"
      }
    },
+    "node_modules/url-template": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/url-template/-/url-template-2.0.8.tgz",
+      "integrity": "sha512-XdVKMF4SJ0nP/O7XIPB0JwAEuT9lDIYnNsK8yGVe43y0AWoKeJNdv3ZNWh7ksJ6KqQFjOO6ox/VEitLnaVNufw=="
+    },
    "node_modules/util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@ -2592,6 +2954,14 @@
        "node": ">= 0.4.0"
      }
    },
+    "node_modules/uuid": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz",
+      "integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
    "node_modules/vary": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@ -2600,6 +2970,25 @@
        "node": ">= 0.8"
      }
    },
+    "node_modules/webidl-conversions": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+      "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
+    },
+    "node_modules/whatwg-url": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
+      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
+      "dependencies": {
+        "tr46": "~0.0.3",
+        "webidl-conversions": "^3.0.0"
+      }
+    },
+    "node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "node_modules/yaml": {
      "version": "1.10.2",
      "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
@ -3026,6 +3415,17 @@
      "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.0.tgz",
      "integrity": "sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg=="
    },
+    "@google-cloud/local-auth": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@google-cloud/local-auth/-/local-auth-2.1.0.tgz",
+      "integrity": "sha512-ymZ1XuyKcRcro0aiMYz3hVGbZ+QZmN5V1Eyjvw2k1xqq76PwmDer0DIPxdxkLzfW9Inr8+g+MS9t9fZ7dOlTOQ==",
+      "requires": {
+        "arrify": "^2.0.1",
+        "google-auth-library": "^8.0.2",
+        "open": "^7.0.3",
+        "server-destroy": "^1.0.1"
+      }
+    },
    "@jridgewell/gen-mapping": {
      "version": "0.1.1",
      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@ -3218,6 +3618,29 @@
        "negotiator": "0.6.3"
      }
    },
+    "agent-base": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
+      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
+      "requires": {
+        "debug": "4"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+          "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
    "ansi-styles": {
      "version": "3.2.1",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@ -3241,6 +3664,11 @@
      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg=="
    },
+    "arrify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-2.0.1.tgz",
+      "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug=="
+    },
    "babel-plugin-macros": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
@ -3257,6 +3685,11 @@
      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
      "dev": true
    },
+    "base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA=="
+    },
    "bignumber.js": {
      "version": "9.0.0",
      "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.0.0.tgz",
@ -3365,6 +3798,11 @@
        "update-browserslist-db": "^1.0.9"
      }
    },
+    "buffer-equal-constant-time": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
+      "integrity": "sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA=="
+    },
    "bytes": {
      "version": "3.1.2",
      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
@ -3567,6 +4005,14 @@
        "csstype": "^3.0.2"
      }
    },
+    "ecdsa-sig-formatter": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
+      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
+      "requires": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
    "ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -3678,6 +4124,16 @@
        }
      }
    },
+    "extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
+    },
+    "fast-text-encoding": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.6.tgz",
+      "integrity": "sha512-VhXlQgj9ioXCqGstD37E/HBeqEGV/qOD/kmbVG8h5xKBYvM1L3lR1Zn4555cQ8GkYbJa8aJSipLPndE1k6zK2w=="
+    },
    "fill-range": {
      "version": "7.0.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@ -3748,6 +4204,26 @@
      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
    },
+    "gaxios": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-5.0.2.tgz",
+      "integrity": "sha512-TjtV2AJOZoMQqRYoy5eM8cCQogYwazWNYLQ72QB0kwa6vHHruYkGmhhyrlzbmgNHK1dNnuP2WSH81urfzyN2Og==",
+      "requires": {
+        "extend": "^3.0.2",
+        "https-proxy-agent": "^5.0.0",
+        "is-stream": "^2.0.0",
+        "node-fetch": "^2.6.7"
+      }
+    },
+    "gcp-metadata": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-5.0.1.tgz",
+      "integrity": "sha512-jiRJ+Fk7e8FH68Z6TLaqwea307OktJpDjmYnU7/li6ziwvVvU2RlrCyQo5vkdeP94chm0kcSCOOszvmuaioq3g==",
+      "requires": {
+        "gaxios": "^5.0.0",
+        "json-bigint": "^1.0.0"
+      }
+    },
    "gensync": {
      "version": "1.0.0-beta.2",
      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@ -3779,6 +4255,62 @@
      "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
      "peer": true
    },
+    "google-auth-library": {
+      "version": "8.7.0",
+      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-8.7.0.tgz",
+      "integrity": "sha512-1M0NG5VDIvJZEnstHbRdckLZESoJwguinwN8Dhae0j2ZKIQFIV63zxm6Fo6nM4xkgqUr2bbMtV5Dgo+Hy6oo0Q==",
+      "requires": {
+        "arrify": "^2.0.0",
+        "base64-js": "^1.3.0",
+        "ecdsa-sig-formatter": "^1.0.11",
+        "fast-text-encoding": "^1.0.0",
+        "gaxios": "^5.0.0",
+        "gcp-metadata": "^5.0.0",
+        "gtoken": "^6.1.0",
+        "jws": "^4.0.0",
+        "lru-cache": "^6.0.0"
+      }
+    },
+    "google-p12-pem": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-4.0.1.tgz",
+      "integrity": "sha512-WPkN4yGtz05WZ5EhtlxNDWPhC4JIic6G8ePitwUWy4l+XPVYec+a0j0Ts47PDtW59y3RwAhUd9/h9ZZ63px6RQ==",
+      "requires": {
+        "node-forge": "^1.3.1"
+      }
+    },
+    "googleapis": {
+      "version": "105.0.0",
+      "resolved": "https://registry.npmjs.org/googleapis/-/googleapis-105.0.0.tgz",
+      "integrity": "sha512-wH/jU/6QpqwsjTKj4vfKZz97ne7xT7BBbKwzQEwnbsG8iH9Seyw19P+AuLJcxNNrmgblwLqfr3LORg4Okat1BQ==",
+      "requires": {
+        "google-auth-library": "^8.0.2",
+        "googleapis-common": "^6.0.0"
+      }
+    },
+    "googleapis-common": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/googleapis-common/-/googleapis-common-6.0.3.tgz",
+      "integrity": "sha512-Xyb4FsQ6PQDu4tAE/M/ev4yzZhFe2Gc7+rKmuCX2ZGk1ajBKbafsGlVYpmzGqQOT93BRDe8DiTmQb6YSkbICrA==",
+      "requires": {
+        "extend": "^3.0.2",
+        "gaxios": "^5.0.1",
+        "google-auth-library": "^8.0.2",
+        "qs": "^6.7.0",
+        "url-template": "^2.0.8",
+        "uuid": "^9.0.0"
+      }
+    },
+    "gtoken": {
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-6.1.2.tgz",
+      "integrity": "sha512-4ccGpzz7YAr7lxrT2neugmXQ3hP9ho2gcaityLVkiUecAiwiy60Ii8gRbZeOsXV19fYaRjgBSshs8kXw+NKCPQ==",
+      "requires": {
+        "gaxios": "^5.0.1",
+        "google-p12-pem": "^4.0.0",
+        "jws": "^4.0.0"
+      }
+    },
    "has": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
@ -3829,6 +4361,30 @@
        "toidentifier": "1.0.1"
      }
    },
+    "https-proxy-agent": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
+      "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
+      "requires": {
+        "agent-base": "6",
+        "debug": "4"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+          "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
    "iconv-lite": {
      "version": "0.4.24",
      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@ -3884,6 +4440,11 @@
        "has": "^1.0.3"
      }
    },
+    "is-docker": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ=="
+    },
    "is-extglob": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@ -3905,6 +4466,19 @@
      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
      "dev": true
    },
+    "is-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
+      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg=="
+    },
+    "is-wsl": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+      "requires": {
+        "is-docker": "^2.0.0"
+      }
+    },
    "isarray": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
@ -3921,6 +4495,14 @@
      "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
      "peer": true
    },
+    "json-bigint": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-1.0.0.tgz",
+      "integrity": "sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==",
+      "requires": {
+        "bignumber.js": "^9.0.0"
+      }
+    },
    "json-parse-even-better-errors": {
      "version": "2.3.1",
      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
@ -3932,6 +4514,25 @@
      "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
      "peer": true
    },
+    "jwa": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/jwa/-/jwa-2.0.0.tgz",
+      "integrity": "sha512-jrZ2Qx916EA+fq9cEAeCROWPTfCwi1IVHqT2tapuqLEVVDKFDENFw1oL+MwrTvH6msKxsd1YTDVw6uKEcsrLEA==",
+      "requires": {
+        "buffer-equal-constant-time": "1.0.1",
+        "ecdsa-sig-formatter": "1.0.11",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "jws": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jws/-/jws-4.0.0.tgz",
+      "integrity": "sha512-KDncfTmOZoOMTFG4mBlG0qUIOlc03fmzH+ru6RgYVZhPkyiy/92Owlt/8UEN+a4TXR1FQetfIpJE8ApdvdVxTg==",
+      "requires": {
+        "jwa": "^2.0.0",
+        "safe-buffer": "^5.0.1"
+      }
+    },
    "lines-and-columns": {
      "version": "1.2.4",
      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@ -3945,6 +4546,14 @@
        "js-tokens": "^3.0.0 || ^4.0.0"
      }
    },
+    "lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "requires": {
+        "yallist": "^4.0.0"
+      }
+    },
    "media-typer": {
      "version": "0.3.0",
      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@ -4008,6 +4617,19 @@
      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
      "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg=="
    },
+    "node-fetch": {
+      "version": "2.6.7",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz",
+      "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
+      "requires": {
+        "whatwg-url": "^5.0.0"
+      }
+    },
+    "node-forge": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.1.tgz",
+      "integrity": "sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA=="
+    },
    "node-releases": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.6.tgz",
@ -4065,6 +4687,15 @@
        "ee-first": "1.1.1"
      }
    },
+    "open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "requires": {
+        "is-docker": "^2.0.0",
+        "is-wsl": "^2.1.1"
+      }
+    },
    "parent-module": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@ -4341,6 +4972,11 @@
        "send": "0.18.0"
      }
    },
+    "server-destroy": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/server-destroy/-/server-destroy-1.0.1.tgz",
+      "integrity": "sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ=="
+    },
    "setprototypeof": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
@ -4455,6 +5091,11 @@
        "nopt": "~1.0.10"
      }
    },
+    "tr46": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
+      "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw=="
+    },
    "type-is": {
      "version": "1.6.18",
      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
@ -4485,6 +5126,11 @@
        "picocolors": "^1.0.0"
      }
    },
+    "url-template": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/url-template/-/url-template-2.0.8.tgz",
+      "integrity": "sha512-XdVKMF4SJ0nP/O7XIPB0JwAEuT9lDIYnNsK8yGVe43y0AWoKeJNdv3ZNWh7ksJ6KqQFjOO6ox/VEitLnaVNufw=="
+    },
    "util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@ -4495,11 +5141,35 @@
      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
      "integrity": "sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA=="
    },
+    "uuid": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz",
+      "integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg=="
+    },
    "vary": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="
    },
+    "webidl-conversions": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+      "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
+    },
+    "whatwg-url": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
+      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
+      "requires": {
+        "tr46": "~0.0.3",
+        "webidl-conversions": "^3.0.0"
+      }
+    },
+    "yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "yaml": {
      "version": "1.10.2",
      "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
--- a/server-api/package.json
+++ b/server-api/package.json
@ -11,6 +11,7 @@
  "dependencies": {
    "@emotion/react": "^11.10.5",
    "@emotion/styled": "^11.10.5",
+    "@google-cloud/local-auth": "^2.1.0",
    "@mui/material": "^5.10.13",
    "body": "^5.1.0",
    "body-parser": "^1.20.1",
@ -18,6 +19,7 @@
    "cors": "^2.8.5",
    "express": "^4.18.2",
    "fullcalendar": "^5.11.3",
+    "googleapis": "^105.0.0",
    "mysql": "^2.18.1",
    "parser": "^0.1.4"
  },
--- a/src/components/Contact/AddContact.js
+++ b/src/components/Contact/AddContact.js
@ -0,0 +1,42 @@
+import React, {useState} from 'react'
+import {useNavigate} from 'react-router-dom';
+// HERE ABOVE useHistory IS REPLACED WITH useNavigate 
+
+function AddContact(props) {
+    
+    const navigate=useNavigate();
+    const [User, setUser] = useState({name:"", email:""});
+    
+    let add = (e) => {
+        e.preventDefault();
+        if(User.name === "" || User.email === ""){
+            alert("All fields are mandatory!!!");
+            return
+        }
+        // THIS IS USED TO SHOW THE LIST DATA ON THE APP.JS FILE 
+        props.addContactHandler(User);
+        // THIS IS USED FOR WHEN THE ADD BUTTON IS PRESSED THE INPUT FILED AGAIN GETS EMPTY
+        setUser({name:"", email:""});
+        //console.log(props);
+        navigate('/');
+    }
+    
+    return (
+        <div className='ui main'>
+            <h2>Add Contact</h2>
+            <form className='ui form' onSubmit={add}>
+                <div className='field'>
+                    <label>Name</label>
+                    <input type="text" name="Name" placeholder='Name' value={User.name} onChange={e => setUser({...User, name: e.target.value})}/>
+                </div>
+                <div className='field'>
+                    <label>Email</label>
+                    <input type="text" name="Email" placeholder='Email' value={User.email} onChange={e => setUser({...User, email: e.target.value})}/>
+                </div>
+                <button className='ui secondary button'>Add</button>
+            </form>
+        </div>
+    )
+}
+
+export default AddContact
--- a/src/components/Contact/ContactCard.js
+++ b/src/components/Contact/ContactCard.js
@ -0,0 +1,33 @@
+import React from 'react'
+import { Link } from 'react-router-dom';
+import icon from '../../images/icon.jpg';
+
+function ContactCard(props) {
+
+    const { id, name, email } = props.contact;
+    console.log(props.contact);
+    return (
+        <div className='item'>
+            <img className='ui avatar image' src={icon} alt='icon' />
+            <div className='content'>
+                <Link to={`/contact/${id}`} state={{ contact: props.contact }}>
+                    <div className='header'>{name} </div>
+                    <div>{email}</div>
+                </Link>
+            </div>
+            <i className='trash alternate outline icon right floated'
+                style={{ color: "red", fontSize: "20px", marginLeft: "10px" }}
+                onClick={() => props.clickHandler(id)}
+            >
+            </i>
+            <Link to={`/edit`} state={{ contact: props.contact }}>
+                <i className='edit alternate outline icon right floated'
+                    style={{ color: "blue", fontSize: "20px" }}
+                >
+                </i>
+            </Link>
+        </div>
+    )
+}
+
+export default ContactCard
--- a/src/components/Contact/ContactDetail.js
+++ b/src/components/Contact/ContactDetail.js
@ -0,0 +1,33 @@
+import React from 'react'
+import {Link,useLocation} from'react-router-dom';
+import user from '../../images/user.jpg';
+
+const ContactDetail = (props) => {
+    
+    //console.log(location);
+    // HERE DUE TO NEW VERSION OF ROUTER useLocation IS USED AND 
+    // FROM CONTACTCARD IN LINK IT TOOK STATE AND THEN IT IS PASSED HERE
+    let location = useLocation();
+    const {name, email} = location.state.contact;
+
+    return (
+        <div className='main'>
+            <div className='ui center aligned card'>
+                <div className='image'>
+                    <img src={user} alt='user'></img>
+                </div>
+                <div className='content'>
+                    <div className='header'>{name}</div>
+                    <div className='description'>{email}</div>
+                </div>
+            </div>
+            <Link to="/">
+                <div className='center div'>
+                    <button className='ui red button center aligned '>Contact List</button>
+                </div>
+            </Link>
+        </div>
+    )
+}
+
+export default ContactDetail
--- a/src/components/Contact/ContactList.js
+++ b/src/components/Contact/ContactList.js
@ -0,0 +1,43 @@
+import React, {useRef} from 'react'
+import ContactCard from './ContactCard';
+import {Link} from 'react-router-dom';
+
+function ContactList(props) {
+    
+    console.log(props); 
+    const inputEl = useRef("");
+
+    const deletContactHandler = (id) => {
+        props.getContactId(id);
+    }
+
+    const renderContactList = props.contacts.map((contact)=>{
+        return(
+            <ContactCard contact={contact} clickHandler={deletContactHandler} key={contact.id}/>
+        );
+    })
+
+    const getSearchTerm = () =>{
+        props.searchKeyword(inputEl.current.value);
+    }
+
+    return (
+        <div className='main'>
+            <h2>Contact List 
+                <Link to="/add">
+                    <button className='ui primary button right floated'>Add Contact</button>
+                </Link>
+            </h2>
+            <div className='ui search'>
+                <div className='ui icon input'>
+                    <input ref={inputEl} type="text" placeholder='Search Contact' className='prompt' value={props.term} onChange={getSearchTerm}/>
+                    <i className='search icon'/>
+                </div>
+            </div>
+            <div className='ui celled list'>
+                {renderContactList.length >0 ? renderContactList:"No Contacts available"}
+            </div>
+        </div>
+    )
+}
+export default ContactList
--- a/src/components/Contact/EditContact.js
+++ b/src/components/Contact/EditContact.js
@ -0,0 +1,47 @@
+import React, {useState} from 'react'
+import {Link,useLocation} from'react-router-dom';
+import {useNavigate} from 'react-router-dom';
+// HERE ABOVE useHistory IS REPLACED WITH useNavigate 
+
+function EditContact(props) {
+    
+    const navigate = useNavigate();
+    let location = useLocation();
+    const {id, name, email} = location.state.contact;
+    const [User, setUser] = useState({id,name,email});
+
+    
+    
+    
+    let update = (e) => {
+        e.preventDefault();
+        if(User.name === "" || User.email === ""){
+            alert("All fields are mandatory!!!");
+            return
+        }
+        // THIS IS USED TO SHOW THE LIST DATA ON THE APP.JS FILE 
+        props.updateContactHandler(User);
+        // THIS IS USED FOR WHEN THE ADD BUTTON IS PRESSED THE INPUT FILED AGAIN GETS EMPTY
+        setUser({name:"", email:""});
+        navigate('/');
+    }
+    
+    return (
+        <div className='ui main'>
+            <h2>Edit Contact</h2>
+            <form className='ui form' onSubmit={update}>
+                <div className='field'>
+                    <label>Name</label>
+                    <input type="text" name="Name" placeholder='Name' value={User.name} onChange={e => setUser({...User, name: e.target.value})}/>
+                </div>
+                <div className='field'>
+                    <label>Email</label>
+                    <input type="text" name="Email" placeholder='Email' value={User.email} onChange={e => setUser({...User, email: e.target.value})}/>
+                </div>
+                <button className='ui orange button'>Update</button>
+            </form>
+        </div>
+    )
+}
+
+export default EditContact
--- a/src/components/Contact/Header.js
+++ b/src/components/Contact/Header.js
@ -0,0 +1,13 @@
+import React from 'react'
+
+function Header() {
+    return (
+        <div className="ui.fixed.menu">
+            <div className="ui center aligned container">
+                <h2>Contact Manager</h2>
+            </div>
+        </div>
+    )
+}
+
+export default Header
--- a/src/components/NavigationDashboard.js
+++ b/src/components/NavigationDashboard.js
@ -5,6 +5,7 @@ import { NavLink } from 'react-router-dom';
 //Pour image compte
 import img1 from '../img/logo_person.svg'
 import img11 from '../img/logo_person_vide.svg'
+import img12 from '../img/logo_person_light.svg'

 //Pour image dashboard
 import img2 from '../img/logo_speed.svg'
@ -28,7 +29,7 @@ import img61 from '../img/logo_parametre_vide.svg'

 const NavigationDashboard = () => {

-    const ImageToggleOnMouseOver = ({ primaryImg, secondaryImg }) => {
+    const ImageToggleOnMouseOver = ({ primaryImg, secondaryImg, tertiaryImg }) => {
        const imageRef = useRef(null);

        return (
@ -58,18 +59,14 @@ const NavigationDashboard = () => {
                    </button>
                </NavLink>
                <NavLink className="analyse" to="/Analyse">
-                    <div className="parti_two">
                        <button className="button" type="submit">
                            <ImageToggleOnMouseOver primaryImg={img3} secondaryImg={img31} alt="" />
                        </button>
-                    </div>
                </NavLink>
                <NavLink className="calendrier" to="/Calendrier">
-                    <div className="parti_two">
                        <button className="button" type="submit">
                            <ImageToggleOnMouseOver primaryImg={img4} secondaryImg={img41} alt="" />
                        </button>
-                    </div>
                </NavLink>
            </div>
            <div className="parti_three">
--- a/src/images/icon.jpg
+++ b/src/images/icon.jpg
--- a/src/images/user.jpg
+++ b/src/images/user.jpg
--- a/src/img/logo_calendrier_light.svg
+++ b/src/img/logo_calendrier_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 28.05q-.9 0-1.475-.575Q21.95 26.9 21.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 0q-.9 0-1.475-.575Q13.95 26.9 13.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm16 0q-.85 0-1.45-.575T29.95 26q0-.9.6-1.475.6-.575 1.45-.575t1.45.575q.6.575.6 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 8q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm-8 0q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm16 0q-.85 0-1.45-.6t-.6-1.45q0-.85.6-1.45t1.45-.6q.85 0 1.45.575t.6 1.475q0 .85-.575 1.45t-1.475.6ZM9.1 44.3q-1.35 0-2.375-1.025T5.7 40.9V10.1q0-1.4 1.025-2.4t2.375-1h3.15V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h16.6V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h3.15q1.4 0 2.4 1t1 2.4v30.8q0 1.35-1 2.375T38.9 44.3Zm0-3.4h29.8V19.5H9.1v21.4Z"/></svg>
--- a/src/img/logo_calendrier_vide_light.svg
+++ b/src/img/logo_calendrier_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 28.05q-.9 0-1.475-.575Q21.95 26.9 21.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 0q-.9 0-1.475-.575Q13.95 26.9 13.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm16 0q-.85 0-1.45-.575T29.95 26q0-.9.6-1.475.6-.575 1.45-.575t1.45.575q.6.575.6 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 8q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm-8 0q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm16 0q-.85 0-1.45-.6t-.6-1.45q0-.85.6-1.45t1.45-.6q.85 0 1.45.575t.6 1.475q0 .85-.575 1.45t-1.475.6ZM9.1 44.3q-1.35 0-2.375-1.025T5.7 40.9V10.1q0-1.4 1.025-2.4t2.375-1h3.15V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h16.6V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h3.15q1.4 0 2.4 1t1 2.4v30.8q0 1.35-1 2.375T38.9 44.3Zm0-3.4h29.8V19.5H9.1v21.4Zm0-24.4h29.8v-6.4H9.1Zm0 0v-6.4 6.4Z"/></svg>
--- a/src/img/logo_graph_light.svg
+++ b/src/img/logo_graph_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M15.75 34.15q.65 0 1.075-.425.425-.425.425-1.075V21.9q0-.65-.425-1.075-.425-.425-1.075-.425-.65 0-1.075.425-.425.425-.425 1.075v10.75q0 .65.45 1.075.45.425 1.05.425Zm8.25 0q.65 0 1.075-.425.425-.425.425-1.075v-17.3q0-.65-.425-1.075-.425-.425-1.075-.425-.65 0-1.075.425-.425.425-.425 1.075v17.3q0 .65.425 1.075.425.425 1.075.425Zm8.25 0q.65 0 1.075-.425.425-.425.425-1.075v-4.4q0-.65-.45-1.075-.45-.425-1.05-.425-.65 0-1.075.425-.425.425-.425 1.075v4.4q0 .65.425 1.075.425.425 1.075.425ZM9.1 42.3q-1.35 0-2.375-1.025T5.7 38.9V9.1q0-1.4 1.025-2.4t2.375-1h29.8q1.4 0 2.4 1t1 2.4v29.8q0 1.35-1 2.375T38.9 42.3Z"/></svg>
--- a/src/img/logo_graph_vide_light.svg
+++ b/src/img/logo_graph_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M15.75 34.15q.65 0 1.075-.425.425-.425.425-1.075V21.9q0-.65-.425-1.075-.425-.425-1.075-.425-.65 0-1.075.425-.425.425-.425 1.075v10.75q0 .65.45 1.075.45.425 1.05.425Zm8.25 0q.65 0 1.075-.425.425-.425.425-1.075v-17.3q0-.65-.425-1.075-.425-.425-1.075-.425-.65 0-1.075.425-.425.425-.425 1.075v17.3q0 .65.425 1.075.425.425 1.075.425Zm8.25 0q.65 0 1.075-.425.425-.425.425-1.075v-4.4q0-.65-.45-1.075-.45-.425-1.05-.425-.65 0-1.075.425-.425.425-.425 1.075v4.4q0 .65.425 1.075.425.425 1.075.425ZM9.1 42.3q-1.35 0-2.375-1.025T5.7 38.9V9.1q0-1.4 1.025-2.4t2.375-1h29.8q1.4 0 2.4 1t1 2.4v29.8q0 1.35-1 2.375T38.9 42.3Zm0-3.4h29.8V9.1H9.1v29.8Zm0 0V9.1v29.8Z"/></svg>
--- a/src/img/logo_group_light.svg
+++ b/src/img/logo_group_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M1.55 36.15q-.7 0-1.2-.5t-.5-1.2v-1.1q0-2.05 2.1-3.275T7.5 28.85q.5 0 1.025.025.525.025.975.075-.4.9-.6 1.85-.2.95-.2 2v3.35Zm12 0q-.7 0-1.2-.5t-.5-1.2V32.8q0-3.3 3.35-5.375T24 25.35q5.45 0 8.8 2.075 3.35 2.075 3.35 5.375v1.65q0 .7-.5 1.2t-1.2.5Zm25.75 0V32.8q0-1.05-.2-2t-.6-1.85q.45-.05.975-.075.525-.025 1.025-.025 3.4 0 5.525 1.225Q48.15 31.3 48.15 33.35v1.1q0 .7-.5 1.2t-1.2.5ZM7.5 27.4q-1.5 0-2.55-1.05Q3.9 25.3 3.9 23.8q0-1.5 1.05-2.55Q6 20.2 7.5 20.2q1.5 0 2.55 1.05 1.05 1.05 1.05 2.55 0 1.5-1.05 2.55Q9 27.4 7.5 27.4Zm33 0q-1.5 0-2.55-1.05-1.05-1.05-1.05-2.55 0-1.5 1.05-2.55Q39 20.2 40.5 20.2q1.5 0 2.55 1.05 1.05 1.05 1.05 2.55 0 1.5-1.05 2.55Q42 27.4 40.5 27.4ZM24 23.85q-2.55 0-4.35-1.775-1.8-1.775-1.8-4.375 0-2.55 1.8-4.325Q21.45 11.6 24 11.6t4.35 1.775q1.8 1.775 1.8 4.325 0 2.6-1.8 4.375T24 23.85Z"/></svg>
--- a/src/img/logo_group_vide_light.svg
+++ b/src/img/logo_group_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M1.55 36.15q-.7 0-1.2-.5t-.5-1.2v-1.1q0-2.05 2.1-3.275T7.5 28.85q.5 0 1.025.025.525.025.975.075-.4.9-.6 1.85-.2.95-.2 2v3.35Zm12 0q-.7 0-1.2-.5t-.5-1.2V32.8q0-3.3 3.35-5.375T24 25.35q5.45 0 8.8 2.075 3.35 2.075 3.35 5.375v1.65q0 .7-.5 1.2t-1.2.5Zm25.75 0V32.8q0-1.05-.2-2t-.6-1.85q.45-.05.975-.075.525-.025 1.025-.025 3.4 0 5.525 1.225Q48.15 31.3 48.15 33.35v1.1q0 .7-.5 1.2t-1.2.5ZM24 28.6q-3.85 0-6.25 1.15t-2.5 2.95v.2h17.5v-.25q-.1-1.75-2.5-2.9T24 28.6ZM7.5 27.4q-1.5 0-2.55-1.05Q3.9 25.3 3.9 23.8q0-1.5 1.05-2.55Q6 20.2 7.5 20.2q1.5 0 2.55 1.05 1.05 1.05 1.05 2.55 0 1.5-1.05 2.55Q9 27.4 7.5 27.4Zm33 0q-1.5 0-2.55-1.05-1.05-1.05-1.05-2.55 0-1.5 1.05-2.55Q39 20.2 40.5 20.2q1.5 0 2.55 1.05 1.05 1.05 1.05 2.55 0 1.5-1.05 2.55Q42 27.4 40.5 27.4ZM24 23.85q-2.55 0-4.35-1.775-1.8-1.775-1.8-4.375 0-2.55 1.8-4.325Q21.45 11.6 24 11.6t4.35 1.775q1.8 1.775 1.8 4.325 0 2.6-1.8 4.375T24 23.85Zm0-9.05q-1.25 0-2.075.85-.825.85-.825 2.05 0 1.25.825 2.1.825.85 2.075.85 1.25 0 2.075-.85.825-.85.825-2.1 0-1.2-.825-2.05-.825-.85-2.075-.85Zm0 18.1Zm0-15.2Z"/></svg>
--- a/src/img/logo_parametre_light.svg
+++ b/src/img/logo_parametre_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M27.35 44.3h-6.7q-.65 0-1.15-.4-.5-.4-.6-1.05l-.8-4.95q-.85-.3-1.85-.875T14.5 35.85l-4.55 2.1q-.6.3-1.25.1-.65-.2-.95-.8l-3.4-6.05q-.35-.55-.175-1.175T4.85 29l4.25-3.1q-.1-.4-.125-.95-.025-.55-.025-.95 0-.4.025-.95.025-.55.125-.95L4.85 19q-.5-.4-.675-1.025Q4 17.35 4.35 16.8l3.4-6.05q.35-.6.975-.8.625-.2 1.225.1l4.6 2.1q.7-.6 1.7-1.15 1-.55 1.85-.85l.8-5.05q.1-.6.6-1t1.15-.4h6.7q.65 0 1.15.4.5.4.6 1l.8 5q.85.35 1.875.875T33.5 12.15l4.55-2.1q.6-.3 1.25-.1.65.2.95.8l3.4 6q.35.55.2 1.2-.15.65-.7 1.05l-4.25 3q.1.45.125 1 .025.55.025 1 0 .45-.025.975-.025.525-.125.975L43.15 29q.5.4.675 1.025.175.625-.175 1.175l-3.4 6.05q-.35.6-.975.8-.625.2-1.225-.1l-4.6-2.1q-.7.6-1.675 1.2-.975.6-1.875.85l-.8 4.95q-.1.65-.6 1.05t-1.15.4ZM24 30.5q2.7 0 4.6-1.9 1.9-1.9 1.9-4.6 0-2.7-1.9-4.6-1.9-1.9-4.6-1.9-2.7 0-4.6 1.9-1.9 1.9-1.9 4.6 0 2.7 1.9 4.6 1.9 1.9 4.6 1.9Z"/></svg>
--- a/src/img/logo_parametre_vide_light.svg
+++ b/src/img/logo_parametre_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M27.35 44.3h-6.7q-.65 0-1.15-.4-.5-.4-.6-1.05l-.8-4.95q-.85-.3-1.85-.875T14.5 35.85l-4.55 2.1q-.6.3-1.25.1-.65-.2-.95-.8l-3.4-6.05q-.35-.55-.175-1.175T4.85 29l4.25-3.1q-.1-.4-.125-.95-.025-.55-.025-.95 0-.4.025-.95.025-.55.125-.95L4.85 19q-.5-.4-.675-1.025Q4 17.35 4.35 16.8l3.4-6.05q.35-.6.975-.8.625-.2 1.225.1l4.6 2.1q.7-.6 1.7-1.15 1-.55 1.85-.85l.8-5.05q.1-.6.6-1t1.15-.4h6.7q.65 0 1.15.4.5.4.6 1l.8 5q.85.35 1.875.875T33.5 12.15l4.55-2.1q.6-.3 1.25-.1.65.2.95.8l3.4 6q.35.55.2 1.2-.15.65-.7 1.05l-4.25 3q.1.45.125 1 .025.55.025 1 0 .45-.025.975-.025.525-.125.975L43.15 29q.5.4.675 1.025.175.625-.175 1.175l-3.4 6.05q-.35.6-.975.8-.625.2-1.225-.1l-4.6-2.1q-.7.6-1.675 1.2-.975.6-1.875.85l-.8 4.95q-.1.65-.6 1.05t-1.15.4ZM24 30.5q2.7 0 4.6-1.9 1.9-1.9 1.9-4.6 0-2.7-1.9-4.6-1.9-1.9-4.6-1.9-2.7 0-4.6 1.9-1.9 1.9-1.9 4.6 0 2.7 1.9 4.6 1.9 1.9 4.6 1.9Zm0-3q-1.5 0-2.5-1.025T20.5 24q0-1.45 1-2.475 1-1.025 2.5-1.025 1.45 0 2.475 1.025Q27.5 22.55 27.5 24q0 1.45-1.025 2.475Q25.45 27.5 24 27.5Zm0-3.5Zm-2.1 16.9h4.2l.7-5.6q1.65-.4 3.15-1.25t2.7-2.1l5.3 2.3 1.9-3.45-4.7-3.4q.2-.85.35-1.7.15-.85.15-1.7t-.125-1.7q-.125-.85-.375-1.7l4.7-3.4-1.9-3.45-5.3 2.3q-1.15-1.35-2.625-2.25-1.475-.9-3.225-1.1l-.7-5.6h-4.2l-.7 5.6q-1.7.3-3.2 1.175-1.5.875-2.7 2.175l-5.25-2.3-1.9 3.45 4.65 3.4q-.2.85-.325 1.7T12.35 24q0 .85.125 1.7t.325 1.7l-4.65 3.4 1.9 3.45 5.25-2.3q1.25 1.25 2.75 2.1 1.5.85 3.15 1.25Z"/></svg>
--- a/src/img/logo_personEntouré_light.svg
+++ b/src/img/logo_personEntouré_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M11.15 35.1q3.15-1.95 6.2-2.975Q20.4 31.1 24 31.1q3.6 0 6.7 1.025t6.2 2.975q2.2-2.7 3.1-5.4.9-2.7.9-5.7 0-7.2-4.85-12.05Q31.2 7.1 24 7.1q-7.2 0-12.05 4.85Q7.1 16.8 7.1 24q0 3 .925 5.7t3.125 5.4ZM24 25.6q-2.95 0-4.925-2-1.975-2-1.975-4.95 0-2.9 2-4.9 2-2 4.9-2 2.95 0 4.925 2 1.975 2 1.975 4.95 0 2.9-2 4.9-2 2-4.9 2Zm0 18.7q-4.25 0-7.95-1.6T9.6 38.325q-2.75-2.775-4.325-6.45Q3.7 28.2 3.7 24q0-4.25 1.6-7.925T9.675 9.65q2.775-2.75 6.45-4.35Q19.8 3.7 24.05 3.7q4.2 0 7.875 1.6t6.425 4.35q2.75 2.75 4.35 6.45 1.6 3.7 1.6 7.9t-1.6 7.875q-1.6 3.675-4.35 6.45Q35.6 41.1 31.9 42.7T24 44.3Z"/></svg>
--- a/src/img/logo_person_light.svg
+++ b/src/img/logo_person_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 23.8q-3.4 0-5.525-2.125-2.125-2.125-2.125-5.525 0-3.4 2.125-5.55T24 8.45q3.4 0 5.55 2.15t2.15 5.55q0 3.4-2.15 5.525Q27.4 23.8 24 23.8ZM11.2 40.15q-1.35 0-2.3-.975-.95-.975-.95-2.325v-1.6q0-1.95.975-3.35.975-1.4 2.525-2.1 3.35-1.5 6.4-2.25 3.05-.75 6.15-.75 3.1 0 6.125.775T36.5 29.8q1.6.7 2.6 2.1 1 1.4 1 3.35v1.6q0 1.35-.95 2.325-.95.975-2.35.975Z"/></svg>
--- a/src/img/logo_person_vide_light.svg
+++ b/src/img/logo_person_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 23.8q-3.45 0-5.625-2.175T16.2 16q0-3.45 2.175-5.625T24 8.2q3.45 0 5.625 2.175T31.8 16q0 3.45-2.175 5.625T24 23.8Zm12.9 16.65H11.1q-1.4 0-2.4-1t-1-2.4v-1.6q0-2 1-3.425 1-1.425 2.55-2.175 3.4-1.5 6.5-2.25t6.25-.75q3.15 0 6.225.775Q33.3 28.4 36.7 29.9q1.6.7 2.6 2.125t1 3.425v1.6q0 1.4-1 2.4t-2.4 1Zm-25.8-3.4h25.8V35.5q0-.8-.475-1.525-.475-.725-1.175-1.075-3.15-1.5-5.775-2.075Q26.85 30.25 24 30.25q-2.85 0-5.525.575Q15.8 31.4 12.7 32.9q-.7.35-1.15 1.075-.45.725-.45 1.525ZM24 20.4q1.9 0 3.15-1.25T28.4 16q0-1.9-1.25-3.15T24 11.6q-1.9 0-3.15 1.25T19.6 16q0 1.9 1.25 3.15T24 20.4Zm0-4.4Zm0 21.05Z"/></svg>
--- a/src/img/logo_speed_light.svg
+++ b/src/img/logo_speed_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M21.05 31q1.2 1.2 3.1 1.175 1.9-.025 2.8-1.375L36 17.3q.4-.65-.075-1.1-.475-.45-1.075-.05l-13.5 9.05q-1.35.9-1.425 2.75Q19.85 29.8 21.05 31Zm-11.3 9.3q-.95 0-1.85-.475Q7 39.35 6.6 38.5q-1.35-2.4-2.05-4.925-.7-2.525-.7-5.375 0-4.2 1.6-7.925 1.6-3.725 4.325-6.5t6.425-4.4q3.7-1.625 7.85-1.625 4.15 0 7.825 1.625t6.4 4.4Q41 16.55 42.6 20.275t1.6 7.925q0 2.85-.65 5.425Q42.9 36.2 41.5 38.5q-.65 1.25-1.375 1.525-.725.275-1.825.275Z"/></svg>
--- a/src/img/logo_speed_vide_light.svg
+++ b/src/img/logo_speed_vide_light.svg
@ -0,0 +1 @@
+<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M20.45 31.75q1.15 1.15 3.325 1.075 2.175-.075 3.175-1.625l9-13.95q.4-.65-.075-1.1-.475-.45-1.075-.05L21 25.2q-1.5 1-1.6 3.2-.1 2.2 1.05 3.35ZM9.7 40.3q-.95 0-1.85-.475-.9-.475-1.3-1.325-1.35-2.4-2.05-4.925-.7-2.525-.7-5.375 0-4.2 1.6-7.925 1.6-3.725 4.325-6.5t6.425-4.4Q19.85 7.75 24 7.75q2.25 0 4.7.575t4.85 1.875q1.1.6 1.225 1.475.125.875-.525 1.475-.45.35-1.025.425-.575.075-1.125-.175-2.05-1.15-4.25-1.7T24 11.15q-6.95 0-11.875 4.975T7.2 28.2q0 2.25.625 4.5t1.725 4.2H38.4q1.1-1.8 1.725-4.15.625-2.35.625-4.65 0-1.8-.45-3.85t-1.55-3.95q-.35-.55-.225-1.15.125-.6.575-1 .65-.5 1.4-.35.75.15 1.15.9 1.2 2.3 1.825 4.55t.675 4.55q.05 3-.625 5.7t-2.075 5q-.65 1.25-1.375 1.525-.725.275-1.825.275ZM24 24Z"/></svg>
--- a/src/index.js
+++ b/src/index.js
@ -1,5 +1,5 @@
 import React from 'react';
-import ReactDOM from 'react-dom/client';
+import ReactDOM from 'react-dom';
 import App from './App';
 import "./styles/index.scss";

--- a/src/pages/Repertoire.js
+++ b/src/pages/Repertoire.js
@ -1,9 +1,40 @@
-import React from 'react';
 import NavigationDashboard from '../components/NavigationDashboard';
+import React, { useState, useEffect } from 'react';
+import { BrowserRouter as Router, Switch, Route, Routes } from 'react-router-dom';
+import { v4 as uuid } from 'uuid';
+import Header from '../components/Contact/Header';
+import AddContact from '../components/Contact/AddContact'
+import ContactList from '../components/Contact/ContactList';
+import ContactDetail from '../components/Contact/ContactDetail';
+import EditContact from '../components/Contact/EditContact';
+import axios from 'axios';
+import user from '../images/user.jpg';
+import { Link, useLocation } from 'react-router-dom';

+import { TableContainer, Table, TableHead, TableBody, TableRow, TableCell } from '@mui/material';
+import { Paper } from '@mui/material';
+
+
+
+const api = axios.create({
+    baseURL: 'http://localhost:8080'
+})
+
+function Repertoire() {
+
+    const [contacts, setContacts] = useState([]);
+    const [SearchTerm, setSearchTerm] = useState("");
+    const [SearchResults, setSearchResults] = useState([]);
+
+    useEffect(() => {
+        api.get('/Contact/All').then((response) => {
+            setContacts(response.data);
+            setSearchTerm(response.data[0].idcontact);
+        });
+    }, []);

-const Repertoire = () => {
    return (
+
        <body>

            <link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
@ -25,6 +56,45 @@ const Repertoire = () => {
                <div className="bas_de_page">
                    <NavigationDashboard />
                    <div className="Repertoire">
+                        <div className="Titre_Formulaire_Rech">
+                            <p className="Titre">Repertoire</p>
+                            <p className="Sous-titre">Liste des utilisateurs</p>
+                            <div className="rechLogo">
+                                <div className="input_box">
+                                    <input type="search" placeholder="Rechercher..." />
+                                    <span className="search">
+                                        <i class="uil uil-search search-icon"></i>
+                                    </span>
+                                </div>
+                                <TableContainer component={Paper} sx={{ maxHeight: 0.8 }}>
+                                    <Table aria-label="simple table" size="small" stickyHeader>
+                                        <TableHead >
+                                            <TableRow>
+                                                <TableCell sx={{ bgcolor: 'info.main' }} align="left">Nom</TableCell>
+                                                <TableCell sx={{ bgcolor: 'info.main' }} align="center">Prénom</TableCell>
+                                                <TableCell sx={{ bgcolor: 'info.main' }} align="center">Identifiant</TableCell>
+                                                <TableCell sx={{ bgcolor: 'info.main' }} align="center">Téléphone</TableCell>
+                                            </TableRow>
+                                        </TableHead>
+                                        <TableBody >
+                                            {contacts.map((contact) => (
+                                                <TableRow
+                                                    key={contact.idcontact}
+                                                    hover
+                                                    // onClick={(event) => handleClick(event, contact.idcontact)}
+                                                    // selected={contact.idcontact === selectedIdcontact}
+                                                >
+                                                    <TableCell align="left">{contact.lastname}</TableCell>
+                                                    <TableCell align="center">{contact.firstname}</TableCell>
+                                                    <TableCell align="center">{contact.phone}</TableCell>
+                                                    <TableCell align="center">{contact.mail}</TableCell>
+                                                </TableRow>
+                                            ))}
+                                        </TableBody>
+                                    </Table>
+                                </TableContainer>
+                            </div>
+                        </div>
                    </div>
                </div>
            </div>
@ -32,4 +102,91 @@ const Repertoire = () => {
    );
 };

+// function Repertoire() {
+
+//     // NOW WITH THE USE OF HOOKS WE WILL GET THE CONTACTS
+//     const LOCAL_STORAGE_KEY = "contacts"
+//     const [contacts, setContacts] = useState([]);
+//     const [SearchTerm, setSearchTerm] = useState("");
+//     const [SearchResults, setSearchResults] = useState([]);
+
+//     const addContactHandler = async (contact) => {
+//         const request = {
+//             id: uuid(),
+//             ...contact
+//         }
+//         const response = await api.post("/contacts", request)
+//         setContacts([...contacts, response.data]);
+//     }
+
+//     // UPDATE CONTACT
+//     const updateContactHandler = async (contact) => {
+//         const response = await api.put(`/contacts/${contact.id}`, contact);
+//         const { id, name, email } = response.data;
+//         setContacts(contacts.map(contact => {
+//             return contact.id === id ? { ...response.data } : contact;
+//         }))
+//     }
+
+//     // FOR DELETING THE ITEMS
+//     const removeContactHandler = async (id) => {
+//         await api.delete(`/contacts/${id}`);
+//         const newContactList = contacts.filter((contact) => {
+//             return contact.id !== id;
+//         });
+//         setContacts(newContactList);
+//     }
+
+//     // SEARCHING THE CONTACTS
+//     const searchHandler = (searchTerm) => {
+//         setSearchTerm(searchTerm);
+//         if (searchTerm !== "") {
+//             const newContactList = contacts.filter((contact) => {
+//                 return Object.values(contact).join(" ").toLowerCase().includes(searchTerm.toLowerCase());
+//             });
+//             setSearchResults(newContactList);
+//         } else {
+//             setSearchResults(contacts);
+//         }
+//     }
+
+//     useEffect(() => {
+//         const retrieveContacts = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY));
+//         if (retrieveContacts) setContacts(retrieveContacts);
+//     }
+//         , []);
+
+//     useEffect(() => {
+//         localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(contacts));
+//     }
+//         , [contacts]);
+
+//     return (
+//         <div className="ui container">
+//             <Router>
+//                 <Header />
+//                 <Routes>
+//                     <Route path="/Repertoire/"
+//                         element={<ContactList contacts={SearchTerm.length < 1 ? contacts : SearchResults} getContactId={removeContactHandler} term={SearchTerm} searchKeyword={searchHandler} />}
+//                     render={(props)=><ContactList contacts={contacts} getContactId={removeContactHandler} {...props} />}
+//                     />
+//                     <Route path="/Repertoire/add"
+//                         element={<AddContact addContactHandler={addContactHandler} />}
+//                     //render={(props)=><AddContact {...props} addContactHandler={addContactHandler}/>}
+//                     />
+//                     <Route path="Repertoire/edit"
+//                         element={<EditContact updateContactHandler={updateContactHandler} />}
+//                     />
+//                     <Route path="/Repertoire/contact/:id" element={<ContactDetail />} />
+//                 </Routes>
+//                 {/* <AddContact addContactHandler={addContactHandler}/> */}
+//                 {/*Here in contact list props are used to get the values in the above contact array*/}
+//                 {/* <ContactList contacts={contacts} getContactId={removeContactHandler}/> */}
+//             </Router>
+//         </div>
+//     )
+
+
+// };
+
 export default Repertoire;
--- a/src/styles/components/_analyse.scss
+++ b/src/styles/components/_analyse.scss
@ -110,16 +110,16 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -127,8 +127,9 @@ body {
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -137,7 +138,7 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
--- a/src/styles/components/_calendrier.scss
+++ b/src/styles/components/_calendrier.scss
@ -110,16 +110,16 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -127,8 +127,9 @@ body {
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -137,7 +138,7 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
--- a/src/styles/components/_compte.scss
+++ b/src/styles/components/_compte.scss
@ -110,16 +110,16 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -127,8 +127,9 @@ body {
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -137,7 +138,7 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
--- a/src/styles/components/_dashboard.scss
+++ b/src/styles/components/_dashboard.scss
@ -110,16 +110,16 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -127,8 +127,9 @@ body {
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -137,7 +138,7 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
--- a/src/styles/components/_parametre.scss
+++ b/src/styles/components/_parametre.scss
@ -112,16 +112,16 @@
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -129,8 +129,9 @@
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -139,7 +140,7 @@
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
@ -443,6 +444,43 @@
                backdrop-filter: blur(3px);
                -webkit-backdrop-filter: blur(15px);

+                .parti_one {
+                    display: flex;
+                    flex-direction: row;
+                    justify-content: space-around;
+                    align-items: center;
+                    width: 100%;
+                    height: 18%;
+                }
+
+                .parti_two {
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: space-around;
+                    align-items: center;
+                    width: 100%;
+                    height: 35%;
+                }
+
+                .parti_three {
+                    display: flex;
+                    flex-direction: row;
+                    justify-content: space-around;
+                    align-items: center;
+                    margin-top: 15px;
+                    width: 100%;
+                    height: 18%;
+                }
+
+                .parti_four {
+                    display: flex;
+                    flex-direction: row;
+                    justify-content: space-around;
+                    align-items: center;
+                    width: 100%;
+                    height: 18%;
+                }
+
                .button {
                    display: flex;
                    object-fit: cover;
--- a/src/styles/components/_repertoire.scss
+++ b/src/styles/components/_repertoire.scss
@ -93,7 +93,7 @@ body {
            .nav_bar_verticale {
                display: flex;
                flex-direction: column;
-                justify-content: space-around;
+                justify-content: space-evenly;
                align-items: center;
                width: 5%;
                margin: 5px 5px 10px 10px;
@ -110,16 +110,16 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_two {
                    display: flex;
                    flex-direction: column;
-                    justify-content: space-between;
+                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 30%;
+                    height: 35%;
                }

                .parti_three {
@ -127,8 +127,9 @@ body {
                    flex-direction: row;
                    justify-content: space-around;
                    align-items: center;
+                    margin-top: 15px;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .parti_four {
@ -137,7 +138,7 @@ body {
                    justify-content: space-around;
                    align-items: center;
                    width: 100%;
-                    height: 20%;
+                    height: 18%;
                }

                .button {
				`@ -0,0 +1 @@`
				<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 28.05q-.9 0-1.475-.575Q21.95 26.9 21.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 0q-.9 0-1.475-.575Q13.95 26.9 13.95 26q0-.9.575-1.475.575-.575 1.475-.575.9 0 1.475.575.575.575.575 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm16 0q-.85 0-1.45-.575T29.95 26q0-.9.6-1.475.6-.575 1.45-.575t1.45.575q.6.575.6 1.475 0 .9-.575 1.475-.575.575-1.475.575Zm-8 8q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm-8 0q-.9 0-1.475-.6-.575-.6-.575-1.45t.575-1.45q.575-.6 1.475-.6.9 0 1.475.575.575.575.575 1.475 0 .85-.575 1.45t-1.475.6Zm16 0q-.85 0-1.45-.6t-.6-1.45q0-.85.6-1.45t1.45-.6q.85 0 1.45.575t.6 1.475q0 .85-.575 1.45t-1.475.6ZM9.1 44.3q-1.35 0-2.375-1.025T5.7 40.9V10.1q0-1.4 1.025-2.4t2.375-1h3.15V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h16.6V5.4q0-.7.5-1.2t1.2-.5q.75 0 1.25.5t.5 1.2v1.3h3.15q1.4 0 2.4 1t1 2.4v30.8q0 1.35-1 2.375T38.9 44.3Zm0-3.4h29.8V19.5H9.1v21.4Z"/></svg>
				`@ -0,0 +1 @@`
				`<svg fill="#e8eef2ff" xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M24 23.8q-3.4 0-5.525-2.125-2.125-2.125-2.125-5.525 0-3.4 2.125-5.55T24 8.45q3.4 0 5.55 2.15t2.15 5.55q0 3.4-2.15 5.525Q27.4 23.8 24 23.8ZM11.2 40.15q-1.35 0-2.3-.975-.95-.975-.95-2.325v-1.6q0-1.95.975-3.35.975-1.4 2.525-2.1 3.35-1.5 6.4-2.25 3.05-.75 6.15-.75 3.1 0 6.125.775T36.5 29.8q1.6.7 2.6 2.1 1 1.4 1 3.35v1.6q0 1.35-.95 2.325-.95.975-2.35.975Z"/></svg>`