Skip to content

Commit 8e2abe0

Browse files
aaronpowellaaronpowell
committed
removing the terminology userInfo and using client principal, which aligns with official names
1 parent 9afdafd commit 8e2abe0

File tree

6 files changed

+105
-95
lines changed

6 files changed

+105
-95
lines changed

‎CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# Changelog for `react-static-web-apps-auth`
22

3+
## [1.2.0] - 2021-07-12
4+
5+
### Changed
6+
7+
- Removed remaining references to `UserInfo` and using `ClientPrincipal` instead
8+
39
## [1.1.0] - 2021-06-28
410

511
### Added

‎example/src/App.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ import "./App.css";
44
import {
55
Logout,
66
StaticWebAuthLogins,
7-
UserInfoContextProvider,
7+
ClientPrincipalContextProvider,
88
UserPurge,
9-
useUserInfo,
9+
useClientPrincipal,
1010
} from "@aaronpowell/react-static-web-apps-auth";
1111

1212
const UserDisplay = () => {
13-
const { clientPrincipal, loaded } = useUserInfo();
13+
const { clientPrincipal, loaded } = useClientPrincipal();
1414

1515
if (!loaded) {
1616
return <p>Checking user info...</p>;
@@ -57,9 +57,9 @@ function App() {
5757
label={(name) => `Do sign in ${name}`}
5858
/>
5959

60-
<UserInfoContextProvider>
60+
<ClientPrincipalContextProvider>
6161
<UserDisplay />
62-
</UserInfoContextProvider>
62+
</ClientPrincipalContextProvider>
6363
</header>
6464
</div>
6565
);

‎react-static-web-apps-auth/README.md

Lines changed: 76 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,76 @@
1-
# Static Web App Auth tools for React
2-
3-
![Node.js CI](https://github.com/aaronpowell/react-static-web-apps-auth/workflows/Node.js%20CI/badge.svg) | [![npm version](https://img.shields.io/npm/v/@aaronpowell/react-static-web-apps-auth)](https://npmjs.org/package/@aaronpowell/react-static-web-apps-auth)
4-
5-
This package is a series of helper tools for working with [Azure Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/?WT.mc_id=javascript-12079-aapowell) [Authentication and Authorization](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell) from React.
6-
7-
## Installation
8-
9-
You can install a stable release from npm:
10-
11-
```bash
12-
npm install @aaronpowell/react-static-web-apps-auth
13-
```
14-
15-
Or you can install the latest build from GitHub packages.
16-
17-
## Usage
18-
19-
The package contains some components that wrap the functionality for you.
20-
21-
### `<StaticWebAppsAuthLogins />`
22-
23-
```typescript
24-
const Login = () => {
25-
return (
26-
<div>
27-
<h2>Login to our site</h2>
28-
<StaticWebAppsAuthLogins aad={true} twitter={false} customProviders={[ id: "okta", name: "Okta" ]} />
29-
</div>
30-
);
31-
};
32-
```
33-
34-
This component will display all the auth providers you want to use on your application and links for the user. Custom OIDC providers can be registered using the `customProviders` prop and provide the `id` of the provider and the `name` you want displayed to the user.
35-
36-
By default, only [managed auth providers](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell) will display, but they can be turned off by setting their corresponding prop to `false`. All providers available [as configurable options](https://docs.microsoft.com/azure/static-web-apps/authentication-custom?tabs=aad&WT.mc_id=javascript-12079-aapowell) can be enabled using props.
37-
38-
To redirect to a specific URL post-login, provide that path in the `postLoginRedirect` prop.
39-
40-
The default label is `Sign in using ${name}`, but can be overridden with the `label` prop, which takes a function that receives the `name` of the provider and returns the label string.
41-
42-
### `<UserInfoContextProvider>`
43-
44-
```typescript
45-
const App = () => {
46-
return (
47-
<UserInfoContextProvider>
48-
<MySite />
49-
</UserInfoContextProvider>
50-
);
51-
};
52-
```
53-
54-
This component provides React Context for the current user (or a series of `undefined` values when you're not logged in), aligning with the information available [in the Client Principal](https://docs.microsoft.com/azure/static-web-apps/user-information?tabs=javascript#client-principal-data&WT.mc_id=javascript-12079-aapowell).
55-
56-
Additionally, a `useContext` React Hook is available, `useUserInfo`, for use within the application.
57-
58-
### `<Logout />`
59-
60-
This component provides the logout function through Static Web Apps.
61-
62-
To redirect to a specific URL post-logout, provide the path in the `postLogoutRedirect` prop.
63-
64-
### `<UserPurge />`
65-
66-
This component provides the user with the ability to [remove their identifying information from Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell#remove-personal-identifying-information). By default it'll only purge them from the current domain, but set the `globally` prop to `true` if you with to give them the ability to completely remove themselves from Static Web Apps.
67-
68-
## Styling
69-
70-
Each of the components generates minimal HTML (a single `<a>` tag) to make it easier to style within an application. The DOM elements have the class `azure-swa-auth`, defined in `./constants` as `StaticWebAppsClassName`, on them, along with the component type, `login`, `logout` or `purge`.
71-
72-
Additionally, the login components have the provider as a class, so providers can be styled individually.
73-
74-
## License
75-
76-
MIT
1+
# Static Web App Auth tools for React
2+
3+
![Node.js CI](https://github.com/aaronpowell/react-static-web-apps-auth/workflows/Node.js%20CI/badge.svg) | [![npm version](https://img.shields.io/npm/v/@aaronpowell/react-static-web-apps-auth)](https://npmjs.org/package/@aaronpowell/react-static-web-apps-auth)
4+
5+
This package is a series of helper tools for working with [Azure Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/?WT.mc_id=javascript-12079-aapowell) [Authentication and Authorization](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell) from React.
6+
7+
## Installation
8+
9+
You can install a stable release from npm:
10+
11+
```bash
12+
npm install @aaronpowell/react-static-web-apps-auth
13+
```
14+
15+
Or you can install the latest build from GitHub packages.
16+
17+
## Usage
18+
19+
The package contains some components that wrap the functionality for you.
20+
21+
### `<StaticWebAppsAuthLogins />`
22+
23+
```typescript
24+
const Login = () => {
25+
return (
26+
<div>
27+
<h2>Login to our site</h2>
28+
<StaticWebAppsAuthLogins aad={true} twitter={false} customProviders={[ id: "okta", name: "Okta" ]} />
29+
</div>
30+
);
31+
};
32+
```
33+
34+
This component will display all the auth providers you want to use on your application and links for the user. Custom OIDC providers can be registered using the `customProviders` prop and provide the `id` of the provider and the `name` you want displayed to the user.
35+
36+
By default, only [managed auth providers](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell) will display, but they can be turned off by setting their corresponding prop to `false`. All providers available [as configurable options](https://docs.microsoft.com/azure/static-web-apps/authentication-custom?tabs=aad&WT.mc_id=javascript-12079-aapowell) can be enabled using props.
37+
38+
To redirect to a specific URL post-login, provide that path in the `postLoginRedirect` prop.
39+
40+
The default label is `Sign in using ${name}`, but can be overridden with the `label` prop, which takes a function that receives the `name` of the provider and returns the label string.
41+
42+
### `<ClientPrincipalContextProvider>`
43+
44+
```typescript
45+
const App = () => {
46+
return (
47+
<ClientPrincipalContextProvider>
48+
<MySite />
49+
</ClientPrincipalContextProvider>
50+
);
51+
};
52+
```
53+
54+
This component provides React Context for the current user (or a series of `undefined` values when you're not logged in), aligning with the information available [in the Client Principal](https://docs.microsoft.com/azure/static-web-apps/user-information?tabs=javascript#client-principal-data&WT.mc_id=javascript-12079-aapowell).
55+
56+
Additionally, a `useContext` React Hook is available, `useClientPrincipal`, for use within the application.
57+
58+
### `<Logout />`
59+
60+
This component provides the logout function through Static Web Apps.
61+
62+
To redirect to a specific URL post-logout, provide the path in the `postLogoutRedirect` prop.
63+
64+
### `<UserPurge />`
65+
66+
This component provides the user with the ability to [remove their identifying information from Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/authentication-authorization?WT.mc_id=javascript-12079-aapowell#remove-personal-identifying-information). By default it'll only purge them from the current domain, but set the `globally` prop to `true` if you with to give them the ability to completely remove themselves from Static Web Apps.
67+
68+
## Styling
69+
70+
Each of the components generates minimal HTML (a single `<a>` tag) to make it easier to style within an application. The DOM elements have the class `azure-swa-auth`, defined in `./constants` as `StaticWebAppsClassName`, on them, along with the component type, `login`, `logout` or `purge`.
71+
72+
Additionally, the login components have the provider as a class, so providers can be styled individually.
73+
74+
## License
75+
76+
MIT

‎react-static-web-apps-auth/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@aaronpowell/react-static-web-apps-auth",
3-
"version": "1.1.0",
3+
"version": "1.2.0",
44
"description": "A library to help creating authenticated React apps on Azure Static Web Apps",
55
"main": "build/index.js",
66
"types": "build/index.d.ts",
@@ -57,4 +57,4 @@
5757
},
5858
"homepage": "https://github.com/aaronpowell/react-static-web-apps-auth",
5959
"private": false
60-
}
60+
}

‎react-static-web-apps-auth/src/UserInfoContext.tsx renamed to ‎react-static-web-apps-auth/src/ClientPrincipalContext.tsx

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -8,17 +8,21 @@ export type ClientPrincipal = {
88
userRoles: string[];
99
};
1010

11-
export type UserInfoContext = {
11+
export type ClientPrincipalContext = {
1212
loaded: boolean;
1313
clientPrincipal: ClientPrincipal | null;
1414
};
1515

16-
const UserInfoContext = React.createContext<UserInfoContext>({
16+
const ClientPrincipalContext = React.createContext<ClientPrincipalContext>({
1717
loaded: false,
1818
clientPrincipal: null,
1919
});
2020

21-
const UserInfoContextProvider = ({ children }: { children: JSX.Element }) => {
21+
const ClientPrincipalContextProvider = ({
22+
children,
23+
}: {
24+
children: JSX.Element;
25+
}) => {
2226
const [
2327
clientPrincipal,
2428
setClientPrincipal,
@@ -38,7 +42,7 @@ const UserInfoContextProvider = ({ children }: { children: JSX.Element }) => {
3842
} catch (e) {
3943
if (window.location.hostname === "localhost") {
4044
console.warn(
41-
"Can't access the auth endoint. For local development, please use the Static Web Apps CLI to emulate authentication: https://github.com/azure/static-web-apps-cli"
45+
"Can't access the auth endpoint. For local development, please use the Static Web Apps CLI to emulate authentication: https://github.com/azure/static-web-apps-cli"
4246
);
4347
} else {
4448
console.error(`Failed to unpack JSON.`, e);
@@ -52,12 +56,12 @@ const UserInfoContextProvider = ({ children }: { children: JSX.Element }) => {
5256
}, []);
5357

5458
return (
55-
<UserInfoContext.Provider value={{ loaded, clientPrincipal }}>
59+
<ClientPrincipalContext.Provider value={{ loaded, clientPrincipal }}>
5660
{children}
57-
</UserInfoContext.Provider>
61+
</ClientPrincipalContext.Provider>
5862
);
5963
};
6064

61-
const useUserInfo = () => useContext(UserInfoContext);
65+
const useClientPrincipal = () => useContext(ClientPrincipalContext);
6266

63-
export { UserInfoContextProvider, useUserInfo };
67+
export { ClientPrincipalContextProvider, useClientPrincipal };

‎react-static-web-apps-auth/src/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
export { StaticWebAuthLogins, LoginProviderProps } from "./StaticWebAuthLogins";
22
export {
3-
ClientPrincipal as UserInfo,
4-
UserInfoContextProvider,
5-
useUserInfo,
6-
} from "./UserInfoContext";
3+
ClientPrincipal,
4+
ClientPrincipalContextProvider,
5+
useClientPrincipal,
6+
} from "./ClientPrincipalContext";
77
export { Logout } from "./Logout";
88
export { UserPurge } from "./UserPurge";

0 commit comments

Comments
 (0)