Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
O
order-management-react
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Ascend
order-management-react
Commits
71ce6310
Commit
71ce6310
authored
May 06, 2021
by
Alex Segers
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
[AFP-97]
♻
️ Refactor Nav auth link to be dynamic + cleanup AuthPage & App (
@asegers
)
parent
001fd9e0
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
16 additions
and
67 deletions
+16
-67
App.tsx
src/App.tsx
+4
-5
Nav.tsx
src/components/Nav.tsx
+10
-3
AuthPage.tsx
src/pages/AuthPage.tsx
+2
-59
No files found.
src/App.tsx
View file @
71ce6310
import
React
from
'react'
;
import
{
MainRouter
}
from
'router'
;
import
MainRouter
from
'router/MainRouter'
;
function
App
()
{
function
App
()
{
return
(
return
(
<
div
className=
"App"
>
<
div
className=
"App"
>
<
MainRouter
/>
<
MainRouter
/>
</
div
>
</
div
>
);
);
}
}
...
...
src/components/Nav.tsx
View file @
71ce6310
import
React
from
'react'
import
React
,
{
useMemo
}
from
'react'
import
{
Link
}
from
'react-router-dom'
import
{
Link
}
from
'react-router-dom'
import
{
useGoogleAuth
}
from
'hooks'
const
Nav
=
()
=>
{
const
Nav
=
()
=>
{
const
{
isSignedIn
,
signOut
,
signIn
}
=
useGoogleAuth
();
const
handleAuth
=
()
=>
{
isSignedIn
?
signOut
()
:
signIn
();}
const
authLinkText
=
useMemo
(()
=>
isSignedIn
?
"Logout"
:
"Login"
,
[
isSignedIn
]);
return
(
return
(
<
header
className=
"nav-bar"
role=
"navigation"
>
<
header
className=
"nav-bar"
role=
"navigation"
>
<
div
className=
"order-management"
>
Order Management Console PRO
</
div
>
<
div
className=
"order-management"
>
Order Management Console PRO
</
div
>
<
ul
className=
"nav-list"
>
<
ul
className=
"nav-list"
>
<
li
><
Link
className=
"nav-link"
to=
"/orders"
>
All orders
</
Link
></
li
>
<
li
><
Link
className=
"nav-link"
to=
"/orders"
>
All orders
</
Link
></
li
>
<
li
><
Link
className=
"nav-link"
to=
"/account"
>
(account logo here)
</
Link
></
li
>
<
li
><
Link
className=
"nav-link"
to=
"/account"
>
(account logo here)
</
Link
></
li
>
<
li
><
Link
className=
"nav-link"
to=
"/"
>
Login / Logout
</
Link
></
li
>
<
li
><
button
onClick=
{
handleAuth
}
>
{
authLinkText
}
</
button
></
li
>
</
ul
>
</
ul
>
</
header
>
</
header
>
)
)
...
...
src/pages/AuthPage.tsx
View file @
71ce6310
import
React
from
'react'
import
{
LoginForm
}
from
'components'
;
import
{
GoogleLogin
}
from
'react-google-login'
;
const
AuthPage
=
()
=>
{
const
AuthPage
=
()
=>
{
const
responseGoogle
=
(
response
:
any
)
=>
{
// console.log(response)
// console.log(response.profileObj);
// console.log(response.tokenObj);
const
{
email
,
familyName
:
lastName
,
givenName
:
firstName
,
googleId
,
imageUrl
}
=
response
.
profileObj
;
return
({
email
,
firstName
,
lastName
,
googleId
,
imageUrl
})
}
return
(
return
(
<
div
>
<
div
>
<
GoogleLogin
<
h1
>
Welcome
</
h1
>
clientId=
"925243198137-hhe2e3ejlethf321hh7tbm7ontc19cpj.apps.googleusercontent.com"
buttonText=
"Login"
onSuccess=
{
responseGoogle
}
onFailure=
{
responseGoogle
}
cookiePolicy=
{
'single_host_origin'
}
/>
</
div
>
</
div
>
)
)
}
}
export
default
AuthPage
export
default
AuthPage
\ No newline at end of file
/*
Google Successful OAuth response (The parts we want to keep, anyway):
response =>
response.profileObj = {
email: "kkaminski@nisum.com",
familyName: "Kaminski",
givenName: "Kevin",
googleId: "104324023295177405903",
imageUrl: "https://lh3.googleusercontent.com/a/AATXAJymxbs98AGxOFCVUCpV9pEwpxx1JWR6XZqKXe8b=s96-c",
name: "Kevin Kaminski"
}
response.tokenObj = {
access_token: "ya2...LCe",
expires_at: 1620238821414,
expires_in: 3599,
first_issued_at: 1620235222414,
id_token: "eyJhbGciOiJSUzI1NiIs...yXc6HOG97FF6eF1AU0Oh8w",
idpId: "google",
login_hint: "AJDLj6J...RcffTyHTSIHVKSQ",
scope: "email profile https://www.googleapis.com/auth/userinfo.email openid https://www.googleapis.com/auth/userinfo.profile",
session_state: {
extraQueryParams: {
authuser: 2
}
},
token_type: "bearer"
}
*/
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment