Skip to content

Commit ff50d61

Browse files
author
sw-yx
committed
rename to useIdentityContext
1 parent 16f3a04 commit ff50d61

File tree

4 files changed

+32
-20
lines changed

4 files changed

+32
-20
lines changed

README.md

+8-6
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ yarn add react-netlify-identity
3737

3838
⚠️ **Important:** You will need to have an active Netlify site running with Netlify Identity turned on. [Click here for instructions](https://www.netlify.com/docs/identity/#getting-started) to get started/double check that it is on. We will need your site's url (e.g. `https://mysite.netlify.com`) to initialize `IdentityContextProvider`.
3939

40-
**When you call useIdentityCtx()**, you can destructure these variables and methods:
40+
**When you call useIdentityContext()**, you can destructure these variables and methods:
4141

4242
- `user: User`
4343
- `setUser`: directly set the user object. Not advised; use carefully!! mostly you should use the methods below
@@ -58,7 +58,7 @@ import React from 'react';
5858
import { IdentityContextProvider } from 'react-netlify-identity';
5959

6060
function App() {
61-
const url = process.env.NETLIFY_URL; // supply the url of your Netlify site instance. VERY IMPORTANT
61+
const url = process.env.REACT_APP_NETLIFY_URL; // supply the url of your Netlify site instance. VERY IMPORTANT
6262
return (
6363
<IdentityContextProvider url={url}>
6464
{/* rest of your app */}
@@ -75,9 +75,11 @@ Click for More Example code
7575
</summary>
7676

7777
```tsx
78+
import { useIdentityContext } from 'react-netlify-identity';
79+
7880
// log in/sign up example
7981
function Login() {
80-
const { loginUser, signupUser } = useIdentityCtx();
82+
const { loginUser, signupUser } = useIdentityContext();
8183
const formRef = React.useRef();
8284
const [msg, setMsg] = React.useState('');
8385
const signup = () => {
@@ -128,13 +130,13 @@ function Login() {
128130

129131
// log out user
130132
function Logout() {
131-
const { logoutUser } = useIdentityCtx();
133+
const { logoutUser } = useIdentityContext();
132134
return <button onClick={logoutUser}>You are signed in. Log Out</button>;
133135
}
134136

135137
// check `identity.user` in a protected route
136138
function PrivateRoute(props) {
137-
const identity = useIdentityCtx();
139+
const identity = useIdentityContext();
138140
let { as: Comp, ...rest } = props;
139141
return identity.user ? (
140142
<Comp {...rest} />
@@ -150,7 +152,7 @@ function PrivateRoute(props) {
150152
// use authedFetch API to make a request to Netlify Function with the user's JWT token,
151153
// letting your function use the `user` object
152154
function Dashboard() {
153-
const { isConfirmedUser, authedFetch } = useIdentityCtx();
155+
const { isConfirmedUser, authedFetch } = useIdentityContext();
154156
const [msg, setMsg] = React.useState('Click to load something');
155157
const handler = () => {
156158
authedFetch.get('/.netlify/functions/authEndPoint').then(setMsg);

example-cra/src/App.tsx

+11-6
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { Router, Link, navigate } from '@reach/router';
33
import './App.css';
44
import {
5-
useIdentityCtx,
5+
useIdentityContext,
66
IdentityContextProvider,
77
// Settings,
88
} from 'react-netlify-identity';
@@ -14,7 +14,7 @@ function PrivateRoute(
1414
MaybePathProps & { as: React.ComponentType<MaybePathProps> }
1515
>
1616
) {
17-
const identity = useIdentityCtx();
17+
const identity = useIdentityContext();
1818
let { as: Comp } = props;
1919
return identity.user ? (
2020
<Comp />
@@ -28,7 +28,12 @@ function PrivateRoute(
2828

2929
// eslint-disable-next-line
3030
function Login({ }: MaybePathProps) {
31-
const { loginUser, signupUser, settings, loginProvider } = useIdentityCtx();
31+
const {
32+
loginUser,
33+
signupUser,
34+
settings,
35+
loginProvider,
36+
} = useIdentityContext();
3237
const formRef = React.useRef<HTMLFormElement>(null!);
3338
const [msg, setMsg] = React.useState('');
3439
const [isLoading, load] = useLoading();
@@ -154,7 +159,7 @@ function About({ }: MaybePathProps) {
154159
}
155160
// eslint-disable-next-line
156161
function Dashboard({ }: MaybePathProps) {
157-
const props = useIdentityCtx();
162+
const props = useIdentityContext();
158163
const { isConfirmedUser, authedFetch } = props;
159164
const [isLoading, load] = useLoading();
160165
const [msg, setMsg] = React.useState('Click to load something');
@@ -194,7 +199,7 @@ function Spinner() {
194199
);
195200
}
196201
function Nav() {
197-
const { isLoggedIn } = useIdentityCtx();
202+
const { isLoggedIn } = useIdentityContext();
198203
return (
199204
<nav>
200205
<Link to="/">Home</Link> | <Link to="dashboard">Dashboard</Link>
@@ -206,7 +211,7 @@ function Nav() {
206211
);
207212
}
208213
function Logout() {
209-
const { logoutUser } = useIdentityCtx();
214+
const { logoutUser } = useIdentityContext();
210215
return <button onClick={logoutUser}>You are signed in. Log Out</button>;
211216
}
212217

example/src/App.tsx

+11-6
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { Router, Link, navigate } from '@reach/router';
33
import './App.css';
44
import {
5-
useIdentityCtx,
5+
useIdentityContext,
66
IdentityContextProvider,
77
// Settings,
88
} from 'react-netlify-identity';
@@ -14,7 +14,7 @@ function PrivateRoute(
1414
MaybePathProps & { as: React.ComponentType<MaybePathProps> }
1515
>
1616
) {
17-
const identity = useIdentityCtx();
17+
const identity = useIdentityContext();
1818
let { as: Comp } = props;
1919
return identity.user ? (
2020
<Comp />
@@ -28,7 +28,12 @@ function PrivateRoute(
2828

2929
// eslint-disable-next-line
3030
function Login({ }: MaybePathProps) {
31-
const { loginUser, signupUser, settings, loginProvider } = useIdentityCtx();
31+
const {
32+
loginUser,
33+
signupUser,
34+
settings,
35+
loginProvider,
36+
} = useIdentityContext();
3237
const formRef = React.useRef<HTMLFormElement>(null!);
3338
const [msg, setMsg] = React.useState('');
3439
const [isLoading, load] = useLoading();
@@ -154,7 +159,7 @@ function About({ }: MaybePathProps) {
154159
}
155160
// eslint-disable-next-line
156161
function Dashboard({ }: MaybePathProps) {
157-
const props = useIdentityCtx();
162+
const props = useIdentityContext();
158163
const { isConfirmedUser, authedFetch } = props;
159164
const [isLoading, load] = useLoading();
160165
const [msg, setMsg] = React.useState('Click to load something');
@@ -194,7 +199,7 @@ function Spinner() {
194199
);
195200
}
196201
function Nav() {
197-
const { isLoggedIn } = useIdentityCtx();
202+
const { isLoggedIn } = useIdentityContext();
198203
return (
199204
<nav>
200205
<Link to="/">Home</Link> | <Link to="dashboard">Dashboard</Link>
@@ -206,7 +211,7 @@ function Nav() {
206211
);
207212
}
208213
function Logout() {
209-
const { logoutUser } = useIdentityCtx();
214+
const { logoutUser } = useIdentityContext();
210215
return <button onClick={logoutUser}>You are signed in. Log Out</button>;
211216
}
212217

src/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -63,10 +63,10 @@ export type ReactNetlifyIdentityAPI = {
6363
settings: Settings;
6464
};
6565

66-
const [_useIdentityCtx, _IdentityCtxProvider] = createCtx<
66+
const [_useIdentityContext, _IdentityCtxProvider] = createCtx<
6767
ReactNetlifyIdentityAPI
6868
>();
69-
export const useIdentityCtx = _useIdentityCtx; // we dont want to expose _IdentityCtxProvider
69+
export const useIdentityContext = _useIdentityContext; // we dont want to expose _IdentityCtxProvider
7070

7171
/** most people should use this provider directly */
7272
export function IdentityContextProvider({

0 commit comments

Comments
 (0)