Commit e4f09cae authored by Mathias Engelbrecht Pilegård's avatar Mathias Engelbrecht Pilegård
Browse files

added redirect to home when oktaAuth detects user as already logged in

parent 47e062ec
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\pages\\\\team\\\\teamInfo\\\\TeamInfo.jsx\",\n _s = $RefreshSig$();\n\nimport React, { useRef, useState, useEffect } from 'react';\nimport \"./TeamInfo.css\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst TeamInfo = () => {\n _s();\n\n const dropdownRef = useRef(null);\n const [isActive, setIsActive] = useState(false);\n\n const onClick = () => setIsActive(!isActive);\n\n useEffect(() => {\n const pageClickEvent = e => {\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\n setIsActive(!isActive);\n }\n }; // If the item is active (ie open) then listen for clicks\n\n\n if (isActive) {\n window.addEventListener('click', pageClickEvent);\n }\n\n return () => {\n window.removeEventListener('click', pageClickEvent);\n };\n }, [isActive]);\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"page-content-container\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"teamInformationPage-content-header\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"header-text\",\n children: /*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"teamInformationPage-title\",\n children: \"Henriks Meme machine > overview\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 32,\n columnNumber: 11\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 31,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"header-notification-select-settings-button-container\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"notification-button-container\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n className: `notification-button ${isActive ? 'active' : 'inactive'}`,\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"bell-icon\",\n icon: \"bell\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 37,\n columnNumber: 15\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"down-arrow\",\n icon: \"angle-down\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 38,\n columnNumber: 15\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 36,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n ref: dropdownRef,\n className: `user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`,\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"a\", {\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"user\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 44,\n columnNumber: 21\n }, this), \"\\xA0\\xA0Account\", /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"chevron-right\",\n className: \"arrow-right-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 45,\n columnNumber: 21\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 43,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 42,\n columnNumber: 17\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 41,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 40,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 35,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"settings-button-container\",\n children: /*#__PURE__*/_jsxDEV(\"button\", {\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"cog\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 53,\n columnNumber: 15\n }, this), \"\\xA0Settings\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 52,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 51,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 34,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 30,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"teamInformationPage-content-container\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 59,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 29,\n columnNumber: 5\n }, this);\n};\n\n_s(TeamInfo, \"+2ios9YLl+dWpD7Y2mDqdcbDdLo=\");\n\n_c = TeamInfo;\nexport default TeamInfo;\n\nvar _c;\n\n$RefreshReg$(_c, \"TeamInfo\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/pages/team/teamInfo/TeamInfo.jsx"],"names":["React","useRef","useState","useEffect","FontAwesomeIcon","TeamInfo","dropdownRef","isActive","setIsActive","onClick","pageClickEvent","e","current","contains","target","window","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react'\r\nimport \"./TeamInfo.css\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\n\r\nconst TeamInfo = () => {\r\n const dropdownRef = useRef(null);\r\n const [isActive, setIsActive] = useState(false);\r\n const onClick = () => setIsActive(!isActive);\r\n\r\n useEffect(() => {\r\n const pageClickEvent = (e) => {\r\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\r\n setIsActive(!isActive);\r\n }\r\n };\r\n\r\n // If the item is active (ie open) then listen for clicks\r\n if (isActive) {\r\n window.addEventListener('click', pageClickEvent);\r\n }\r\n\r\n return () => {\r\n window.removeEventListener('click', pageClickEvent);\r\n }\r\n\r\n }, [isActive]);\r\n\r\n return (\r\n <div className=\"page-content-container\">\r\n <div className=\"teamInformationPage-content-header\">\r\n <div className=\"header-text\">\r\n <h2 className=\"teamInformationPage-title\">Henriks Meme machine > overview</h2>\r\n </div>\r\n <div className=\"header-notification-select-settings-button-container\">\r\n <div className=\"notification-button-container\">\r\n <button className={`notification-button ${isActive ? 'active' : 'inactive'}`} onClick={onClick} >\r\n <FontAwesomeIcon className=\"bell-icon\" icon=\"bell\"></FontAwesomeIcon>\r\n <FontAwesomeIcon className=\"down-arrow\" icon=\"angle-down\"></FontAwesomeIcon>\r\n </button>\r\n <div ref={dropdownRef} className={`user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`}>\r\n <ul>\r\n <li>\r\n <a>\r\n <FontAwesomeIcon icon=\"user\"></FontAwesomeIcon>&nbsp;&nbsp;Account\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div className=\"settings-button-container\">\r\n <button>\r\n <FontAwesomeIcon icon=\"cog\"></FontAwesomeIcon>\r\n &nbsp;Settings\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div className=\"teamInformationPage-content-container\">\r\n {/*TODO: components goes here */}\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default TeamInfo"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\components\\\\navbar\\\\dropdownMenu\\\\NavbarDropdownMenu.jsx\",\n _s = $RefreshSig$();\n\nimport React, { useRef, useState, useEffect } from 'react';\nimport { NavLink } from \"react-router-dom\";\nimport { useOktaAuth } from '@okta/okta-react';\nimport \"./NavbarDropdownMenu.css\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst DropdownMenu = () => {\n _s();\n\n const {\n authState,\n oktaAuth\n } = useOktaAuth();\n const dropdownRef = useRef(null);\n const [isActive, setIsActive] = useState(false);\n\n const onClick = () => setIsActive(!isActive);\n\n useEffect(() => {\n const pageClickEvent = e => {\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\n setIsActive(!isActive);\n }\n }; // If the item is active (ie open) then listen for clicks\n\n\n if (isActive) {\n window.addEventListener('click', pageClickEvent);\n }\n\n return () => {\n window.removeEventListener('click', pageClickEvent);\n };\n }, [isActive]);\n\n const logout = () => {\n oktaAuth.signOut();\n };\n\n return /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"navbar-user-dropdown-container\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n className: `user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`,\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"user-icon\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 41,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"down-arrow\",\n icon: \"angle-down\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 42,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 40,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n ref: dropdownRef,\n className: `user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`,\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: [/*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n href: \"/account\",\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"user\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 49,\n columnNumber: 17\n }, this), \"\\xA0\\xA0Account\", /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"chevron-right\",\n className: \"arrow-right-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 50,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 48,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 47,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/messages\",\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"envelope\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 55,\n columnNumber: 17\n }, this), \"\\xA0\\xA0Messages\", /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"chevron-right\",\n className: \"arrow-right-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 56,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 54,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 53,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"a\", {\n onClick: logout,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"sign-out-alt\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 67,\n columnNumber: 17\n }, this), \"\\xA0\\xA0Log out\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 66,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 65,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 46,\n columnNumber: 11\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 45,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 39,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 38,\n columnNumber: 5\n }, this);\n};\n\n_s(DropdownMenu, \"K/H+pngTJ7UqSrk/MkDOYkpAmdU=\", false, function () {\n return [useOktaAuth];\n});\n\n_c = DropdownMenu;\nexport default DropdownMenu;\n\nvar _c;\n\n$RefreshReg$(_c, \"DropdownMenu\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/components/navbar/dropdownMenu/NavbarDropdownMenu.jsx"],"names":["React","useRef","useState","useEffect","NavLink","useOktaAuth","FontAwesomeIcon","DropdownMenu","authState","oktaAuth","dropdownRef","isActive","setIsActive","onClick","pageClickEvent","e","current","contains","target","window","addEventListener","removeEventListener","logout","signOut"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,MAAhB,EAAwBC,QAAxB,EAAkCC,SAAlC,QAAmD,OAAnD;AACA,SAASC,OAAT,QAAwB,kBAAxB;AACA,SAASC,WAAT,QAA4B,kBAA5B;AACA,OAAO,0BAAP;AACA,SAASC,eAAT,QAAgC,gCAAhC;;;AAGA,MAAMC,YAAY,GAAG,MAAM;AAAA;;AACzB,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA0BJ,WAAW,EAA3C;AAEA,QAAMK,WAAW,GAAGT,MAAM,CAAC,IAAD,CAA1B;AACA,QAAM,CAACU,QAAD,EAAWC,WAAX,IAA0BV,QAAQ,CAAC,KAAD,CAAxC;;AACA,QAAMW,OAAO,GAAG,MAAMD,WAAW,CAAC,CAACD,QAAF,CAAjC;;AAEAR,EAAAA,SAAS,CAAC,MAAM;AACd,UAAMW,cAAc,GAAIC,CAAD,IAAO;AAC5B,UAAIL,WAAW,CAACM,OAAZ,KAAwB,IAAxB,IAAgC,CAACN,WAAW,CAACM,OAAZ,CAAoBC,QAApB,CAA6BF,CAAC,CAACG,MAA/B,CAArC,EAA6E;AAC3EN,QAAAA,WAAW,CAAC,CAACD,QAAF,CAAX;AACD;AACF,KAJD,CADc,CAOd;;;AACA,QAAIA,QAAJ,EAAc;AACZQ,MAAAA,MAAM,CAACC,gBAAP,CAAwB,OAAxB,EAAiCN,cAAjC;AACD;;AAED,WAAO,MAAM;AACXK,MAAAA,MAAM,CAACE,mBAAP,CAA2B,OAA3B,EAAoCP,cAApC;AACD,KAFD;AAID,GAhBQ,EAgBN,CAACH,QAAD,CAhBM,CAAT;;AAkBA,QAAMW,MAAM,GAAG,MAAM;AACnBb,IAAAA,QAAQ,CAACc,OAAT;AACD,GAFD;;AAIA,sBACE;AAAA,2BACE;AAAK,MAAA,SAAS,EAAC,gCAAf;AAAA,8BACE;AAAQ,QAAA,SAAS,EAAG,oCAAmCZ,QAAQ,GAAG,QAAH,GAAc,UAAW,EAAxF;AAA2F,QAAA,OAAO,EAAEE,OAApG;AAAA,gCACE,QAAC,eAAD;AAAiB,UAAA,SAAS,EAAC,WAA3B;AAAuC,UAAA,IAAI,EAAC;AAA5C;AAAA;AAAA;AAAA;AAAA,gBADF,eAEE,QAAC,eAAD;AAAiB,UAAA,SAAS,EAAC,YAA3B;AAAwC,UAAA,IAAI,EAAC;AAA7C;AAAA;AAAA;AAAA;AAAA,gBAFF;AAAA;AAAA;AAAA;AAAA;AAAA,cADF,eAME;AAAK,QAAA,GAAG,EAAEH,WAAV;AAAuB,QAAA,SAAS,EAAG,8BAA6BC,QAAQ,GAAG,QAAH,GAAc,UAAW,EAAjG;AAAA,+BACE;AAAA,kCACE;AAAA,mCACE,QAAC,OAAD;AAAS,cAAA,IAAI,EAAC,UAAd;AAAA,sCACE,QAAC,eAAD;AAAiB,gBAAA,IAAI,EAAC;AAAtB;AAAA;AAAA;AAAA;AAAA,sBADF,kCAEE,QAAC,eAAD;AAAiB,gBAAA,IAAI,EAAC,eAAtB;AAAsC,gBAAA,SAAS,EAAC;AAAhD;AAAA;AAAA;AAAA;AAAA,sBAFF;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,kBADF,eAOE;AAAA,mCACE,QAAC,OAAD;AAAS,cAAA,EAAE,EAAC,WAAZ;AAAA,sCACE,QAAC,eAAD;AAAiB,gBAAA,IAAI,EAAC;AAAtB;AAAA;AAAA;AAAA;AAAA,sBADF,mCAEE,QAAC,eAAD;AAAiB,gBAAA,IAAI,EAAC,eAAtB;AAAsC,gBAAA,SAAS,EAAC;AAAhD;AAAA;AAAA;AAAA;AAAA,sBAFF;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,kBAPF,eAmBE;AAAA,mCACE;AAAG,cAAA,OAAO,EAAEW,MAAZ;AAAA,sCACE,QAAC,eAAD;AAAiB,gBAAA,IAAI,EAAC;AAAtB;AAAA;AAAA;AAAA;AAAA,sBADF;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,kBAnBF;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,cANF;AAAA;AAAA;AAAA;AAAA;AAAA;AADF;AAAA;AAAA;AAAA;AAAA,UADF;AAsCD,CAnED;;GAAMf,Y;UAC4BF,W;;;KAD5BE,Y;AAqEN,eAAeA,YAAf","sourcesContent":["import React, { useRef, useState, useEffect } from 'react'\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { useOktaAuth } from '@okta/okta-react';\r\nimport \"./NavbarDropdownMenu.css\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\n\r\n\r\nconst DropdownMenu = () => {\r\n const { authState, oktaAuth } = useOktaAuth();\r\n\r\n const dropdownRef = useRef(null);\r\n const [isActive, setIsActive] = useState(false);\r\n const onClick = () => setIsActive(!isActive);\r\n\r\n useEffect(() => {\r\n const pageClickEvent = (e) => {\r\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\r\n setIsActive(!isActive);\r\n }\r\n };\r\n\r\n // If the item is active (ie open) then listen for clicks\r\n if (isActive) {\r\n window.addEventListener('click', pageClickEvent);\r\n }\r\n\r\n return () => {\r\n window.removeEventListener('click', pageClickEvent);\r\n }\r\n\r\n }, [isActive]);\r\n\r\n const logout = () => {\r\n oktaAuth.signOut()\r\n }\r\n\r\n return (\r\n <li>\r\n <div className=\"navbar-user-dropdown-container\">\r\n <button className={`user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`} onClick={onClick} >\r\n <FontAwesomeIcon className=\"user-icon\" icon=\"user-circle\"></FontAwesomeIcon>\r\n <FontAwesomeIcon className=\"down-arrow\" icon=\"angle-down\"></FontAwesomeIcon>\r\n </button>\r\n {/* show submenu?*/}\r\n <div ref={dropdownRef} className={`user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`}>\r\n <ul>\r\n <li>\r\n <NavLink href=\"/account\">\r\n <FontAwesomeIcon icon=\"user\"></FontAwesomeIcon>&nbsp;&nbsp;Account\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </NavLink>\r\n </li>\r\n <li>\r\n <NavLink to=\"/messages\">\r\n <FontAwesomeIcon icon=\"envelope\"></FontAwesomeIcon>&nbsp;&nbsp;Messages\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </NavLink>\r\n </li>\r\n {/* <li>\r\n <a href=\"./\">\r\n <FontAwesomeIcon icon=\"sliders-h\"></FontAwesomeIcon>&nbsp;&nbsp;Preferences\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </a>\r\n </li> */}\r\n <li>\r\n <a onClick={logout}>\r\n <FontAwesomeIcon icon=\"sign-out-alt\"></FontAwesomeIcon>&nbsp;&nbsp;Log out\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </li >\r\n )\r\n}\r\n\r\nexport default DropdownMenu"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\components\\\\navbar\\\\dropdownMenu\\\\NavbarDropdownMenu.jsx\",\n _s = $RefreshSig$();\n\nimport React, { useRef, useState, useEffect } from 'react';\nimport { NavLink } from \"react-router-dom\";\nimport { useOktaAuth } from '@okta/okta-react';\nimport \"./NavbarDropdownMenu.css\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst DropdownMenu = () => {\n _s();\n\n const {\n authState,\n oktaAuth\n } = useOktaAuth();\n const [userInfo, setUserInfo] = useState(null);\n const dropdownRef = useRef(null);\n const [isActive, setIsActive] = useState(false);\n\n const onClick = () => setIsActive(!isActive);\n\n useEffect(() => {\n const pageClickEvent = e => {\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\n setIsActive(!isActive);\n }\n }; // If the item is active (ie open) then listen for clicks\n\n\n if (isActive) {\n window.addEventListener('click', pageClickEvent);\n }\n\n return () => {\n window.removeEventListener('click', pageClickEvent);\n };\n }, [isActive]);\n useEffect(() => {\n if (!authState.isAuthenticated) {\n // When user isn't authenticated, forget any user info\n setUserInfo(null);\n } else {\n oktaAuth.getUser().then(info => {\n setUserInfo(info);\n });\n }\n }, [authState, oktaAuth]); // Update if authState changes\n\n const logout = () => {\n oktaAuth.signOut();\n };\n\n return /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"navbar-user-dropdown-container\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n className: `user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`,\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"user-icon\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 53,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"down-arrow\",\n icon: \"angle-down\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 54,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 52,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n ref: dropdownRef,\n className: `user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`,\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: [/*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"menu-item\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"arrow-right\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 63,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 62,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"item-text\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"upper-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link\",\n children: \"Account\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 67,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 66,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bottom-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link-bottom\",\n children: userInfo ? userInfo.email : \"...\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 72,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 71,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 65,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"arrow-right\",\n icon: \"chevron-right\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 78,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 77,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 61,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 60,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"menu-item\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"item-icon\",\n icon: \"envelope\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 86,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 85,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"item-text\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"upper-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link\",\n children: \"Messages\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 90,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 89,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bottom-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link-bottom\",\n children: userInfo ? userInfo.email : \"...\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 95,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 94,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 88,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"arrow-right\",\n icon: \"chevron-right\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 101,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 100,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 84,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 83,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 115,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 58,\n columnNumber: 11\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 57,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 51,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 50,\n columnNumber: 5\n }, this);\n};\n\n_s(DropdownMenu, \"fSJPYre4v1rGcIZdck7wMJJU1dU=\", false, function () {\n return [useOktaAuth];\n});\n\n_c = DropdownMenu;\nexport default DropdownMenu;\n\nvar _c;\n\n$RefreshReg$(_c, \"DropdownMenu\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/components/navbar/dropdownMenu/NavbarDropdownMenu.jsx"],"names":["React","useRef","useState","useEffect","NavLink","useOktaAuth","FontAwesomeIcon","DropdownMenu","authState","oktaAuth","userInfo","setUserInfo","dropdownRef","isActive","setIsActive","onClick","pageClickEvent","e","current","contains","target","window","addEventListener","removeEventListener","isAuthenticated","getUser","then","info","logout","signOut","email"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react'\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { useOktaAuth } from '@okta/okta-react';\r\nimport \"./NavbarDropdownMenu.css\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\n\r\n\r\nconst DropdownMenu = () => {\r\n const { authState, oktaAuth } = useOktaAuth();\r\n const [userInfo, setUserInfo] = useState(null);\r\n\r\n const dropdownRef = useRef(null);\r\n const [isActive, setIsActive] = useState(false);\r\n const onClick = () => setIsActive(!isActive);\r\n\r\n useEffect(() => {\r\n const pageClickEvent = (e) => {\r\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\r\n setIsActive(!isActive);\r\n }\r\n };\r\n\r\n // If the item is active (ie open) then listen for clicks\r\n if (isActive) {\r\n window.addEventListener('click', pageClickEvent);\r\n }\r\n\r\n return () => {\r\n window.removeEventListener('click', pageClickEvent);\r\n }\r\n\r\n }, [isActive]);\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 {\r\n oktaAuth.getUser().then(info => {\r\n setUserInfo(info);\r\n });\r\n }\r\n }, [authState, oktaAuth]); // Update if authState changes\r\n\r\n const logout = () => {\r\n oktaAuth.signOut()\r\n }\r\n\r\n return (\r\n <li>\r\n <div className=\"navbar-user-dropdown-container\">\r\n <button className={`user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`} onClick={onClick} >\r\n <FontAwesomeIcon className=\"user-icon\" icon=\"user-circle\"></FontAwesomeIcon>\r\n <FontAwesomeIcon className=\"down-arrow\" icon=\"angle-down\"></FontAwesomeIcon>\r\n </button>\r\n {/* show submenu?*/}\r\n <div ref={dropdownRef} className={`user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`}>\r\n <ul>\r\n\r\n <li>\r\n <div className=\"menu-item\">\r\n <div>\r\n <FontAwesomeIcon className=\"arrow-right\" icon=\"user-circle\"></FontAwesomeIcon>\r\n </div>\r\n <div className=\"item-text\">\r\n <div className=\"upper-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link\">\r\n Account\r\n </NavLink>\r\n </div>\r\n <div className=\"bottom-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link-bottom\">\r\n {userInfo ? userInfo.email : \"...\"}\r\n </NavLink>\r\n </div>\r\n </div>\r\n <div>\r\n <FontAwesomeIcon className=\"arrow-right\" icon=\"chevron-right\"></FontAwesomeIcon>\r\n </div>\r\n </div>\r\n </li>\r\n\r\n <li>\r\n <div className=\"menu-item\">\r\n <div>\r\n <FontAwesomeIcon className=\"item-icon\" icon=\"envelope\"></FontAwesomeIcon>\r\n </div>\r\n <div className=\"item-text\">\r\n <div className=\"upper-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link\">\r\n Messages\r\n </NavLink>\r\n </div>\r\n <div className=\"bottom-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link-bottom\">\r\n {userInfo ? userInfo.email : \"...\"}\r\n </NavLink>\r\n </div>\r\n </div>\r\n <div>\r\n <FontAwesomeIcon className=\"arrow-right\" icon=\"chevron-right\"></FontAwesomeIcon>\r\n </div>\r\n </div>\r\n {/* <NavLink to=\"/messages\">\r\n \r\n </NavLink> */}\r\n </li>\r\n\r\n {/* <li>\r\n <a href=\"./\">\r\n <FontAwesomeIcon icon=\"sliders-h\"></FontAwesomeIcon>&nbsp;&nbsp;Preferences\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </a>\r\n </li> */}\r\n <li>\r\n {/* <a onClick={logout}>\r\n <FontAwesomeIcon icon=\"sign-out-alt\"></FontAwesomeIcon>&nbsp;&nbsp;Log out\r\n </a> */}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </li >\r\n )\r\n}\r\n\r\nexport default DropdownMenu"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\components\\\\navbar\\\\dropdownMenu\\\\NavbarDropdownMenu.jsx\",\n _s = $RefreshSig$();\n\nimport React, { useRef, useState, useEffect } from 'react';\nimport { NavLink } from \"react-router-dom\";\nimport { useOktaAuth } from '@okta/okta-react';\nimport \"./NavbarDropdownMenu.css\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst DropdownMenu = () => {\n _s();\n\n const {\n authState,\n oktaAuth\n } = useOktaAuth();\n const [userInfo, setUserInfo] = useState(null);\n const dropdownRef = useRef(null);\n const [isActive, setIsActive] = useState(false);\n\n const onClick = () => setIsActive(!isActive);\n\n useEffect(() => {\n const pageClickEvent = e => {\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\n setIsActive(!isActive);\n }\n }; // If the item is active (ie open) then listen for clicks\n\n\n if (isActive) {\n window.addEventListener('click', pageClickEvent);\n }\n\n return () => {\n window.removeEventListener('click', pageClickEvent);\n };\n }, [isActive]);\n useEffect(() => {\n if (!authState.isAuthenticated) {\n // When user isn't authenticated, forget any user info\n setUserInfo(null);\n } else {\n oktaAuth.getUser().then(info => {\n setUserInfo(info);\n });\n }\n }, [authState, oktaAuth]); // Update if authState changes\n\n const logout = () => {\n oktaAuth.signOut();\n };\n\n return /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"navbar-user-dropdown-container\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n className: `user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`,\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"user-icon\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 53,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"down-arrow\",\n icon: \"angle-down\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 54,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 52,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n ref: dropdownRef,\n className: `user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`,\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: [/*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"user\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 61,\n columnNumber: 17\n }, this), \"\\xA0\\xA0\", /*#__PURE__*/_jsxDEV(\"p\", {\n children: \"Account\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 62,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 63,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"chevron-right\",\n className: \"arrow-right-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 64,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 60,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 59,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/messages\",\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"envelope\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 69,\n columnNumber: 17\n }, this), \"\\xA0\\xA0Messages\", /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"chevron-right\",\n className: \"arrow-right-icon\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 70,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 68,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 67,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"a\", {\n onClick: logout,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n icon: \"sign-out-alt\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 81,\n columnNumber: 17\n }, this), \"\\xA0\\xA0Log out\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 80,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 79,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 58,\n columnNumber: 11\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 57,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 51,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 50,\n columnNumber: 5\n }, this);\n};\n\n_s(DropdownMenu, \"fSJPYre4v1rGcIZdck7wMJJU1dU=\", false, function () {\n return [useOktaAuth];\n});\n\n_c = DropdownMenu;\nexport default DropdownMenu;\n\nvar _c;\n\n$RefreshReg$(_c, \"DropdownMenu\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/components/navbar/dropdownMenu/NavbarDropdownMenu.jsx"],"names":["React","useRef","useState","useEffect","NavLink","useOktaAuth","FontAwesomeIcon","DropdownMenu","authState","oktaAuth","userInfo","setUserInfo","dropdownRef","isActive","setIsActive","onClick","pageClickEvent","e","current","contains","target","window","addEventListener","removeEventListener","isAuthenticated","getUser","then","info","logout","signOut"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react'\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { useOktaAuth } from '@okta/okta-react';\r\nimport \"./NavbarDropdownMenu.css\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\n\r\n\r\nconst DropdownMenu = () => {\r\n const { authState, oktaAuth } = useOktaAuth();\r\n const [userInfo, setUserInfo] = useState(null);\r\n\r\n const dropdownRef = useRef(null);\r\n const [isActive, setIsActive] = useState(false);\r\n const onClick = () => setIsActive(!isActive);\r\n\r\n useEffect(() => {\r\n const pageClickEvent = (e) => {\r\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\r\n setIsActive(!isActive);\r\n }\r\n };\r\n\r\n // If the item is active (ie open) then listen for clicks\r\n if (isActive) {\r\n window.addEventListener('click', pageClickEvent);\r\n }\r\n\r\n return () => {\r\n window.removeEventListener('click', pageClickEvent);\r\n }\r\n\r\n }, [isActive]);\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 {\r\n oktaAuth.getUser().then(info => {\r\n setUserInfo(info);\r\n });\r\n }\r\n }, [authState, oktaAuth]); // Update if authState changes\r\n\r\n const logout = () => {\r\n oktaAuth.signOut()\r\n }\r\n\r\n return (\r\n <li>\r\n <div className=\"navbar-user-dropdown-container\">\r\n <button className={`user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`} onClick={onClick} >\r\n <FontAwesomeIcon className=\"user-icon\" icon=\"user-circle\"></FontAwesomeIcon>\r\n <FontAwesomeIcon className=\"down-arrow\" icon=\"angle-down\"></FontAwesomeIcon>\r\n </button>\r\n {/* show submenu?*/}\r\n <div ref={dropdownRef} className={`user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`}>\r\n <ul>\r\n <li>\r\n <NavLink to=\"/account\" onClick={onClick}>\r\n <FontAwesomeIcon icon=\"user\"></FontAwesomeIcon>&nbsp;&nbsp;\r\n <p>Account</p>\r\n <p></p>\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </NavLink>\r\n </li>\r\n <li>\r\n <NavLink to=\"/messages\" onClick={onClick}>\r\n <FontAwesomeIcon icon=\"envelope\"></FontAwesomeIcon>&nbsp;&nbsp;Messages\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </NavLink>\r\n </li>\r\n {/* <li>\r\n <a href=\"./\">\r\n <FontAwesomeIcon icon=\"sliders-h\"></FontAwesomeIcon>&nbsp;&nbsp;Preferences\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"arrow-right-icon\"></FontAwesomeIcon>\r\n </a>\r\n </li> */}\r\n <li>\r\n <a onClick={logout}>\r\n <FontAwesomeIcon icon=\"sign-out-alt\"></FontAwesomeIcon>&nbsp;&nbsp;Log out\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </li >\r\n )\r\n}\r\n\r\nexport default DropdownMenu"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Bruger\\\\Desktop\\\\Web-projects\\\\pipit\\\\client\\\\src\\\\components\\\\navbar\\\\dropdownMenu\\\\NavbarDropdownMenu.jsx\",\n _s = $RefreshSig$();\n\nimport React, { useRef, useState, useEffect } from 'react';\nimport { NavLink } from \"react-router-dom\";\nimport { useOktaAuth } from '@okta/okta-react';\nimport \"./NavbarDropdownMenu.css\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst DropdownMenu = () => {\n _s();\n\n const {\n authState,\n oktaAuth\n } = useOktaAuth();\n const [userInfo, setUserInfo] = useState(null);\n const dropdownRef = useRef(null);\n const [isActive, setIsActive] = useState(false);\n\n const onClick = () => setIsActive(!isActive);\n\n useEffect(() => {\n const pageClickEvent = e => {\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\n setIsActive(!isActive);\n }\n }; // If the item is active (ie open) then listen for clicks\n\n\n if (isActive) {\n window.addEventListener('click', pageClickEvent);\n }\n\n return () => {\n window.removeEventListener('click', pageClickEvent);\n };\n }, [isActive]);\n useEffect(() => {\n if (!authState.isAuthenticated) {\n // When user isn't authenticated, forget any user info\n setUserInfo(null);\n } else {\n oktaAuth.getUser().then(info => {\n setUserInfo(info);\n });\n }\n }, [authState, oktaAuth]); // Update if authState changes\n\n const logout = () => {\n oktaAuth.signOut();\n };\n\n return /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"navbar-user-dropdown-container\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n className: `user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`,\n onClick: onClick,\n children: [/*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"user-icon\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 53,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"down-arrow\",\n icon: \"angle-down\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 54,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 52,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n ref: dropdownRef,\n className: `user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`,\n children: /*#__PURE__*/_jsxDEV(\"ul\", {\n children: [/*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"menu-item\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"item-text\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"upper-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link\",\n children: \"Account\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 64,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 63,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bottom-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link-bottom\",\n children: userInfo ? userInfo.email : \"...\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 69,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 68,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 62,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"item-icon\",\n icon: \"user-circle\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 75,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 74,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 61,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 60,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"menu-item\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"item-text\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"upper-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link\",\n children: \"Messages\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 84,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 83,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bottom-row\",\n children: /*#__PURE__*/_jsxDEV(NavLink, {\n to: \"/account\",\n className: \"menu-item-link-bottom\",\n children: userInfo ? userInfo.email : \"...\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 89,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 88,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 82,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n className: \"item-icon\",\n icon: \"chevron-right\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 95,\n columnNumber: 19\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 94,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 81,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 80,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"li\", {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 109,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 58,\n columnNumber: 11\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 57,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 51,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 50,\n columnNumber: 5\n }, this);\n};\n\n_s(DropdownMenu, \"fSJPYre4v1rGcIZdck7wMJJU1dU=\", false, function () {\n return [useOktaAuth];\n});\n\n_c = DropdownMenu;\nexport default DropdownMenu;\n\nvar _c;\n\n$RefreshReg$(_c, \"DropdownMenu\");","map":{"version":3,"sources":["C:/Users/Bruger/Desktop/Web-projects/pipit/client/src/components/navbar/dropdownMenu/NavbarDropdownMenu.jsx"],"names":["React","useRef","useState","useEffect","NavLink","useOktaAuth","FontAwesomeIcon","DropdownMenu","authState","oktaAuth","userInfo","setUserInfo","dropdownRef","isActive","setIsActive","onClick","pageClickEvent","e","current","contains","target","window","addEventListener","removeEventListener","isAuthenticated","getUser","then","info","logout","signOut","email"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react'\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { useOktaAuth } from '@okta/okta-react';\r\nimport \"./NavbarDropdownMenu.css\"\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\n\r\n\r\nconst DropdownMenu = () => {\r\n const { authState, oktaAuth } = useOktaAuth();\r\n const [userInfo, setUserInfo] = useState(null);\r\n\r\n const dropdownRef = useRef(null);\r\n const [isActive, setIsActive] = useState(false);\r\n const onClick = () => setIsActive(!isActive);\r\n\r\n useEffect(() => {\r\n const pageClickEvent = (e) => {\r\n if (dropdownRef.current !== null && !dropdownRef.current.contains(e.target)) {\r\n setIsActive(!isActive);\r\n }\r\n };\r\n\r\n // If the item is active (ie open) then listen for clicks\r\n if (isActive) {\r\n window.addEventListener('click', pageClickEvent);\r\n }\r\n\r\n return () => {\r\n window.removeEventListener('click', pageClickEvent);\r\n }\r\n\r\n }, [isActive]);\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 {\r\n oktaAuth.getUser().then(info => {\r\n setUserInfo(info);\r\n });\r\n }\r\n }, [authState, oktaAuth]); // Update if authState changes\r\n\r\n const logout = () => {\r\n oktaAuth.signOut()\r\n }\r\n\r\n return (\r\n <li>\r\n <div className=\"navbar-user-dropdown-container\">\r\n <button className={`user-dropdown-menu-toggle-button ${isActive ? 'active' : 'inactive'}`} onClick={onClick} >\r\n <FontAwesomeIcon className=\"user-icon\" icon=\"user-circle\"></FontAwesomeIcon>\r\n <FontAwesomeIcon className=\"down-arrow\" icon=\"angle-down\"></FontAwesomeIcon>\r\n </button>\r\n {/* show submenu?*/}\r\n <div ref={dropdownRef} className={`user-dropDown-menu-content ${isActive ? 'active' : 'inactive'}`}>\r\n <ul>\r\n\r\n <li>\r\n <div className=\"menu-item\">\r\n <div className=\"item-text\">\r\n <div className=\"upper-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link\">\r\n Account\r\n </NavLink>\r\n </div>\r\n <div className=\"bottom-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link-bottom\">\r\n {userInfo ? userInfo.email : \"...\"}\r\n </NavLink>\r\n </div>\r\n </div>\r\n <div>\r\n <FontAwesomeIcon className=\"item-icon\" icon=\"user-circle\"></FontAwesomeIcon>\r\n </div>\r\n </div>\r\n </li>\r\n\r\n <li>\r\n <div className=\"menu-item\">\r\n <div className=\"item-text\">\r\n <div className=\"upper-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link\">\r\n Messages\r\n </NavLink>\r\n </div>\r\n <div className=\"bottom-row\">\r\n <NavLink to=\"/account\" className=\"menu-item-link-bottom\">\r\n {userInfo ? userInfo.email : \"...\"}\r\n </NavLink>\r\n </div>\r\n </div>\r\n <div>\r\n <FontAwesomeIcon className=\"item-icon\" icon=\"chevron-right\"></FontAwesomeIcon>\r\n </div>\r\n </div>\r\n {/* <NavLink to=\"/messages\">\r\n \r\n </NavLink> */}\r\n </li>\r\n\r\n {/* <li>\r\n <a href=\"./\">\r\n <FontAwesomeIcon icon=\"sliders-h\"></FontAwesomeIcon>&nbsp;&nbsp;Preferences\r\n <FontAwesomeIcon icon=\"chevron-right\" className=\"item-icon-icon\"></FontAwesomeIcon>\r\n </a>\r\n </li> */}\r\n <li>\r\n {/* <a onClick={logout}>\r\n <FontAwesomeIcon icon=\"sign-out-alt\"></FontAwesomeIcon>&nbsp;&nbsp;Log out\r\n </a> */}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </li >\r\n )\r\n}\r\n\r\nexport default DropdownMenu"]},"metadata":{},"sourceType":"module"}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment