\r\n \r\n
\r\n );\r\n}\r\n```\r\n\r\n| Returning Modules | Description |\r\n| ----------------- | ------------------------------------------------- |\r\n| `login` | (login) function for trigger login/authentication |\r\n\r\n| Parameters | Description |\r\n| ------------- | ---------------------------------------------------- |\r\n| `[loginType]` | (default: loginRedirect) loginRedirect or loginPopup |\r\n\r\n### āļø Logout\r\n\r\n```javascript\r\nimport { useLogout } from '@calvear/react-azure-msal-security';\r\n\r\n// react component\r\nexport default () => {\r\n const logout = useLogout();\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n};\r\n```\r\n\r\n| Returning Modules | Description |\r\n| ----------------- | ------------------- |\r\n| `logout` | function for logout |\r\n\r\n### āļø Acquire Token\r\n\r\nYou can acquire a JWT access token for API securing.\r\n\r\n```javascript\r\nimport { useState, useEffect } from 'react';\r\nimport { useAcquireToken } from '@calvear/react-azure-msal-security';\r\n\r\n// react component\r\nexport default () => {\r\n const [token, setToken] = useState();\r\n const { authenticated } = useAuthentication();\r\n // use it only if authentication was succeeded\r\n const acquireToken = useAcquireToken();\r\n\r\n useEffect(() => {\r\n if (authenticated) {\r\n acquireToken().then((tkn) => setToken(tkn));\r\n }\r\n }, [authenticated]);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n```\r\n\r\n| Returning Modules | Description |\r\n| ----------------- | ------------------------------------------ |\r\n| `acquireToken` | async function for acquire an access token |\r\n\r\n| Parameters | Description |\r\n| --------------------- | --------------------------------------------------------------- |\r\n| `[forceTokenRefresh]` | (default: false) - forces to renew token from active directory. |\r\n\r\n### āļø Graph Info\r\n\r\nYou can retrieves user account detailed info and profile avatar from Microsoft Graph api with hooks.\r\n\r\n```javascript\r\nimport { useAccountInfo } from '@calvear/react-azure-msal-security';\r\n\r\n// react component\r\nexport default () => {\r\n const { loading, info, error } = useAccountInfo();\r\n\r\n if (loading) return Welcome to My App
\r\nLoading User Info...
;\r\n\r\n if (error) return User info cannot be loaded: {error.message}
;\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n```\r\n\r\n| Returning Modules | Description |\r\n| ----------------- | ---------------------- |\r\n| `state` | object with info state |\r\n| `state.loading` | if info is loading |\r\n| `state.info` | account info |\r\n| `state.error` | error object |\r\n\r\n```javascript\r\nimport { useAccountAvatar } from '@calvear/react-azure-msal-security';\r\n\r\n// react component\r\nexport default () => {\r\n const { loading, avatar, error } = useAccountAvatar();\r\n\r\n if (loading) return User Info
\r\nName: {info.displayName}
\r\nLoading User Avatar...
;\r\n\r\n if (error) return User avatar cannot be loaded: {error.message}
;\r\n\r\n return (\r\n \r\n 
\r\n
\r\n );\r\n};\r\n```\r\n\r\n| Returning Modules | Description |\r\n| ----------------- | ------------------------ |\r\n| `state` | object with avatar state |\r\n| `state.loading` | if avatar is loading |\r\n| `state.avatar` | account avatar in base64 |\r\n| `state.error` | error object |\r\n\r\n| Parameters | Description |\r\n| ------------ | ------------------------------------------------------------------------------------------------------------------------- |\r\n| `[size]` | (default: 648x648) avatar sizes. Values maybe 48x48, 64x64, 96x96, 120x120, 240x240, 360x360, 432x432, 504x504 or 648x648 |\r\n\r\n## Linting š§æ\r\n\r\nProject uses ESLint, for code formatting and code styling normalizing.\r\n\r\n- **eslint**: JavaScript and React linter with Airbnb React base config and some other additions.\r\n- **prettier**: optional Prettier config.\r\n\r\nFor correct interpretation of linters, is recommended to use [Visual Studio Code](https://code.visualstudio.com/) as IDE and install the plugins in .vscode folder at 'extensions.json', as well as use the config provided in 'settings.json'\r\n\r\n## Changelog š\r\n\r\nFor last changes see [CHANGELOG.md](CHANGELOG.md) file for details.\r\n\r\n## Built with š ļø\r\n\r\n- [React](https://reactjs.org/) - the most fabulous JavaScript framework.\r\n- [MSAL](https://github.com/AzureAD/microsoft-authentication-library-for-js) - Microsoft Authentication Library for JavaScript.\r\n- [axios](https://github.com/axios/axios) - Promise based HTTP client.\r\n\r\n## License š\r\n\r\nThis project is licensed under the MIT License - see [LICENSE.md](LICENSE.md) file for details.\r\n\r\n---\r\n\r\nāØ by [Alvear Candia, Cristopher Alejandro](https://github.com/calvear93)\r\n","readmeFilename":"README.md"}