From eaf7366ede494a14c0ff3237f252a67e3c0c3cf7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marius=20B=C3=B8lset=20Gisleberg?= <108019395+Gissebass@users.noreply.github.com> Date: Thu, 18 Jan 2024 19:21:49 +0100 Subject: [PATCH 1/3] Feature/fg 87 (#789) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fått enkel innlogging til å funke * fått create user til å funke ish * fixed login in header * unstable finished * change api endpoint fro 8080 to 8000 * kommentert ut litt kode som skal brukes senere. * updated browser-list-db because azure static check asked me to do so * added linebreak to run azure static web apps i github --- package-lock.json | 489 ++++++++++++++++++- package.json | 5 + src/AppRoutes.tsx | 21 +- src/azureconfig.ts | 27 + src/components/Header/Header.tsx | 44 +- src/gui-components/GuiCarousel/index.tsx | 4 +- src/gui-components/GuiCarouselItem/index.tsx | 4 +- src/index.tsx | 95 ++-- src/utils/api/api.tsx | 2 +- src/views/Intern/LoggInn/LoggInn.tsx | 19 - src/views/Login/AzureLogin.tsx | 184 +++++++ tsconfig.json | 10 +- 12 files changed, 798 insertions(+), 106 deletions(-) create mode 100644 src/azureconfig.ts delete mode 100644 src/views/Intern/LoggInn/LoggInn.tsx create mode 100644 src/views/Login/AzureLogin.tsx diff --git a/package-lock.json b/package-lock.json index 4a4efebf..b849e92a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,9 +9,14 @@ "version": "0.1.0", "dependencies": { "@auth0/auth0-react": "^1.11.0", + "@azure/msal-browser": "^3.6.0", + "@azure/msal-react": "^2.0.8", "@date-io/date-fns": "^1.3.13", "@emotion/react": "^11.10.4", "@emotion/styled": "^11.10.4", + "@microsoft/mgt-element": "^3.1.3", + "@microsoft/mgt-msal2-provider": "^3.1.3", + "@microsoft/mgt-react": "^3.1.3", "@mui/icons-material": "^5.10.6", "@mui/lab": "^5.0.0-alpha.102", "@mui/material": "^5.14.7", @@ -111,6 +116,37 @@ "unfetch": "^4.2.0" } }, + "node_modules/@azure/msal-browser": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@azure/msal-browser/-/msal-browser-3.6.0.tgz", + "integrity": "sha512-FrFBJXRJMyWXjAjg4cUNZwEKktzfzD/YD9+S1kj2ors67hKoveam4aL0bZuCZU/jTiHTn0xDQGQh2ksCMXTXtA==", + "dependencies": { + "@azure/msal-common": "14.5.0" + }, + "engines": { + "node": ">=0.8.0" + } + }, + "node_modules/@azure/msal-common": { + "version": "14.5.0", + "resolved": "https://registry.npmjs.org/@azure/msal-common/-/msal-common-14.5.0.tgz", + "integrity": "sha512-Gx5rZbiZV/HiZ2nEKfjfAF/qDdZ4/QWxMvMo2jhIFVz528dVKtaZyFAOtsX2Ak8+TQvRsGCaEfuwJFuXB6tu1A==", + "engines": { + "node": ">=0.8.0" + } + }, + "node_modules/@azure/msal-react": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/@azure/msal-react/-/msal-react-2.0.8.tgz", + "integrity": "sha512-Kmbq2Mm6vrXfemxf8+q1PWU7dhx8Ck4lB6gXFFDR+Bn1odoLzxksOqm8CKEk+y9Bq1iR54H0raTQ3Avan43oMw==", + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@azure/msal-browser": "^3.6.0", + "react": "^16.8.0 || ^17 || ^18" + } + }, "node_modules/@babel/code-frame": { "version": "7.18.6", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz", @@ -2695,6 +2731,18 @@ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.1.tgz", "integrity": "sha512-m0G6wlnhm/AX0H12IOWtK8gASEMffnX08RtKkCgTdHb9JpHKGloI7icFfLg9ZmQeavcvR0PKmzxClyuFPSjKWw==" }, + "node_modules/@fluentui/web-components": { + "version": "2.5.16", + "resolved": "https://registry.npmjs.org/@fluentui/web-components/-/web-components-2.5.16.tgz", + "integrity": "sha512-Ur+DziCm2FtvQoRjx62DH069uTz/HTq0gk9uKmW8K7bmxCS7fYYpV9GFEnK7QdEbdRHyUINE3uFfLEcL6IY3Xg==", + "dependencies": { + "@microsoft/fast-colors": "^5.3.0", + "@microsoft/fast-element": "^1.11.1", + "@microsoft/fast-foundation": "^2.48.1", + "@microsoft/fast-web-utilities": "^5.4.0", + "tslib": "^2.1.0" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.10.4", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.10.4.tgz", @@ -3562,6 +3610,163 @@ "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==", "dev": true }, + "node_modules/@lit-labs/ssr-dom-shim": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@lit-labs/ssr-dom-shim/-/ssr-dom-shim-1.1.2.tgz", + "integrity": "sha512-jnOD+/+dSrfTWYfSXBXlo5l5f0q1UuJo3tkbMDCYA2lKUYq79jaxqtGEvnRoh049nt1vdo1+45RinipU6FGY2g==" + }, + "node_modules/@lit/reactive-element": { + "version": "1.6.3", + "resolved": "https://registry.npmjs.org/@lit/reactive-element/-/reactive-element-1.6.3.tgz", + "integrity": "sha512-QuTgnG52Poic7uM1AN5yJ09QMe0O28e10XzSvWDz02TJiiKee4stsiownEIadWm8nYzyDAyT+gKzUoZmiWQtsQ==", + "dependencies": { + "@lit-labs/ssr-dom-shim": "^1.0.0" + } + }, + "node_modules/@microsoft/fast-colors": { + "version": "5.3.1", + "resolved": "https://registry.npmjs.org/@microsoft/fast-colors/-/fast-colors-5.3.1.tgz", + "integrity": "sha512-72RZXVfCbwQzvo5sXXkuLXLT7rMeYaSf5r/6ewQiv/trBtqpWRm4DEH2EilHw/iWTBKOXs1qZNQndgUMa5n4LA==" + }, + "node_modules/@microsoft/fast-element": { + "version": "1.12.0", + "resolved": "https://registry.npmjs.org/@microsoft/fast-element/-/fast-element-1.12.0.tgz", + "integrity": "sha512-gQutuDHPKNxUEcQ4pypZT4Wmrbapus+P9s3bR/SEOLsMbNqNoXigGImITygI5zhb+aA5rzflM6O8YWkmRbGkPA==" + }, + "node_modules/@microsoft/fast-foundation": { + "version": "2.49.4", + "resolved": "https://registry.npmjs.org/@microsoft/fast-foundation/-/fast-foundation-2.49.4.tgz", + "integrity": "sha512-5I2tSPo6bnOfVAIX7XzX+LhilahwvD7h+yzl3jW0t5IYmMX9Lci9VUVyx5f8hHdb1O9a8Y9Atb7Asw7yFO/u+w==", + "dependencies": { + "@microsoft/fast-element": "^1.12.0", + "@microsoft/fast-web-utilities": "^5.4.1", + "tabbable": "^5.2.0", + "tslib": "^1.13.0" + } + }, + "node_modules/@microsoft/fast-foundation/node_modules/tslib": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", + "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==" + }, + "node_modules/@microsoft/fast-web-utilities": { + "version": "5.4.1", + "resolved": "https://registry.npmjs.org/@microsoft/fast-web-utilities/-/fast-web-utilities-5.4.1.tgz", + "integrity": "sha512-ReWYncndjV3c8D8iq9tp7NcFNc1vbVHvcBFPME2nNFKNbS1XCesYZGlIlf3ot5EmuOXPlrzUHOWzQ2vFpIkqDg==", + "dependencies": { + "exenv-es6": "^1.1.1" + } + }, + "node_modules/@microsoft/mgt-components": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-components/-/mgt-components-3.1.3.tgz", + "integrity": "sha512-EwMBOhKGp3uF4BZyLmphDBumvy/gSx+10b2hO3LIZW78Ct2yA1aXcKWru2XNteWZf2U9fzvzdxiIEzhxvIBtHw==", + "dependencies": { + "@fluentui/web-components": "^2.5.12", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-client": "3.0.2", + "@microsoft/microsoft-graph-types": "^2.0.0", + "@microsoft/microsoft-graph-types-beta": "^0.29.0-preview", + "office-ui-fabric-core": "^11.0.0" + } + }, + "node_modules/@microsoft/mgt-element": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-element/-/mgt-element-3.1.3.tgz", + "integrity": "sha512-Wvt/PO83MJrcV8Z/Tx0pnCeDB3yulHr5xCrxN47v1KLr7vXj8BFqK73g7PMSOJ0ptDvYB1GEoyYVPACrPPZR0Q==", + "dependencies": { + "@microsoft/microsoft-graph-client": "3.0.2", + "idb": "6.0.0", + "lit": "^2.3.1" + } + }, + "node_modules/@microsoft/mgt-element/node_modules/idb": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/idb/-/idb-6.0.0.tgz", + "integrity": "sha512-+M367poGtpzAylX4pwcrZIa7cFQLfNkAOlMMLN2kw/2jGfJP6h+TB/unQNSVYwNtP8XqkLYrfuiVnxLQNP1tjA==" + }, + "node_modules/@microsoft/mgt-msal2-provider": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-msal2-provider/-/mgt-msal2-provider-3.1.3.tgz", + "integrity": "sha512-CrZ38M+PKdfwWzOol5FZwvaMx5RKNvw8KW9DCyGyIYEnOQaT8i+rRkL54ivfLWbk/ZinlOodt1L/CgEZtaLcJQ==", + "dependencies": { + "@azure/msal-browser": "^2.22.0", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-client": "3.0.2" + } + }, + "node_modules/@microsoft/mgt-msal2-provider/node_modules/@azure/msal-browser": { + "version": "2.38.3", + "resolved": "https://registry.npmjs.org/@azure/msal-browser/-/msal-browser-2.38.3.tgz", + "integrity": "sha512-2WuLFnWWPR1IdvhhysT18cBbkXx1z0YIchVss5AwVA95g7CU5CpT3d+5BcgVGNXDXbUU7/5p0xYHV99V5z8C/A==", + "deprecated": "A newer major version of this library is available. Please upgrade to the latest available version.", + "dependencies": { + "@azure/msal-common": "13.3.1" + }, + "engines": { + "node": ">=0.8.0" + } + }, + "node_modules/@microsoft/mgt-msal2-provider/node_modules/@azure/msal-common": { + "version": "13.3.1", + "resolved": "https://registry.npmjs.org/@azure/msal-common/-/msal-common-13.3.1.tgz", + "integrity": "sha512-Lrk1ozoAtaP/cp53May3v6HtcFSVxdFrg2Pa/1xu5oIvsIwhxW6zSPibKefCOVgd5osgykMi5jjcZHv8XkzZEQ==", + "engines": { + "node": ">=0.8.0" + } + }, + "node_modules/@microsoft/mgt-react": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-react/-/mgt-react-3.1.3.tgz", + "integrity": "sha512-k6AuX0SzFkmRpFPzqsFb4f2KG+BIGCQ51VtuezupzBZk+aHYBQxSS2Unajkfs8boyYW3OLnhKbRQAnkoD1pJuA==", + "dependencies": { + "@microsoft/mgt-components": "3.1.3", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-types": "^2.0.0", + "@microsoft/microsoft-graph-types-beta": "^0.29.0-preview", + "wc-react": "^0.5.0" + }, + "peerDependencies": { + "react": "^17.0.1 || ^18.0.0", + "react-dom": "^17.0.1 || ^18.0.0" + } + }, + "node_modules/@microsoft/microsoft-graph-client": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-client/-/microsoft-graph-client-3.0.2.tgz", + "integrity": "sha512-eYDiApYmiGsm1s1jfAa/rhB2xQCsX4pWt0vCTd1LZmiApMQfT/c0hXj2hvpuGz5GrcLdugbu05xB79rIV57Pjw==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "tslib": "^2.2.0" + }, + "engines": { + "node": ">=12.0.0" + }, + "peerDependenciesMeta": { + "@azure/identity": { + "optional": true + }, + "@azure/msal-browser": { + "optional": true + }, + "buffer": { + "optional": true + }, + "stream-browserify": { + "optional": true + } + } + }, + "node_modules/@microsoft/microsoft-graph-types": { + "version": "2.40.0", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-types/-/microsoft-graph-types-2.40.0.tgz", + "integrity": "sha512-1fcPVrB/NkbNcGNfCy+Cgnvwxt6/sbIEEFgZHFBJ670zYLegENYJF8qMo7x3LqBjWX2/Eneq5BVVRCLTmlJN+g==" + }, + "node_modules/@microsoft/microsoft-graph-types-beta": { + "version": "0.29.0-preview", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-types-beta/-/microsoft-graph-types-beta-0.29.0-preview.tgz", + "integrity": "sha512-83PCHDH7GxW8KM1J+MM6FPbaahIuj7VIgnY4UbMGQkkq2fBaHeKOmgjVbohvLVeIOOCTLmorPh6JtXH0VtFurA==" + }, "node_modules/@mui/base": { "version": "5.0.0-alpha.100", "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.100.tgz", @@ -4956,8 +5161,7 @@ "node_modules/@types/trusted-types": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.2.tgz", - "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==", - "dev": true + "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==" }, "node_modules/@types/ws": { "version": "8.5.3", @@ -6811,9 +7015,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001390", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001390.tgz", - "integrity": "sha512-sS4CaUM+/+vqQUlCvCJ2WtDlV81aWtHhqeEVkLokVJJa3ViN4zDxAGfq9R8i1m90uGHxo99cy10Od+lvn3hf0g==", + "version": "1.0.30001571", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001571.tgz", + "integrity": "sha512-tYq/6MoXhdezDLFZuCO/TKboTzuQ/xR5cFdgXPfDtM7/kchBO3b4VWghE/OAi/DV7tTdhmLjZiZBZi1fA/GheQ==", "funding": [ { "type": "opencollective", @@ -6822,6 +7026,10 @@ { "type": "tidelift", "url": "https://tidelift.com/funding/github/npm/caniuse-lite" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" } ] }, @@ -9387,6 +9595,11 @@ "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz", "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50=" }, + "node_modules/exenv-es6": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/exenv-es6/-/exenv-es6-1.1.1.tgz", + "integrity": "sha512-vlVu3N8d6yEMpMsEm+7sUBAI81aqYYuEvfK0jNqmdb/OPXzzH7QWDDnVjMvDSY47JdHEqx/dfC/q8WkfoTmpGQ==" + }, "node_modules/exit": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz", @@ -13953,6 +14166,34 @@ "node": ">=8" } }, + "node_modules/lit": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/lit/-/lit-2.8.0.tgz", + "integrity": "sha512-4Sc3OFX9QHOJaHbmTMk28SYgVxLN3ePDjg7hofEft2zWlehFL3LiAuapWc4U/kYwMYJSh2hTCPZ6/LIC7ii0MA==", + "dependencies": { + "@lit/reactive-element": "^1.6.0", + "lit-element": "^3.3.0", + "lit-html": "^2.8.0" + } + }, + "node_modules/lit-element": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/lit-element/-/lit-element-3.3.3.tgz", + "integrity": "sha512-XbeRxmTHubXENkV4h8RIPyr8lXc+Ff28rkcQzw3G6up2xg5E8Zu1IgOWIwBLEQsu3cOVFqdYwiVi0hv0SlpqUA==", + "dependencies": { + "@lit-labs/ssr-dom-shim": "^1.1.0", + "@lit/reactive-element": "^1.3.0", + "lit-html": "^2.8.0" + } + }, + "node_modules/lit-html": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/lit-html/-/lit-html-2.8.0.tgz", + "integrity": "sha512-o9t+MQM3P4y7M7yNzqAyjp7z+mQGa4NS4CxiyLqFPyFWyc4O+nodLrkrxSaCTrla6M5YOLaT3RpbbqjszB5g3Q==", + "dependencies": { + "@types/trusted-types": "^2.0.2" + } + }, "node_modules/load-script": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz", @@ -14682,6 +14923,11 @@ "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==", "dev": true }, + "node_modules/office-ui-fabric-core": { + "version": "11.1.0", + "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-11.1.0.tgz", + "integrity": "sha512-uV7CbMBAqbHRa7ihNlgbDMIdiKb49TCamhsfuK7Yx7JXx05WdN/lZPWLmPnAALVQAFuO95ZJMAwNjyyEeXk47A==" + }, "node_modules/on-finished": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz", @@ -18726,6 +18972,11 @@ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==", "dev": true }, + "node_modules/tabbable": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz", + "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==" + }, "node_modules/tailwindcss": { "version": "3.1.8", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.1.8.tgz", @@ -19476,6 +19727,11 @@ "minimalistic-assert": "^1.0.0" } }, + "node_modules/wc-react": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/wc-react/-/wc-react-0.5.1.tgz", + "integrity": "sha512-AI5mFXbyUhAhzjBr12xpPAUDthE+qOWTGuRgOpj7a9qjO7+7q/A/IAS23lz5vmltFaKY+MWIPYopJfAoP5/E+Q==" + }, "node_modules/webidl-conversions": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-6.1.0.tgz", @@ -20465,6 +20721,25 @@ "unfetch": "^4.2.0" } }, + "@azure/msal-browser": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@azure/msal-browser/-/msal-browser-3.6.0.tgz", + "integrity": "sha512-FrFBJXRJMyWXjAjg4cUNZwEKktzfzD/YD9+S1kj2ors67hKoveam4aL0bZuCZU/jTiHTn0xDQGQh2ksCMXTXtA==", + "requires": { + "@azure/msal-common": "14.5.0" + } + }, + "@azure/msal-common": { + "version": "14.5.0", + "resolved": "https://registry.npmjs.org/@azure/msal-common/-/msal-common-14.5.0.tgz", + "integrity": "sha512-Gx5rZbiZV/HiZ2nEKfjfAF/qDdZ4/QWxMvMo2jhIFVz528dVKtaZyFAOtsX2Ak8+TQvRsGCaEfuwJFuXB6tu1A==" + }, + "@azure/msal-react": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/@azure/msal-react/-/msal-react-2.0.8.tgz", + "integrity": "sha512-Kmbq2Mm6vrXfemxf8+q1PWU7dhx8Ck4lB6gXFFDR+Bn1odoLzxksOqm8CKEk+y9Bq1iR54H0raTQ3Avan43oMw==", + "requires": {} + }, "@babel/code-frame": { "version": "7.18.6", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz", @@ -22224,6 +22499,18 @@ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.1.tgz", "integrity": "sha512-m0G6wlnhm/AX0H12IOWtK8gASEMffnX08RtKkCgTdHb9JpHKGloI7icFfLg9ZmQeavcvR0PKmzxClyuFPSjKWw==" }, + "@fluentui/web-components": { + "version": "2.5.16", + "resolved": "https://registry.npmjs.org/@fluentui/web-components/-/web-components-2.5.16.tgz", + "integrity": "sha512-Ur+DziCm2FtvQoRjx62DH069uTz/HTq0gk9uKmW8K7bmxCS7fYYpV9GFEnK7QdEbdRHyUINE3uFfLEcL6IY3Xg==", + "requires": { + "@microsoft/fast-colors": "^5.3.0", + "@microsoft/fast-element": "^1.11.1", + "@microsoft/fast-foundation": "^2.48.1", + "@microsoft/fast-web-utilities": "^5.4.0", + "tslib": "^2.1.0" + } + }, "@humanwhocodes/config-array": { "version": "0.10.4", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.10.4.tgz", @@ -22885,6 +23172,141 @@ "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==", "dev": true }, + "@lit-labs/ssr-dom-shim": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@lit-labs/ssr-dom-shim/-/ssr-dom-shim-1.1.2.tgz", + "integrity": "sha512-jnOD+/+dSrfTWYfSXBXlo5l5f0q1UuJo3tkbMDCYA2lKUYq79jaxqtGEvnRoh049nt1vdo1+45RinipU6FGY2g==" + }, + "@lit/reactive-element": { + "version": "1.6.3", + "resolved": "https://registry.npmjs.org/@lit/reactive-element/-/reactive-element-1.6.3.tgz", + "integrity": "sha512-QuTgnG52Poic7uM1AN5yJ09QMe0O28e10XzSvWDz02TJiiKee4stsiownEIadWm8nYzyDAyT+gKzUoZmiWQtsQ==", + "requires": { + "@lit-labs/ssr-dom-shim": "^1.0.0" + } + }, + "@microsoft/fast-colors": { + "version": "5.3.1", + "resolved": "https://registry.npmjs.org/@microsoft/fast-colors/-/fast-colors-5.3.1.tgz", + "integrity": "sha512-72RZXVfCbwQzvo5sXXkuLXLT7rMeYaSf5r/6ewQiv/trBtqpWRm4DEH2EilHw/iWTBKOXs1qZNQndgUMa5n4LA==" + }, + "@microsoft/fast-element": { + "version": "1.12.0", + "resolved": "https://registry.npmjs.org/@microsoft/fast-element/-/fast-element-1.12.0.tgz", + "integrity": "sha512-gQutuDHPKNxUEcQ4pypZT4Wmrbapus+P9s3bR/SEOLsMbNqNoXigGImITygI5zhb+aA5rzflM6O8YWkmRbGkPA==" + }, + "@microsoft/fast-foundation": { + "version": "2.49.4", + "resolved": "https://registry.npmjs.org/@microsoft/fast-foundation/-/fast-foundation-2.49.4.tgz", + "integrity": "sha512-5I2tSPo6bnOfVAIX7XzX+LhilahwvD7h+yzl3jW0t5IYmMX9Lci9VUVyx5f8hHdb1O9a8Y9Atb7Asw7yFO/u+w==", + "requires": { + "@microsoft/fast-element": "^1.12.0", + "@microsoft/fast-web-utilities": "^5.4.1", + "tabbable": "^5.2.0", + "tslib": "^1.13.0" + }, + "dependencies": { + "tslib": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", + "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==" + } + } + }, + "@microsoft/fast-web-utilities": { + "version": "5.4.1", + "resolved": "https://registry.npmjs.org/@microsoft/fast-web-utilities/-/fast-web-utilities-5.4.1.tgz", + "integrity": "sha512-ReWYncndjV3c8D8iq9tp7NcFNc1vbVHvcBFPME2nNFKNbS1XCesYZGlIlf3ot5EmuOXPlrzUHOWzQ2vFpIkqDg==", + "requires": { + "exenv-es6": "^1.1.1" + } + }, + "@microsoft/mgt-components": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-components/-/mgt-components-3.1.3.tgz", + "integrity": "sha512-EwMBOhKGp3uF4BZyLmphDBumvy/gSx+10b2hO3LIZW78Ct2yA1aXcKWru2XNteWZf2U9fzvzdxiIEzhxvIBtHw==", + "requires": { + "@fluentui/web-components": "^2.5.12", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-client": "3.0.2", + "@microsoft/microsoft-graph-types": "^2.0.0", + "@microsoft/microsoft-graph-types-beta": "^0.29.0-preview", + "office-ui-fabric-core": "^11.0.0" + } + }, + "@microsoft/mgt-element": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-element/-/mgt-element-3.1.3.tgz", + "integrity": "sha512-Wvt/PO83MJrcV8Z/Tx0pnCeDB3yulHr5xCrxN47v1KLr7vXj8BFqK73g7PMSOJ0ptDvYB1GEoyYVPACrPPZR0Q==", + "requires": { + "@microsoft/microsoft-graph-client": "3.0.2", + "idb": "6.0.0", + "lit": "^2.3.1" + }, + "dependencies": { + "idb": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/idb/-/idb-6.0.0.tgz", + "integrity": "sha512-+M367poGtpzAylX4pwcrZIa7cFQLfNkAOlMMLN2kw/2jGfJP6h+TB/unQNSVYwNtP8XqkLYrfuiVnxLQNP1tjA==" + } + } + }, + "@microsoft/mgt-msal2-provider": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-msal2-provider/-/mgt-msal2-provider-3.1.3.tgz", + "integrity": "sha512-CrZ38M+PKdfwWzOol5FZwvaMx5RKNvw8KW9DCyGyIYEnOQaT8i+rRkL54ivfLWbk/ZinlOodt1L/CgEZtaLcJQ==", + "requires": { + "@azure/msal-browser": "^2.22.0", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-client": "3.0.2" + }, + "dependencies": { + "@azure/msal-browser": { + "version": "2.38.3", + "resolved": "https://registry.npmjs.org/@azure/msal-browser/-/msal-browser-2.38.3.tgz", + "integrity": "sha512-2WuLFnWWPR1IdvhhysT18cBbkXx1z0YIchVss5AwVA95g7CU5CpT3d+5BcgVGNXDXbUU7/5p0xYHV99V5z8C/A==", + "requires": { + "@azure/msal-common": "13.3.1" + } + }, + "@azure/msal-common": { + "version": "13.3.1", + "resolved": "https://registry.npmjs.org/@azure/msal-common/-/msal-common-13.3.1.tgz", + "integrity": "sha512-Lrk1ozoAtaP/cp53May3v6HtcFSVxdFrg2Pa/1xu5oIvsIwhxW6zSPibKefCOVgd5osgykMi5jjcZHv8XkzZEQ==" + } + } + }, + "@microsoft/mgt-react": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/@microsoft/mgt-react/-/mgt-react-3.1.3.tgz", + "integrity": "sha512-k6AuX0SzFkmRpFPzqsFb4f2KG+BIGCQ51VtuezupzBZk+aHYBQxSS2Unajkfs8boyYW3OLnhKbRQAnkoD1pJuA==", + "requires": { + "@microsoft/mgt-components": "3.1.3", + "@microsoft/mgt-element": "3.1.3", + "@microsoft/microsoft-graph-types": "^2.0.0", + "@microsoft/microsoft-graph-types-beta": "^0.29.0-preview", + "wc-react": "^0.5.0" + } + }, + "@microsoft/microsoft-graph-client": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-client/-/microsoft-graph-client-3.0.2.tgz", + "integrity": "sha512-eYDiApYmiGsm1s1jfAa/rhB2xQCsX4pWt0vCTd1LZmiApMQfT/c0hXj2hvpuGz5GrcLdugbu05xB79rIV57Pjw==", + "requires": { + "@babel/runtime": "^7.12.5", + "tslib": "^2.2.0" + } + }, + "@microsoft/microsoft-graph-types": { + "version": "2.40.0", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-types/-/microsoft-graph-types-2.40.0.tgz", + "integrity": "sha512-1fcPVrB/NkbNcGNfCy+Cgnvwxt6/sbIEEFgZHFBJ670zYLegENYJF8qMo7x3LqBjWX2/Eneq5BVVRCLTmlJN+g==" + }, + "@microsoft/microsoft-graph-types-beta": { + "version": "0.29.0-preview", + "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-types-beta/-/microsoft-graph-types-beta-0.29.0-preview.tgz", + "integrity": "sha512-83PCHDH7GxW8KM1J+MM6FPbaahIuj7VIgnY4UbMGQkkq2fBaHeKOmgjVbohvLVeIOOCTLmorPh6JtXH0VtFurA==" + }, "@mui/base": { "version": "5.0.0-alpha.100", "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.100.tgz", @@ -23829,8 +24251,7 @@ "@types/trusted-types": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.2.tgz", - "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==", - "dev": true + "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==" }, "@types/ws": { "version": "8.5.3", @@ -25178,9 +25599,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001390", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001390.tgz", - "integrity": "sha512-sS4CaUM+/+vqQUlCvCJ2WtDlV81aWtHhqeEVkLokVJJa3ViN4zDxAGfq9R8i1m90uGHxo99cy10Od+lvn3hf0g==" + "version": "1.0.30001571", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001571.tgz", + "integrity": "sha512-tYq/6MoXhdezDLFZuCO/TKboTzuQ/xR5cFdgXPfDtM7/kchBO3b4VWghE/OAi/DV7tTdhmLjZiZBZi1fA/GheQ==" }, "case-sensitive-paths-webpack-plugin": { "version": "2.4.0", @@ -27079,6 +27500,11 @@ "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz", "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50=" }, + "exenv-es6": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/exenv-es6/-/exenv-es6-1.1.1.tgz", + "integrity": "sha512-vlVu3N8d6yEMpMsEm+7sUBAI81aqYYuEvfK0jNqmdb/OPXzzH7QWDDnVjMvDSY47JdHEqx/dfC/q8WkfoTmpGQ==" + }, "exit": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz", @@ -30492,6 +30918,34 @@ } } }, + "lit": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/lit/-/lit-2.8.0.tgz", + "integrity": "sha512-4Sc3OFX9QHOJaHbmTMk28SYgVxLN3ePDjg7hofEft2zWlehFL3LiAuapWc4U/kYwMYJSh2hTCPZ6/LIC7ii0MA==", + "requires": { + "@lit/reactive-element": "^1.6.0", + "lit-element": "^3.3.0", + "lit-html": "^2.8.0" + } + }, + "lit-element": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/lit-element/-/lit-element-3.3.3.tgz", + "integrity": "sha512-XbeRxmTHubXENkV4h8RIPyr8lXc+Ff28rkcQzw3G6up2xg5E8Zu1IgOWIwBLEQsu3cOVFqdYwiVi0hv0SlpqUA==", + "requires": { + "@lit-labs/ssr-dom-shim": "^1.1.0", + "@lit/reactive-element": "^1.3.0", + "lit-html": "^2.8.0" + } + }, + "lit-html": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/lit-html/-/lit-html-2.8.0.tgz", + "integrity": "sha512-o9t+MQM3P4y7M7yNzqAyjp7z+mQGa4NS4CxiyLqFPyFWyc4O+nodLrkrxSaCTrla6M5YOLaT3RpbbqjszB5g3Q==", + "requires": { + "@types/trusted-types": "^2.0.2" + } + }, "load-script": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz", @@ -31045,6 +31499,11 @@ "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==", "dev": true }, + "office-ui-fabric-core": { + "version": "11.1.0", + "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-11.1.0.tgz", + "integrity": "sha512-uV7CbMBAqbHRa7ihNlgbDMIdiKb49TCamhsfuK7Yx7JXx05WdN/lZPWLmPnAALVQAFuO95ZJMAwNjyyEeXk47A==" + }, "on-finished": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz", @@ -33910,6 +34369,11 @@ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==", "dev": true }, + "tabbable": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.3.3.tgz", + "integrity": "sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==" + }, "tailwindcss": { "version": "3.1.8", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.1.8.tgz", @@ -34475,6 +34939,11 @@ "minimalistic-assert": "^1.0.0" } }, + "wc-react": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/wc-react/-/wc-react-0.5.1.tgz", + "integrity": "sha512-AI5mFXbyUhAhzjBr12xpPAUDthE+qOWTGuRgOpj7a9qjO7+7q/A/IAS23lz5vmltFaKY+MWIPYopJfAoP5/E+Q==" + }, "webidl-conversions": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-6.1.0.tgz", diff --git a/package.json b/package.json index 0dded618..da2ffcae 100644 --- a/package.json +++ b/package.json @@ -31,9 +31,14 @@ }, "dependencies": { "@auth0/auth0-react": "^1.11.0", + "@azure/msal-browser": "^3.6.0", + "@azure/msal-react": "^2.0.8", "@date-io/date-fns": "^1.3.13", "@emotion/react": "^11.10.4", "@emotion/styled": "^11.10.4", + "@microsoft/mgt-element": "^3.1.3", + "@microsoft/mgt-msal2-provider": "^3.1.3", + "@microsoft/mgt-react": "^3.1.3", "@mui/icons-material": "^5.10.6", "@mui/lab": "^5.0.0-alpha.102", "@mui/material": "^5.14.7", diff --git a/src/AppRoutes.tsx b/src/AppRoutes.tsx index 4e8cdda3..260c2612 100644 --- a/src/AppRoutes.tsx +++ b/src/AppRoutes.tsx @@ -1,4 +1,4 @@ -import React, { FC } from "react"; +import React, { FC, useEffect, useState } from "react"; import { Route, Routes } from "react-router-dom"; import App from "./views/App/App"; import About from "./views/About/About"; @@ -9,7 +9,7 @@ import NotFound from "./views/NotFound/NotFound"; import Search from "./views/Search/Search"; import CsaTester from "./views/CsaTester"; import Motives from "./views/Intern/Motives/Motives"; -import LoggInn from "./views/Intern/LoggInn/LoggInn"; +import Login from "./views/Login/AzureLogin"; import EditMotive from "./views/Intern/EditMotive/EditMotive"; import InternNav from "./views/Intern/InternNav/InternNav"; import Expo from "./views/Intern/Expo/Expo"; @@ -17,8 +17,18 @@ import Redirect from "./utils/Redirect/Redirect"; import MotiveHeader from "./components/ImageViewer/MotiveHeader"; import InternSearchView from "./views/Intern/InternSearch/InternSearchView"; import { Box } from "@mui/material"; +import { useMsal } from "@azure/msal-react"; const AppRoutes: FC = () => { + const { instance } = useMsal(); + const activeAccount = instance.getActiveAccount(); + const [isAuthenticated, setIsAuthenticated] = useState(false); + + useEffect(() => { + // Check if there is an authenticated user + setIsAuthenticated(!!activeAccount); + }, [activeAccount]); + return ( @@ -35,9 +45,10 @@ const AppRoutes: FC = () => { } /> } /> } /> - } /> - } /> - + } /> + {isAuthenticated && + + } />} } /> { - const { isAuthenticated } = useAuth0(); const replace = useNavigate(); - const [showMenu, setShowMenu] = useState(false); const onMenuClick = () => setShowMenu(true); const onCloseClick = () => setShowMenu(false); - const handleResize = () => setShowMenu(false); - window.addEventListener("resize", handleResize); + const { instance } = useMsal(); + const activeAccount = instance.getActiveAccount(); + const [isAuthenticated, setIsAuthenticated] = useState(false); + + useEffect(() => { + setIsAuthenticated(!!activeAccount); + }, [activeAccount]); + const menuLinks = [ { name: "Bilder", @@ -48,13 +51,16 @@ const HeaderComponent: FC = () => { noAuth: true, }, - { - name: "Intern", - to: "/intern", - icon: , - noAuth: isAuthenticated, - }, - + ...(isAuthenticated + ? [ + { + name: "Intern", + to: "/intern", + icon: , + noAuth: true, + }, + ] + : []), { name: "Logg inn", to: "/logg-inn", @@ -106,15 +112,11 @@ const HeaderComponent: FC = () => {
BILDER OM OSS - {isAuthenticated && INTERN} + {isAuthenticated ? INTERN : <>} SØK
- {isAuthenticated ? ( - LOGG UT - ) : ( - LOGG INN - )} +
diff --git a/src/gui-components/GuiCarousel/index.tsx b/src/gui-components/GuiCarousel/index.tsx index 160e2c26..8f363b47 100644 --- a/src/gui-components/GuiCarousel/index.tsx +++ b/src/gui-components/GuiCarousel/index.tsx @@ -1,10 +1,10 @@ -import React, { FC, useEffect, useState, ReactNodeArray } from "react"; +import React, { FC, useEffect, useState, ReactNode } from "react"; import styles from "./GuiCarousel.module.css"; import cx from "classnames"; import { DefaultProps } from "../../types"; interface GuiCarouselProps extends DefaultProps { - children: ReactNodeArray; + children: ReactNode[]; delay: number; width?: number; height?: number; diff --git a/src/gui-components/GuiCarouselItem/index.tsx b/src/gui-components/GuiCarouselItem/index.tsx index cf7f20bd..a38ad199 100644 --- a/src/gui-components/GuiCarouselItem/index.tsx +++ b/src/gui-components/GuiCarouselItem/index.tsx @@ -1,4 +1,4 @@ -import React, { FC, ReactNodeArray } from "react"; +import React, { FC, ReactNode } from "react"; import cx from "classnames"; import styles from "./GuiCarouselItem.module.css"; import { BaseCarouselItem } from "../../types"; @@ -38,7 +38,7 @@ const GuiCarouselItems = ({ items, height, width, -}: GuiCarouselItemsProps): ReactNodeArray => { +}: GuiCarouselItemsProps): ReactNode[] => { return items.map((item, index) => ( { + + //Msal should be instanciated outside component tree to prevent it from being re-instanciated on re-renders + const msalInstance = new PublicClientApplication(azureConfig); + // Default for using the first account if no account is active on page load. + if ( + !msalInstance.getActiveAccount() && + msalInstance.getAllAccounts().length > 0 + ) { + // Set the active account using the first account in the list + msalInstance.setActiveAccount(msalInstance.getAllAccounts()[0]); + } + + //listen for sign-in event and set active account + msalInstance.addEventCallback((event) => { + const payload = event.payload as AuthenticationResult; + if (event.eventType === EventType.LOGIN_SUCCESS && payload.account) { + const account = payload.account; + msalInstance.setActiveAccount(account); + } + }); + // Hooks for the Alert component const [open, setOpen] = useState(false); const [message, setMessage] = useState(""); @@ -26,22 +50,18 @@ const Root: FC = () => { return ( <> - - - + + + { - {isOpen && ( - setIsOpen(false)} - onMovePrevRequest={() => - setPhotoIndex( - (photoIndex + photos.length - 1) % photos.length, - ) - } - onMoveNextRequest={() => - setPhotoIndex((photoIndex + 1) % photos.length) - } - /> - )} - - - + + + {isOpen && ( + setIsOpen(false)} + onMovePrevRequest={() => + setPhotoIndex((photoIndex + photos.length - 1) % photos.length) + } + onMoveNextRequest={() => + setPhotoIndex((photoIndex + 1) % photos.length) + } + /> + )} + + ); }; diff --git a/src/utils/api/api.tsx b/src/utils/api/api.tsx index b1a9f472..6f70b6b1 100644 --- a/src/utils/api/api.tsx +++ b/src/utils/api/api.tsx @@ -2,7 +2,7 @@ /* eslint-disable @typescript-eslint/no-unsafe-return */ import axios from "axios"; -const API_BASE_URL = "http://localhost:8080"; //process.env.BASE_URL; +const API_BASE_URL = "http://localhost:8000"; //process.env.BASE_URL; const HEADERS = { Accept: "application/json", "Content-Type": "application/json", diff --git a/src/views/Intern/LoggInn/LoggInn.tsx b/src/views/Intern/LoggInn/LoggInn.tsx deleted file mode 100644 index 178f62d2..00000000 --- a/src/views/Intern/LoggInn/LoggInn.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React, { FC } from "react"; - -import { useAuth0 } from "@auth0/auth0-react"; - -const LoggInn: FC = () => { - const { loginWithRedirect, isAuthenticated, logout } = useAuth0(); - if (isAuthenticated) { - logout({ returnTo: window.location.origin }); - } else { - loginWithRedirect() - .catch((err) => console.log(err)) - .then(() => console.log("wow")) - .catch(() => console.log("oblig")); - } - - return <> ; -}; - -export default LoggInn; diff --git a/src/views/Login/AzureLogin.tsx b/src/views/Login/AzureLogin.tsx new file mode 100644 index 00000000..22cd7460 --- /dev/null +++ b/src/views/Login/AzureLogin.tsx @@ -0,0 +1,184 @@ +import React, { useState, useEffect } from "react"; +import { Button } from "@mui/material"; +import { + AuthenticatedTemplate, + UnauthenticatedTemplate, + useMsal, +} from "@azure/msal-react"; +import { loginRequest } from "../../azureconfig"; + +interface UserProfile { + displayName: string; + // Add more user profile properties as needed +} + +const AzureLogin: React.FC = () => { + const { instance, accounts } = useMsal(); + const activateAccount = instance.getActiveAccount(); + const [userProfile, setUserProfile] = useState(null); + + const handleRedirect = async (): Promise => { + try { + await instance.loginPopup({ + ...loginRequest, + prompt: "create", + }); + } catch (error) { + console.log(error); + } + }; + + const handleLogout = async (): Promise => { + try { + await instance.logoutRedirect({}); + } catch (error) { + console.log(error); + } + }; + + //makes user if logged in user has access to do so + // const createUser = async () => { + // const apiUrl = "https://graph.microsoft.com/v1.0/users"; + // const newUser = { + // accountEnabled: true, + // displayName: "John Doe2", + // mailNickname: "john.doe2", + // userPrincipalName: "john.doe2@fgsamfundet.onmicrosoft.com", + // passwordProfile: { + // forceChangePasswordNextSignIn: true, + // password: "A_Strong_Password123", + // }, + // }; + + // try { + // const activeAccount = instance.getActiveAccount(); + + // if (!activeAccount) { + // console.error("No active account. Please log in."); + // return; + // } + + // const accessToken = await instance + // .acquireTokenSilent({ + // account: activeAccount, + // scopes: ["User.Read"], + // }) + // .catch((error) => { + // console.error("Error acquiring token silently:", error.message); + // throw error; + // }); + + // if (accessToken) { + // const response = await fetch(apiUrl, { + // method: "POST", + // headers: { + // "Content-Type": "application/json", + // Authorization: `Bearer ${accessToken.accessToken}`, + // }, + // body: JSON.stringify(newUser), + // }); + + // if (response.ok) { + // console.log("User created successfully"); + // } else { + // console.error("Error creating user:", await response.text()); + // } + // } + // } catch (error: any) { + // console.error("Error:", error.message); + // } + // }; + + //get function call for user profile currently logged in + useEffect(() => { + const fetchUserProfile = async () => { + if (activateAccount) { + try { + const accessToken = await instance + .acquireTokenSilent({ + account: accounts[0], + scopes: ["User.Read"], + }) + .catch((error) => { + console.log("Error acquiring token silently:", error.message); + }); + + if (accessToken) { + await callGraphApi(accessToken.accessToken); + } + } catch (error: any) { + console.log("Error fetching user profile:", error.message); + } + } + }; + + fetchUserProfile().catch((error) => { + console.error("Error fetching user profile:", error.message); + throw error; + }); + }, [activateAccount, accounts, instance]); + + const callGraphApi = async (accessToken: string) => { + const apiUrl = "https://graph.microsoft.com/v1.0/me"; + + try { + const response = await fetch(apiUrl, { + method: "GET", + headers: { + Authorization: `Bearer ${accessToken}`, + }, + }); + + if (response.ok) { + const data: UserProfile = await response.json(); + setUserProfile(data); + } else { + console.error("Error calling Graph API:", await response.text()); + } + } catch (error: any) { + console.error("Error:", error.message); + } + }; + + //Wrappers are here to fix linting error + const handleRedirectWrapper = (): void => { + handleRedirect().catch((error) => console.log(error)); + }; + + const handleLogoutWrapper = (): void => { + handleLogout().catch((error) => console.log(error)); + }; + + return ( +
+ {/* This is shown when the user is not authenticated */} + + + {/* */} + + {/* This is shown when the user is authenticated */} + + {activateAccount ? ( +
+ {userProfile ? ( +
+ + {/* */} +
+ ) : ( +

Loading user profile...

+ )} +
+ ) : ( +

Error

+ )} + +
+ ); +}; + +export default AzureLogin; \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json index e18c413e..41dc590a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,11 +1,7 @@ { "compilerOptions": { "target": "es5", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], + "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, @@ -20,7 +16,5 @@ "jsx": "react-jsx", "noFallthroughCasesInSwitch": true }, - "include": [ - "src" - ] + "include": ["src", "src/azureconfig.ts"] } From e3adf9e4acb6a7e8b9d6b5043cddbf6ef9641c89 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marius=20B=C3=B8lset=20Gisleberg?= <108019395+Gissebass@users.noreply.github.com> Date: Tue, 30 Jan 2024 16:18:57 +0100 Subject: [PATCH 2/3] changed to redirect back to original page (#790) --- src/azureconfig.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/azureconfig.ts b/src/azureconfig.ts index 469617e1..3d593fc6 100644 --- a/src/azureconfig.ts +++ b/src/azureconfig.ts @@ -11,7 +11,7 @@ export const azureConfig = { // Indicated the page to navigate after logout. postLogoutRedirectUri: "/", // if "true", will navigate back to the original request location before processing the auth code response - navigateToLoginRequestUrl: false, + navigateToLoginRequestUrl: true, }, cache: { //configures cache location. "sessionStorage" is more secure, but "localStorage" gives SSO between tabs. From 93cf2e5181f4191491871a273e42474362ba190c Mon Sep 17 00:00:00 2001 From: Jennytl <158496566+Jennytl@users.noreply.github.com> Date: Thu, 1 Feb 2024 19:14:38 +0100 Subject: [PATCH 3/3] updated readme (#791) --- README.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/README.md b/README.md index 85639a9f..59eb7921 100644 --- a/README.md +++ b/README.md @@ -27,8 +27,6 @@ It correctly bundles React in production mode and optimizes the build for the be The build is minified and the filenames include the hashes.
Your app is ready to be deployed! -See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. - ### `npm run eject` **Note: this is a one-way operation. Once you `eject`, you can’t go back!** @@ -37,4 +35,4 @@ If you aren’t satisfied with the build tool and configuration choices, you can Instead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own. -You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. +You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. \ No newline at end of file