{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\components\\\\updateUserData\\\\UserDataInfo.js\",\n _s = $RefreshSig$();\n\nimport React, { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { useOktaAuth } from '@okta/okta-react';\nimport UpdateUserDataModal from '../../components/updateUserData/updateUserDataModal/UpdateUserDataModal';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst UpdateUserData = () => {\n _s();\n\n const {\n authState,\n oktaAuth\n } = useOktaAuth();\n const [userInfo, setUserInfo] = useState(null);\n const [name, setName] = useState('');\n const [email, setEmail] = useState('');\n const [updateUserDataModalState, setUpdateUserDataModalState] = useState(false);\n\n const toggleUpdateUserDataModalState = () => setUpdateUserDataModalState(!updateUserDataModalState);\n\n useEffect(() => {\n if (!authState.isAuthenticated) {\n // When user isn't authenticated, forget any user info\n setUserInfo(null);\n } else if (authState.isAuthenticated && updateUserDataModalState === false) {\n oktaAuth.getUser().then(info => {\n setUserInfo(info);\n });\n }\n }, [authState, oktaAuth, updateUserDataModalState]); // Update if authState changes\n\n useEffect(() => {\n userInfo && setName(userInfo.name);\n userInfo && setEmail(userInfo.email);\n }, [userInfo]);\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"personal-information-container\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"container-header\",\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"user-circle\",\n className: \"user-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 40,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"h5\", {\n children: \"Personal information\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 41,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n onClick: toggleUpdateUserDataModalState,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"pen\",\n className: \"pen-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 43,\n columnNumber: 11\n }, this), \"Edit\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 42,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 39,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"content\",\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: [/*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"b\", {\n children: \"Name:\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 50,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 49,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: userInfo ? name : \"Fetching name\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 52,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"b\", {\n children: \"Email\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 56,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 55,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: userInfo ? email : \"Fetching email\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 58,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 48,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 47,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: `modal ${updateUserDataModalState ? \"active\" : \"inactive\"}`,\n children: /*#__PURE__*/_jsxDEV(UpdateUserDataModal, {\n removeModal: () => setUpdateUserDataModalState(false)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 64,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 63,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 38,\n columnNumber: 5\n }, this);\n};\n\n_s(UpdateUserData, \"TVJKyWZdBHB4T7R5lFB40t17n2E=\", false, function () {\n return [useOktaAuth];\n});\n\n_c = UpdateUserData;\nexport default UpdateUserData;\n\nvar _c;\n\n$RefreshReg$(_c, \"UpdateUserData\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/components/updateUserData/UserDataInfo.js"],"names":["React","useEffect","useState","FontAwesomeIcon","useOktaAuth","UpdateUserDataModal","UpdateUserData","authState","oktaAuth","userInfo","setUserInfo","name","setName","email","setEmail","updateUserDataModalState","setUpdateUserDataModalState","toggleUpdateUserDataModalState","isAuthenticated","getUser","then","info"],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react'\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport { useOktaAuth } from '@okta/okta-react';\r\nimport UpdateUserDataModal from '../../components/updateUserData/updateUserDataModal/UpdateUserDataModal';\r\n\r\nconst UpdateUserData = () => {\r\n const { authState, oktaAuth } = useOktaAuth();\r\n const [userInfo, setUserInfo] = useState(null);\r\n\r\n const [name, setName] = useState('')\r\n const [email, setEmail] = useState('');\r\n\r\n const [updateUserDataModalState, setUpdateUserDataModalState] = useState(false)\r\n const toggleUpdateUserDataModalState = () => setUpdateUserDataModalState(!updateUserDataModalState)\r\n\r\n useEffect(() => {\r\n if (!authState.isAuthenticated) {\r\n // When user isn't authenticated, forget any user info\r\n setUserInfo(null);\r\n } else if (authState.isAuthenticated && updateUserDataModalState === false) {\r\n oktaAuth.getUser().then(info => {\r\n setUserInfo(info);\r\n });\r\n }\r\n }, [authState, oktaAuth, updateUserDataModalState]); // Update if authState changes\r\n\r\n useEffect(() => {\r\n userInfo && (\r\n setName(userInfo.name)\r\n )\r\n\r\n userInfo && (\r\n setEmail(userInfo.email)\r\n )\r\n }, [userInfo])\r\n\r\n return (\r\n <div className=\"personal-information-container\">\r\n <div className=\"container-header\">\r\n <FontAwesomeIcon icon=\"user-circle\" className=\"user-icon\"></FontAwesomeIcon>\r\n <h5>Personal information</h5>\r\n <button onClick={toggleUpdateUserDataModalState}>\r\n <FontAwesomeIcon icon=\"pen\" className=\"pen-icon\"></FontAwesomeIcon>\r\n Edit\r\n </button>\r\n </div>\r\n <div className=\"content\">\r\n <ul>\r\n <li>\r\n <b>Name:</b>\r\n </li>\r\n <li>\r\n {userInfo ? name : \"Fetching name\"}\r\n </li>\r\n <li>\r\n <b>Email</b>\r\n </li>\r\n <li>\r\n {userInfo ? email : \"Fetching email\"}\r\n </li>\r\n </ul>\r\n </div>\r\n <div className={`modal ${updateUserDataModalState ? \"active\" : \"inactive\"}`}>\r\n <UpdateUserDataModal removeModal={() => setUpdateUserDataModalState(false)} />\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default UpdateUserData\r\n"]},"metadata":{},"sourceType":"module"}