Skip to content

Commit 3b88029

Browse files
author
sw-yx
committed
extract to runRoutes
1 parent 50ae246 commit 3b88029

File tree

3 files changed

+72
-22
lines changed

3 files changed

+72
-22
lines changed

example/src/App.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ function Login({ }: MaybePathProps) {
2727
const [setting, setSetting] = React.useState<Settings | null>(null)
2828
React.useEffect(() => {
2929
settings().then(x => setSetting(x))
30-
}, [])
30+
}, [settings])
3131
const signup = () => {
3232
const email = formRef.current.email.value
3333
const password = formRef.current.password.value

src/index.tsx

+10-21
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from "react"
22

33
import GoTrue, { User, Settings } from "gotrue-js"
4+
import { runRoutes } from "./runRoutes"
45

56
type authChangeParam = (user?: User) => string | void
67

@@ -16,6 +17,7 @@ export default function NetlifyIdentity({ children, domain, onAuthChange }: NIPr
1617
return children(useNetlifyIdentity(domain, onAuthChange))
1718
}
1819
export function useNetlifyIdentity(domain: string, onAuthChange: authChangeParam = () => {}) {
20+
/******** SETUP */
1921
if (!domain || !validateUrl(domain)) {
2022
// just a safety check in case a JS user tries to skip this
2123
throw new Error(
@@ -34,6 +36,13 @@ export function useNetlifyIdentity(domain: string, onAuthChange: authChangeParam
3436
return _user // so that we can continue chaining
3537
}
3638

39+
React.useEffect(() => {
40+
runRoutes(goTrueInstance, _setUser)
41+
}, [])
42+
43+
/******* OPERATIONS */
44+
// make sure the Registration preferences under Identity settings in your Netlify dashboard are set to Open.
45+
// https://react-netlify-identity.netlify.com/login#access_token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE1NTY0ODY3MjEsInN1YiI6ImNiZjY5MTZlLTNlZGYtNGFkNS1iOTYzLTQ4ZTY2NDcyMDkxNyIsImVtYWlsIjoic2hhd250aGUxQGdtYWlsLmNvbSIsImFwcF9tZXRhZGF0YSI6eyJwcm92aWRlciI6ImdpdGh1YiJ9LCJ1c2VyX21ldGFkYXRhIjp7ImF2YXRhcl91cmwiOiJodHRwczovL2F2YXRhcnMxLmdpdGh1YnVzZXJjb250ZW50LmNvbS91LzY3NjQ5NTc_dj00IiwiZnVsbF9uYW1lIjoic3d5eCJ9fQ.E8RrnuCcqq-mLi1_Q5WHJ-9THIdQ3ha1mePBKGhudM0&expires_in=3600&refresh_token=OyA_EdRc7WOIVhY7RiRw5w&token_type=bearer
3746
/******* external oauth */
3847
type Provider = "bitbucket" | "facebook" | "github" | "gitlab" | "google"
3948

@@ -45,8 +54,7 @@ export function useNetlifyIdentity(domain: string, onAuthChange: authChangeParam
4554
goTrueInstance.acceptInviteExternalUrl(provider, token)
4655
const settings: () => Promise<Settings> = goTrueInstance.settings.bind(goTrueInstance)
4756

48-
/******* OPERATIONS */
49-
// make sure the Registration preferences under Identity settings in your Netlify dashboard are set to Open.
57+
/******* email auth */
5058
const signupUser = (email: string, password: string, data: Object) =>
5159
goTrueInstance.signup(email, password, data).then(_setUser) // TODO: make setUser optional?
5260
const loginUser = (email: string, password: string, remember: boolean = true) =>
@@ -92,25 +100,6 @@ export function useNetlifyIdentity(domain: string, onAuthChange: authChangeParam
92100
delete: genericAuthedFetch("DELETE")
93101
}
94102

95-
// // confirmation
96-
// http://lea.verou.me/2011/05/get-your-hash-the-bulletproof-way/
97-
React.useEffect(() => {
98-
const hash = window.location.hash.substring(1)
99-
if (hash.slice(0, 19) === "confirmation_token=") {
100-
// we are in a confirmation!
101-
const token = hash.slice(19)
102-
goTrueInstance
103-
.confirm(token)
104-
.then(_setUser)
105-
.catch(console.error)
106-
// .then(
107-
// () =>
108-
// (window.location =
109-
// window.location.origin + window.location.pathname) // strip hash
110-
// )
111-
}
112-
}, [])
113-
114103
/******* hook API */
115104
return {
116105
user,

src/runRoutes.tsx

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import GoTrue, { User } from "gotrue-js"
2+
3+
/**
4+
* This code runs on every rerender so keep it light
5+
* keep checking the current route and do logic based on the route
6+
* as dictated by netlify identity's communication with us via hashes
7+
*/
8+
9+
const routes = /(confirmation|invite|recovery|email_change)_token=([^&]+)/
10+
const errorRoute = /error=access_denied&error_description=403/
11+
const accessTokenRoute = /access_token=/
12+
const confirmationRoute = /confirmation_token=/
13+
14+
export function runRoutes(gotrue: GoTrue, setUser: (value: User) => User | undefined, remember = true) {
15+
const hash = (document.location.hash || "").replace(/^#\/?/, "")
16+
if (!hash) return // early terminate if no hash
17+
18+
const m = hash.match(routes)
19+
if (m) {
20+
// store.verifyToken(m[1], m[2]);
21+
document.location.hash = ""
22+
}
23+
24+
const em = hash.match(errorRoute)
25+
if (em) {
26+
// store.openModal("signup");
27+
document.location.hash = ""
28+
}
29+
30+
const am = hash.match(accessTokenRoute)
31+
if (am) {
32+
const params = {}
33+
hash.split("&").forEach(pair => {
34+
const [key, value] = pair.split("=")
35+
params[key] = value
36+
})
37+
document.location.hash = ""
38+
// store.openModal("login");
39+
// store.completeExternalLogin(params);
40+
gotrue
41+
.createUser(params, remember)
42+
.then(setUser)
43+
.catch(console.error)
44+
}
45+
46+
const cm = hash.match(confirmationRoute)
47+
if (cm) {
48+
const params = {}
49+
hash.split("&").forEach(pair => {
50+
const [key, value] = pair.split("=")
51+
params[key] = value
52+
})
53+
document.location.hash = ""
54+
// store.openModal("login");
55+
// store.completeExternalLogin(params);
56+
gotrue
57+
.confirm(params["confirmation_token"])
58+
.then(setUser)
59+
.catch(console.error)
60+
}
61+
}

0 commit comments

Comments
 (0)