export default function returns undefined value in ReactJS

ok, so, I want to separate my security related functions in a separate functional component. For this I ended up creating the below functional component

import { useAuthDispatch, logout, useAuthState } from "../context/context";    const AppSecurity = () => {          const isAdminUser = () => {      console.log("+++ isAdminUser called...");      return true;    };      const isSuperUser = () => {      console.log("+++ isSuperUser called...");      return true;    };  };    export default AppSecurity;  

The grand plan is to implement both isAdminUser and isSuperUser functions eventually to go through security contexts and return true or false based on the logged in user but that's later some time. My current issue is when I import this AppSecurity functional component is other functional component and try to access the isAdminUser and isSuperUser functions, I get undefined values...see below

import AppSecurity from '../../utils/security'    function Header() {      const isAdminUser = AppSecurity.isAdminUser;    const isSuperUser = AppSecurity.isSuperUser;      console.log('isAdminUser : ', isAdminUser)    console.log('isAdminUser : ', isSuperUser)  }    export default Header;  

in the above code BOTH console log returns 'undefined' values. I am also noticing that none of the console logging inside those 2 functions within the AppSecurity shows up. I tried to change the way I access those two functions in my Header as per below and getting webpack error that those are not functions ....Any idea?

const isAdminUser = AppSecurity.isAdminUser();  const isSuperUser = AppSecurity.isSuperUser();  

see below webpack error ...

TypeError: _utils_security__WEBPACK_IMPORTED_MODULE_17__.default.isAdminUser is not a function  Header  src/components/ui/header.component.jsx:200      > 200 | const isAdminUser = AppSecurity.isAdminUser();        | ^  201 | const isSuperUser = AppSecurity.isSuperUser();    202 | console.log('isAdminUser : ', isAdminUser)    203 | const toggleDrawer = () => {  

https://stackoverflow.com/questions/66937370/export-default-function-returns-undefined-value-in-reactjs April 04, 2021 at 09:52AM