-
-
Notifications
You must be signed in to change notification settings - Fork 29
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add Auth0 React SDK * Activate Auth0 context (with values from environment) * Make use of refresh tokens * Stop stripping query parameters off of the URL upon redirect * Initial elements to allow for login and display avatar * Use Github icon for login button * Confirm non-null state before dereferencing * Add context menu to display name and logout button * Change logout to roll to configured URL or fallback to window origin * Use Octokit mock only when we're in a testing environment * Update yarn lockfile * Default arguments to empty object * Add Accept: header for Github API calls * Add HTTP request header for authorization * Use access token to make request for comments * Do not raise a popup for retrieving Auth0 access token * Send access token on remote call TODO: Refactor into single function to avoid eliminate duplication * Fix arguments passed to Octokit * Allow GitHub base URL to be set via an environment variable * No-op commit * Remove commented out code (Octokit instantiation) * Update esbuild configuration to pass along null if no redirect URI provided * Update size of GitHub avatar to be in line with new UI * Update dependency lock file * Correct capitalization of GitHub * Create store member for GitHub access token * Use access token from internal store * Retrieve access token upon application load (if available) * Remove debug console logging * No need to destructure Zustand state value * Conditionally set authorization when requesting IFC * Add missing useEffect dependency * New function to parse GitHub repository URLs * Do not prepend leading slash when returning path * New function to get object direct download URL * Ensure exceptions are bubbled up from Octokit * Use boolean variable to reflect whether this is a new file * Add utility functions to get target IFC URL * Perform IFC URL "pre-resolution" only if we're logged in * Let downstream handle mapping of target GitHub host * Move repository URL resolution functions outside of component * Remove access token comparison from conditional * Add escape hatch for IFCs hosted in this repository * Add missing hook dependency for access token * Add missing argument in child function * Don't attempt to load viewer why authentication is happening * Do not allow cached responses for download URL retrieval Related to octokit/discussions#13 * Replace existing path and reload page upon Auth0 login * Add existing path for login redirect * Fix ESLint errors * Replace ESLint rule suppression with newlines * Reintroduce URL transform logic * Migrate to v2 provider syntax * Change Auth0 scope request to offline access * Disable refresh tokens (temporarily) * Remove duplicate Share button introduced by merge * Use leading slash on file paths in tests * Fix inconsistent labeling and title of login button * Create set of mocks for authentication-based rendering * Add unit tests for rendering the authentication navigation component * Replace external image with inlined data
- Loading branch information
Showing
20 changed files
with
725 additions
and
35 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| import React from 'react' | ||
| import {useNavigate} from 'react-router-dom' | ||
| import {Auth0Provider} from '@auth0/auth0-react' | ||
|
|
||
|
|
||
| export const Auth0ProviderWithHistory = ({children}) => { | ||
| const navigate = useNavigate() | ||
| const onRedirect = (state) => { | ||
| navigate(state && state.returnTo ? state.returnTo : window.location.pathname, {replace: true}) | ||
| navigate(0) | ||
| } | ||
|
|
||
| return ( | ||
| <Auth0Provider | ||
| domain={process.env.AUTH0_DOMAIN} | ||
| clientId={process.env.OAUTH2_CLIENT_ID} | ||
| authorizationParams={{ | ||
| audience: 'https://api.github.com/', | ||
| scope: 'openid profile email offline_access repo', | ||
| redirect_uri: process.env.OAUTH2_REDIRECT_URI || window.location.origin, | ||
| }} | ||
| cacheLocation={'localstorage'} | ||
| onRedirectCallback={onRedirect} | ||
| useRefreshTokens={false} | ||
| > | ||
| {children} | ||
| </Auth0Provider> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import React from 'react' | ||
| import {useAuth0} from '@auth0/auth0-react' | ||
| import {CircularProgress} from '@material-ui/core' | ||
| import LoginButton from './LoginButton' | ||
| import UserProfile from './UserProfile' | ||
|
|
||
|
|
||
| const AuthNav = () => { | ||
| const {isLoading, isAuthenticated} = useAuth0() | ||
|
|
||
| if (isLoading) { | ||
| return <CircularProgress/> | ||
| } | ||
|
|
||
| return isAuthenticated ? | ||
| <UserProfile/> : | ||
| <LoginButton/> | ||
| } | ||
|
|
||
| export default AuthNav |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import React from 'react' | ||
| import {render, screen} from '@testing-library/react' | ||
| import {mockedUseAuth0, mockedUserLoggedIn, mockedUserLoggedOut} from '../__mocks__/authentication' | ||
| import AuthNav from './AuthNav' | ||
|
|
||
|
|
||
| describe('AuthNav', () => { | ||
| it('renders the login button when not logged in', () => { | ||
| mockedUseAuth0.mockReturnValue(mockedUserLoggedOut) | ||
|
|
||
| render(<AuthNav/>) | ||
| const loginButton = screen.getByTitle(/Log in with GitHub/i) | ||
| expect(loginButton).toBeInTheDocument() | ||
| }) | ||
|
|
||
| it('renders the user avatar when logged in', () => { | ||
| mockedUseAuth0.mockReturnValue(mockedUserLoggedIn) | ||
|
|
||
| render(<AuthNav/>) | ||
| const avatarImage = screen.getByAltText(/Unit Testing/i) | ||
| expect(avatarImage).toBeInTheDocument() | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| import React from 'react' | ||
| import {useAuth0} from '@auth0/auth0-react' | ||
| import {TooltipIconButton} from './Buttons' | ||
| import GitHubIcon from '@mui/icons-material/GitHub' | ||
|
|
||
|
|
||
| const LoginButton = ({ | ||
| title = 'Log in with GitHub', | ||
| placement = 'right', | ||
| ...props | ||
| }) => { | ||
| const {loginWithRedirect} = useAuth0() | ||
|
|
||
| const onClick = async () => { | ||
| await loginWithRedirect({ | ||
| appState: { | ||
| returnTo: window.location.pathname, | ||
| }, | ||
| }) | ||
| } | ||
|
|
||
| return ( | ||
| <TooltipIconButton | ||
| title={'Log in with GitHub'} | ||
| icon={<GitHubIcon/>} | ||
| onClick={onClick} | ||
| /> | ||
| ) | ||
| } | ||
|
|
||
| export default LoginButton |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,85 @@ | ||
| import React from 'react' | ||
| import {useAuth0} from '@auth0/auth0-react' | ||
| import Avatar from '@mui/material/Avatar' | ||
| import MenuItem from '@mui/material/MenuItem' | ||
| import ListItemIcon from '@mui/material/ListItemIcon' | ||
| import Divider from '@mui/material/Divider' | ||
| import Logout from '@mui/icons-material/Logout' | ||
| import Typography from '@mui/material/Typography' | ||
| import { | ||
| usePopupState, | ||
| bindTrigger, | ||
| bindMenu, | ||
| } from 'material-ui-popup-state/hooks' | ||
| import IconButton from '@mui/material/IconButton' | ||
| import Menu from '@mui/material/Menu' | ||
| import GitHubIcon from '@mui/icons-material/GitHub' | ||
|
|
||
|
|
||
| const UserProfile = ({size = 'medium'}) => { | ||
| const {user, isAuthenticated, logout} = useAuth0() | ||
| const popupState = usePopupState({ | ||
| variant: 'popup', | ||
| popupId: 'user-profile', | ||
| }) | ||
|
|
||
| return isAuthenticated && ( | ||
| <> | ||
| <IconButton className={'no-hover'} {...bindTrigger(popupState)}> | ||
| <Avatar | ||
| alt={user.name} | ||
| src={user.picture} | ||
| sx={{width: 22, height: 22}} | ||
| /> | ||
| </IconButton> | ||
|
|
||
| <Menu | ||
| PaperProps={{ | ||
| sx: { | ||
| 'filter': 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))', | ||
| 'mt': 1.5, | ||
| '& .MuiAvatar-root': { | ||
| width: 32, | ||
| height: 32, | ||
| ml: -0.5, | ||
| mr: 1, | ||
| }, | ||
| '&:before': { | ||
| content: '""', | ||
| display: 'block', | ||
| position: 'absolute', | ||
| top: 0, | ||
| right: 14, | ||
| width: 10, | ||
| height: 10, | ||
| bgcolor: 'background.paper', | ||
| transform: 'translateY(-50%) rotate(45deg)', | ||
| zIndex: 0, | ||
| }, | ||
| }, | ||
| }} | ||
| {...bindMenu(popupState)} | ||
| > | ||
| <MenuItem> | ||
| <ListItemIcon sx={{display: 'flex', alignItems: 'center'}}> | ||
| <GitHubIcon/> | ||
| <Typography sx={{paddingLeft: '11px'}}> | ||
| Hi, {user.name}! | ||
| </Typography> | ||
| </ListItemIcon> | ||
| </MenuItem> | ||
| <Divider/> | ||
| <MenuItem onClick={() => logout({returnTo: process.env.OAUTH2_REDIRECT_URI || window.location.origin})}> | ||
| <ListItemIcon> | ||
| <Logout/> | ||
| <Typography sx={{paddingLeft: '11px'}}> | ||
| Logout | ||
| </Typography> | ||
| </ListItemIcon> | ||
| </MenuItem> | ||
| </Menu> | ||
| </> | ||
| ) | ||
| } | ||
|
|
||
| export default UserProfile |
Oops, something went wrong.