@monocloud/auth-nextjs 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/client/index.cjs +3 -3
- package/dist/client/index.d.mts +68 -112
- package/dist/client/index.mjs +2 -2
- package/dist/components/client/index.cjs +40 -84
- package/dist/components/client/index.cjs.map +1 -1
- package/dist/components/client/index.d.mts +55 -90
- package/dist/components/client/index.mjs +38 -82
- package/dist/components/client/index.mjs.map +1 -1
- package/dist/components/index.cjs +44 -41
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.mts +68 -45
- package/dist/components/index.mjs +44 -41
- package/dist/components/index.mjs.map +1 -1
- package/dist/index.cjs +384 -365
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +1545 -1833
- package/dist/index.mjs +380 -372
- package/dist/index.mjs.map +1 -1
- package/dist/{protect-K9srvUkq.mjs → protect-client-page-BFVskb3X.mjs} +58 -106
- package/dist/protect-client-page-BFVskb3X.mjs.map +1 -0
- package/dist/{protect-BCIji2i7.cjs → protect-client-page-BdsnH8gs.cjs} +59 -107
- package/dist/protect-client-page-BdsnH8gs.cjs.map +1 -0
- package/dist/types-ClljFIvK.d.mts +543 -0
- package/package.json +3 -2
- package/dist/protect-BCIji2i7.cjs.map +0 -1
- package/dist/protect-K9srvUkq.mjs.map +0 -1
- package/dist/types-Cx32VRoI.d.mts +0 -409
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as ExtraAuthParams } from "../../types-ClljFIvK.mjs";
|
|
2
2
|
import { MonoCloudUser } from "@monocloud/auth-node-core";
|
|
3
3
|
import React from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/components/client/redirect-to-signin.d.ts
|
|
6
6
|
/**
|
|
7
7
|
* Props for the `<RedirectToSignIn />` Component
|
|
8
|
+
*
|
|
9
|
+
* @category Types
|
|
8
10
|
*/
|
|
9
11
|
interface RedirectToSignInProps extends ExtraAuthParams {
|
|
10
12
|
/**
|
|
11
|
-
* The
|
|
13
|
+
* The URL to return to after successful authentication. If not provided, the current URL is used.
|
|
12
14
|
*/
|
|
13
15
|
returnUrl?: string;
|
|
14
16
|
}
|
|
15
17
|
/**
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
* **Note⚠️: Since `window.location` is set as `returnUrl` query param by default, you need to set the env `MONOCLOUD_AUTH_ALLOW_QUERY_PARAM_OVERRIDES=true` or `allowQueryParamOverrides` should be `true` in the client initialization for returning to the same page.**
|
|
18
|
+
* `<RedirectToSignIn>` is a **client-side component** that immediately redirects the user to the MonoCloud sign-in page when it is rendered.
|
|
19
19
|
*
|
|
20
|
-
*
|
|
20
|
+
* It does not render any UI.
|
|
21
21
|
*
|
|
22
|
-
*
|
|
22
|
+
* > This component must be used inside a Client Component (`"use client"`).
|
|
23
23
|
*
|
|
24
|
-
* @example
|
|
24
|
+
* @example Basic Usage
|
|
25
25
|
*
|
|
26
|
-
* ```tsx
|
|
26
|
+
* ```tsx title="Basic Usage"
|
|
27
27
|
* "use client";
|
|
28
28
|
*
|
|
29
29
|
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
@@ -40,11 +40,11 @@ interface RedirectToSignInProps extends ExtraAuthParams {
|
|
|
40
40
|
* }
|
|
41
41
|
* ```
|
|
42
42
|
*
|
|
43
|
-
* @example
|
|
43
|
+
* @example With Options
|
|
44
44
|
*
|
|
45
|
-
* You can customize the authorization request by passing in props.
|
|
45
|
+
* You can customize the authorization request by passing in props.
|
|
46
46
|
*
|
|
47
|
-
* ```tsx
|
|
47
|
+
* ```tsx title="With options"
|
|
48
48
|
* "use client";
|
|
49
49
|
*
|
|
50
50
|
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
@@ -54,48 +54,22 @@ interface RedirectToSignInProps extends ExtraAuthParams {
|
|
|
54
54
|
* const { isLoading, isAuthenticated } = useAuth();
|
|
55
55
|
*
|
|
56
56
|
* if (!isLoading && !isAuthenticated) {
|
|
57
|
-
* return
|
|
58
|
-
*
|
|
59
|
-
*
|
|
60
|
-
*
|
|
61
|
-
*
|
|
62
|
-
*
|
|
63
|
-
*
|
|
64
|
-
* @example Pages Router
|
|
65
|
-
*
|
|
66
|
-
* ```tsx
|
|
67
|
-
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
68
|
-
* import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";
|
|
69
|
-
*
|
|
70
|
-
* export default function Home() {
|
|
71
|
-
* const { isLoading, isAuthenticated } = useAuth();
|
|
72
|
-
*
|
|
73
|
-
* if (!isLoading && !isAuthenticated) {
|
|
74
|
-
* return <RedirectToSignIn />;
|
|
57
|
+
* return (
|
|
58
|
+
* <RedirectToSignIn
|
|
59
|
+
* returnUrl="/dashboard"
|
|
60
|
+
* loginHint="user@example.com"
|
|
61
|
+
* />
|
|
62
|
+
* );
|
|
75
63
|
* }
|
|
76
64
|
*
|
|
77
65
|
* return <>You are signed in</>;
|
|
78
66
|
* }
|
|
79
67
|
* ```
|
|
80
68
|
*
|
|
81
|
-
* @
|
|
82
|
-
*
|
|
83
|
-
* You can customize the authorization request by passing in props. See {@link RedirectToSignInProps}.
|
|
84
|
-
*
|
|
85
|
-
* ```tsx
|
|
86
|
-
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
87
|
-
* import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";
|
|
88
|
-
*
|
|
89
|
-
* export default function Home() {
|
|
90
|
-
* const { isLoading, isAuthenticated } = useAuth();
|
|
91
|
-
*
|
|
92
|
-
* if (!isLoading && !isAuthenticated) {
|
|
93
|
-
* return <RedirectToSignIn returnUrl="/dashboard" loginHint="username" />;
|
|
94
|
-
* }
|
|
69
|
+
* @param props - The props for customizing RedirectToSignIn.
|
|
70
|
+
* @returns
|
|
95
71
|
*
|
|
96
|
-
*
|
|
97
|
-
* }
|
|
98
|
-
* ```
|
|
72
|
+
* @category Components
|
|
99
73
|
*/
|
|
100
74
|
declare const RedirectToSignIn: ({
|
|
101
75
|
returnUrl,
|
|
@@ -103,46 +77,48 @@ declare const RedirectToSignIn: ({
|
|
|
103
77
|
}: RedirectToSignInProps) => null;
|
|
104
78
|
//#endregion
|
|
105
79
|
//#region src/components/client/protected.d.ts
|
|
80
|
+
/**
|
|
81
|
+
* Props for the `<Protected />` component.
|
|
82
|
+
*
|
|
83
|
+
* @category Types
|
|
84
|
+
*/
|
|
106
85
|
interface ProtectedComponentProps {
|
|
107
86
|
/**
|
|
108
|
-
*
|
|
87
|
+
* Content to render when access is allowed.
|
|
109
88
|
*/
|
|
110
89
|
children: React.ReactNode;
|
|
111
90
|
/**
|
|
112
|
-
*
|
|
91
|
+
* Groups required to view the protected content. By default, the user must belong to **any** of the specified groups.
|
|
113
92
|
*/
|
|
114
93
|
groups?: string[];
|
|
115
94
|
/**
|
|
116
|
-
* Name of the claim
|
|
95
|
+
* Name of the claim that contains groups in the user profile.
|
|
96
|
+
* @defaultValue 'groups'
|
|
117
97
|
*/
|
|
118
98
|
groupsClaim?: string;
|
|
119
99
|
/**
|
|
120
|
-
*
|
|
100
|
+
* If `true`, the user must belong to **all** specified `groups` (instead of any).
|
|
101
|
+
* @defaultValue false
|
|
121
102
|
*/
|
|
122
103
|
matchAllGroups?: boolean;
|
|
123
104
|
/**
|
|
124
|
-
*
|
|
105
|
+
* Content to render when the user is not authenticated.
|
|
125
106
|
*/
|
|
126
107
|
fallback?: React.ReactNode;
|
|
127
108
|
/**
|
|
128
|
-
*
|
|
109
|
+
* Rendered when the user is authenticated but does not meet the `groups` requirement. If omitted, nothing is rendered (or `fallback` is used only for unauthenticated users).
|
|
129
110
|
*/
|
|
130
|
-
onGroupAccessDenied?: (user
|
|
111
|
+
onGroupAccessDenied?: (user: MonoCloudUser) => React.ReactNode;
|
|
131
112
|
}
|
|
132
113
|
/**
|
|
133
|
-
*
|
|
134
|
-
* status and group membership.
|
|
114
|
+
* `<Protected>` conditionally renders its children based on the user’s authentication state and (optionally) group membership.
|
|
135
115
|
*
|
|
136
|
-
*
|
|
116
|
+
* > `<Protected>` runs on the client and only affects what is rendered. It does **not** prevent data from being sent to the browser.
|
|
117
|
+
* > To enforce access before content is rendered or sent to the client, use server-side protection such as {@link MonoCloudNextClient.protectPage | protectPage()}, or {@link MonoCloudNextClient.protect | protect()}.
|
|
137
118
|
*
|
|
138
|
-
* @
|
|
139
|
-
*
|
|
140
|
-
* @returns The children if authorized, the `fallback` or `onGroupAccessDenied` content if unauthenticated or unauthorized,
|
|
141
|
-
* or `null` while loading.
|
|
119
|
+
* @example Basic Usage
|
|
142
120
|
*
|
|
143
|
-
*
|
|
144
|
-
*
|
|
145
|
-
* ```tsx
|
|
121
|
+
* ```tsx title="Basic Usage"
|
|
146
122
|
* "use client";
|
|
147
123
|
*
|
|
148
124
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
@@ -150,17 +126,15 @@ interface ProtectedComponentProps {
|
|
|
150
126
|
* export default function Home() {
|
|
151
127
|
* return (
|
|
152
128
|
* <Protected fallback={<>Sign in to view the message.</>}>
|
|
153
|
-
* <>
|
|
129
|
+
* <>This is the protected content.</>
|
|
154
130
|
* </Protected>
|
|
155
131
|
* );
|
|
156
132
|
* }
|
|
157
133
|
* ```
|
|
158
134
|
*
|
|
159
|
-
* @example
|
|
160
|
-
*
|
|
161
|
-
* See {@link ProtectedComponentProps}.
|
|
135
|
+
* @example With Groups
|
|
162
136
|
*
|
|
163
|
-
* ```tsx
|
|
137
|
+
* ```tsx title="With Groups"
|
|
164
138
|
* "use client";
|
|
165
139
|
*
|
|
166
140
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
@@ -168,8 +142,8 @@ interface ProtectedComponentProps {
|
|
|
168
142
|
* export default function Home() {
|
|
169
143
|
* return (
|
|
170
144
|
* <Protected
|
|
171
|
-
* onGroupAccessDenied={() => <>Only admins are allowed.</>}
|
|
172
145
|
* groups={["admin"]}
|
|
146
|
+
* onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access admin content.</>}
|
|
173
147
|
* >
|
|
174
148
|
* <>Signed in as admin</>
|
|
175
149
|
* </Protected>
|
|
@@ -177,39 +151,30 @@ interface ProtectedComponentProps {
|
|
|
177
151
|
* }
|
|
178
152
|
* ```
|
|
179
153
|
*
|
|
180
|
-
* @example
|
|
154
|
+
* @example Requiring all groups
|
|
181
155
|
*
|
|
182
|
-
* ```tsx
|
|
183
|
-
*
|
|
184
|
-
*
|
|
185
|
-
* export default function Home() {
|
|
186
|
-
* return (
|
|
187
|
-
* <Protected fallback={<>Sign in to view the message.</>}>
|
|
188
|
-
* <>You are breathtaking</>
|
|
189
|
-
* </Protected>
|
|
190
|
-
* );
|
|
191
|
-
* }
|
|
192
|
-
* ```
|
|
193
|
-
*
|
|
194
|
-
* @example Pages Router with group options
|
|
195
|
-
*
|
|
196
|
-
* See {@link ProtectedComponentProps}.
|
|
156
|
+
* ```tsx title="Requiring all groups"
|
|
157
|
+
* "use client";
|
|
197
158
|
*
|
|
198
|
-
* ```tsx
|
|
199
159
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
200
160
|
*
|
|
201
161
|
* export default function Home() {
|
|
202
162
|
* return (
|
|
203
163
|
* <Protected
|
|
204
|
-
*
|
|
205
|
-
*
|
|
164
|
+
* groups={["admin", "billing"]}
|
|
165
|
+
* matchAllGroups
|
|
166
|
+
* onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access billing content.</>}
|
|
206
167
|
* >
|
|
207
|
-
* <>
|
|
168
|
+
* <>Sensitive settings</>
|
|
208
169
|
* </Protected>
|
|
209
170
|
* );
|
|
210
171
|
* }
|
|
211
172
|
* ```
|
|
212
173
|
*
|
|
174
|
+
* @param props - Props for customizing the Protected component.
|
|
175
|
+
* @returns The children if authorized, the `fallback` or `onGroupAccessDenied` content if unauthenticated or unauthorized, or `null` while loading.
|
|
176
|
+
*
|
|
177
|
+
* @category Components
|
|
213
178
|
*/
|
|
214
179
|
declare const Protected: ({
|
|
215
180
|
children,
|
|
@@ -1,21 +1,19 @@
|
|
|
1
|
-
import { n as redirectToSignIn, r as useAuth } from "../../protect-
|
|
1
|
+
import { n as redirectToSignIn, r as useAuth } from "../../protect-client-page-BFVskb3X.mjs";
|
|
2
2
|
import "../../client/index.mjs";
|
|
3
3
|
import { isUserInGroup } from "@monocloud/auth-node-core/utils";
|
|
4
4
|
import React, { useEffect } from "react";
|
|
5
5
|
|
|
6
6
|
//#region src/components/client/redirect-to-signin.tsx
|
|
7
7
|
/**
|
|
8
|
-
*
|
|
8
|
+
* `<RedirectToSignIn>` is a **client-side component** that immediately redirects the user to the MonoCloud sign-in page when it is rendered.
|
|
9
9
|
*
|
|
10
|
-
*
|
|
10
|
+
* It does not render any UI.
|
|
11
11
|
*
|
|
12
|
-
*
|
|
12
|
+
* > This component must be used inside a Client Component (`"use client"`).
|
|
13
13
|
*
|
|
14
|
-
* @
|
|
15
|
-
*
|
|
16
|
-
* @example App Router
|
|
14
|
+
* @example Basic Usage
|
|
17
15
|
*
|
|
18
|
-
* ```tsx
|
|
16
|
+
* ```tsx title="Basic Usage"
|
|
19
17
|
* "use client";
|
|
20
18
|
*
|
|
21
19
|
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
@@ -32,11 +30,11 @@ import React, { useEffect } from "react";
|
|
|
32
30
|
* }
|
|
33
31
|
* ```
|
|
34
32
|
*
|
|
35
|
-
* @example
|
|
33
|
+
* @example With Options
|
|
36
34
|
*
|
|
37
|
-
* You can customize the authorization request by passing in props.
|
|
35
|
+
* You can customize the authorization request by passing in props.
|
|
38
36
|
*
|
|
39
|
-
* ```tsx
|
|
37
|
+
* ```tsx title="With options"
|
|
40
38
|
* "use client";
|
|
41
39
|
*
|
|
42
40
|
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
@@ -46,48 +44,22 @@ import React, { useEffect } from "react";
|
|
|
46
44
|
* const { isLoading, isAuthenticated } = useAuth();
|
|
47
45
|
*
|
|
48
46
|
* if (!isLoading && !isAuthenticated) {
|
|
49
|
-
* return
|
|
50
|
-
*
|
|
51
|
-
*
|
|
52
|
-
*
|
|
53
|
-
*
|
|
54
|
-
*
|
|
55
|
-
*
|
|
56
|
-
* @example Pages Router
|
|
57
|
-
*
|
|
58
|
-
* ```tsx
|
|
59
|
-
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
60
|
-
* import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";
|
|
61
|
-
*
|
|
62
|
-
* export default function Home() {
|
|
63
|
-
* const { isLoading, isAuthenticated } = useAuth();
|
|
64
|
-
*
|
|
65
|
-
* if (!isLoading && !isAuthenticated) {
|
|
66
|
-
* return <RedirectToSignIn />;
|
|
47
|
+
* return (
|
|
48
|
+
* <RedirectToSignIn
|
|
49
|
+
* returnUrl="/dashboard"
|
|
50
|
+
* loginHint="user@example.com"
|
|
51
|
+
* />
|
|
52
|
+
* );
|
|
67
53
|
* }
|
|
68
54
|
*
|
|
69
55
|
* return <>You are signed in</>;
|
|
70
56
|
* }
|
|
71
57
|
* ```
|
|
72
58
|
*
|
|
73
|
-
* @
|
|
74
|
-
*
|
|
75
|
-
* You can customize the authorization request by passing in props. See {@link RedirectToSignInProps}.
|
|
76
|
-
*
|
|
77
|
-
* ```tsx
|
|
78
|
-
* import { useAuth } from "@monocloud/auth-nextjs/client";
|
|
79
|
-
* import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";
|
|
80
|
-
*
|
|
81
|
-
* export default function Home() {
|
|
82
|
-
* const { isLoading, isAuthenticated } = useAuth();
|
|
83
|
-
*
|
|
84
|
-
* if (!isLoading && !isAuthenticated) {
|
|
85
|
-
* return <RedirectToSignIn returnUrl="/dashboard" loginHint="username" />;
|
|
86
|
-
* }
|
|
59
|
+
* @param props - The props for customizing RedirectToSignIn.
|
|
60
|
+
* @returns
|
|
87
61
|
*
|
|
88
|
-
*
|
|
89
|
-
* }
|
|
90
|
-
* ```
|
|
62
|
+
* @category Components
|
|
91
63
|
*/
|
|
92
64
|
const RedirectToSignIn = ({ returnUrl, ...authParams }) => {
|
|
93
65
|
useEffect(() => {
|
|
@@ -102,19 +74,14 @@ const RedirectToSignIn = ({ returnUrl, ...authParams }) => {
|
|
|
102
74
|
//#endregion
|
|
103
75
|
//#region src/components/client/protected.tsx
|
|
104
76
|
/**
|
|
105
|
-
*
|
|
106
|
-
* status and group membership.
|
|
107
|
-
*
|
|
108
|
-
* **Note⚠️: The component is hidden from view. The data is present in the browser. Use server side `protectPage()` for protecting components before that data is sent to the client.**
|
|
77
|
+
* `<Protected>` conditionally renders its children based on the user’s authentication state and (optionally) group membership.
|
|
109
78
|
*
|
|
110
|
-
*
|
|
79
|
+
* > `<Protected>` runs on the client and only affects what is rendered. It does **not** prevent data from being sent to the browser.
|
|
80
|
+
* > To enforce access before content is rendered or sent to the client, use server-side protection such as {@link MonoCloudNextClient.protectPage | protectPage()}, or {@link MonoCloudNextClient.protect | protect()}.
|
|
111
81
|
*
|
|
112
|
-
* @
|
|
113
|
-
* or `null` while loading.
|
|
82
|
+
* @example Basic Usage
|
|
114
83
|
*
|
|
115
|
-
*
|
|
116
|
-
*
|
|
117
|
-
* ```tsx
|
|
84
|
+
* ```tsx title="Basic Usage"
|
|
118
85
|
* "use client";
|
|
119
86
|
*
|
|
120
87
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
@@ -122,17 +89,15 @@ const RedirectToSignIn = ({ returnUrl, ...authParams }) => {
|
|
|
122
89
|
* export default function Home() {
|
|
123
90
|
* return (
|
|
124
91
|
* <Protected fallback={<>Sign in to view the message.</>}>
|
|
125
|
-
* <>
|
|
92
|
+
* <>This is the protected content.</>
|
|
126
93
|
* </Protected>
|
|
127
94
|
* );
|
|
128
95
|
* }
|
|
129
96
|
* ```
|
|
130
97
|
*
|
|
131
|
-
* @example
|
|
132
|
-
*
|
|
133
|
-
* See {@link ProtectedComponentProps}.
|
|
98
|
+
* @example With Groups
|
|
134
99
|
*
|
|
135
|
-
* ```tsx
|
|
100
|
+
* ```tsx title="With Groups"
|
|
136
101
|
* "use client";
|
|
137
102
|
*
|
|
138
103
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
@@ -140,8 +105,8 @@ const RedirectToSignIn = ({ returnUrl, ...authParams }) => {
|
|
|
140
105
|
* export default function Home() {
|
|
141
106
|
* return (
|
|
142
107
|
* <Protected
|
|
143
|
-
* onGroupAccessDenied={() => <>Only admins are allowed.</>}
|
|
144
108
|
* groups={["admin"]}
|
|
109
|
+
* onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access admin content.</>}
|
|
145
110
|
* >
|
|
146
111
|
* <>Signed in as admin</>
|
|
147
112
|
* </Protected>
|
|
@@ -149,39 +114,30 @@ const RedirectToSignIn = ({ returnUrl, ...authParams }) => {
|
|
|
149
114
|
* }
|
|
150
115
|
* ```
|
|
151
116
|
*
|
|
152
|
-
* @example
|
|
153
|
-
*
|
|
154
|
-
* ```tsx
|
|
155
|
-
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
117
|
+
* @example Requiring all groups
|
|
156
118
|
*
|
|
157
|
-
*
|
|
158
|
-
*
|
|
159
|
-
* <Protected fallback={<>Sign in to view the message.</>}>
|
|
160
|
-
* <>You are breathtaking</>
|
|
161
|
-
* </Protected>
|
|
162
|
-
* );
|
|
163
|
-
* }
|
|
164
|
-
* ```
|
|
165
|
-
*
|
|
166
|
-
* @example Pages Router with group options
|
|
167
|
-
*
|
|
168
|
-
* See {@link ProtectedComponentProps}.
|
|
119
|
+
* ```tsx title="Requiring all groups"
|
|
120
|
+
* "use client";
|
|
169
121
|
*
|
|
170
|
-
* ```tsx
|
|
171
122
|
* import { Protected } from "@monocloud/auth-nextjs/components/client";
|
|
172
123
|
*
|
|
173
124
|
* export default function Home() {
|
|
174
125
|
* return (
|
|
175
126
|
* <Protected
|
|
176
|
-
*
|
|
177
|
-
*
|
|
127
|
+
* groups={["admin", "billing"]}
|
|
128
|
+
* matchAllGroups
|
|
129
|
+
* onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access billing content.</>}
|
|
178
130
|
* >
|
|
179
|
-
* <>
|
|
131
|
+
* <>Sensitive settings</>
|
|
180
132
|
* </Protected>
|
|
181
133
|
* );
|
|
182
134
|
* }
|
|
183
135
|
* ```
|
|
184
136
|
*
|
|
137
|
+
* @param props - Props for customizing the Protected component.
|
|
138
|
+
* @returns The children if authorized, the `fallback` or `onGroupAccessDenied` content if unauthenticated or unauthorized, or `null` while loading.
|
|
139
|
+
*
|
|
140
|
+
* @category Components
|
|
185
141
|
*/
|
|
186
142
|
const Protected = ({ children, groups, groupsClaim, matchAllGroups = false, fallback = null, onGroupAccessDenied = () => /* @__PURE__ */ React.createElement(React.Fragment, null) }) => {
|
|
187
143
|
const { isLoading, error, isAuthenticated, user } = useAuth();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/client/redirect-to-signin.tsx","../../../src/components/client/protected.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\nimport { redirectToSignIn } from '../../client/protect';\nimport { ExtraAuthParams } from '../../types';\n\n/**\n * Props for the `<RedirectToSignIn />` Component\n */\nexport interface RedirectToSignInProps extends ExtraAuthParams {\n /**\n * The
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/client/redirect-to-signin.tsx","../../../src/components/client/protected.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\nimport { redirectToSignIn } from '../../client/protect-client-page';\nimport { ExtraAuthParams } from '../../types';\n\n/**\n * Props for the `<RedirectToSignIn />` Component\n *\n * @category Types\n */\nexport interface RedirectToSignInProps extends ExtraAuthParams {\n /**\n * The URL to return to after successful authentication. If not provided, the current URL is used.\n */\n returnUrl?: string;\n}\n\n/**\n * `<RedirectToSignIn>` is a **client-side component** that immediately redirects the user to the MonoCloud sign-in page when it is rendered.\n *\n * It does not render any UI.\n *\n * > This component must be used inside a Client Component (`\"use client\"`).\n *\n * @example Basic Usage\n *\n * ```tsx title=\"Basic Usage\"\n * \"use client\";\n *\n * import { useAuth } from \"@monocloud/auth-nextjs/client\";\n * import { RedirectToSignIn } from \"@monocloud/auth-nextjs/components/client\";\n *\n * export default function Home() {\n * const { isLoading, isAuthenticated } = useAuth();\n *\n * if (!isLoading && !isAuthenticated) {\n * return <RedirectToSignIn />;\n * }\n *\n * return <>You are signed in</>;\n * }\n * ```\n *\n * @example With Options\n *\n * You can customize the authorization request by passing in props.\n *\n * ```tsx title=\"With options\"\n * \"use client\";\n *\n * import { useAuth } from \"@monocloud/auth-nextjs/client\";\n * import { RedirectToSignIn } from \"@monocloud/auth-nextjs/components/client\";\n *\n * export default function Home() {\n * const { isLoading, isAuthenticated } = useAuth();\n *\n * if (!isLoading && !isAuthenticated) {\n * return (\n * <RedirectToSignIn\n * returnUrl=\"/dashboard\"\n * loginHint=\"user@example.com\"\n * />\n * );\n * }\n *\n * return <>You are signed in</>;\n * }\n * ```\n *\n * @param props - The props for customizing RedirectToSignIn.\n * @returns\n *\n * @category Components\n */\nexport const RedirectToSignIn = ({\n returnUrl,\n ...authParams\n}: RedirectToSignInProps): null => {\n useEffect(() => {\n redirectToSignIn({ returnUrl, ...authParams });\n }, [authParams, returnUrl]);\n return null;\n};\n","import { isUserInGroup } from '@monocloud/auth-node-core/utils';\nimport React from 'react';\nimport { useAuth } from '../../client';\nimport type { MonoCloudUser } from '@monocloud/auth-node-core';\nimport type { MonoCloudNextClient } from '../../monocloud-next-client';\n\n/**\n * Props for the `<Protected />` component.\n *\n * @category Types\n */\nexport interface ProtectedComponentProps {\n /**\n * Content to render when access is allowed.\n */\n children: React.ReactNode;\n\n /**\n * Groups required to view the protected content. By default, the user must belong to **any** of the specified groups.\n */\n groups?: string[];\n\n /**\n * Name of the claim that contains groups in the user profile.\n * @defaultValue 'groups'\n */\n groupsClaim?: string;\n\n /**\n * If `true`, the user must belong to **all** specified `groups` (instead of any).\n * @defaultValue false\n */\n matchAllGroups?: boolean;\n\n /**\n * Content to render when the user is not authenticated.\n */\n fallback?: React.ReactNode;\n\n /**\n * Rendered when the user is authenticated but does not meet the `groups` requirement. If omitted, nothing is rendered (or `fallback` is used only for unauthenticated users).\n */\n onGroupAccessDenied?: (user: MonoCloudUser) => React.ReactNode;\n}\n\n/**\n * `<Protected>` conditionally renders its children based on the user’s authentication state and (optionally) group membership.\n *\n * > `<Protected>` runs on the client and only affects what is rendered. It does **not** prevent data from being sent to the browser.\n * > To enforce access before content is rendered or sent to the client, use server-side protection such as {@link MonoCloudNextClient.protectPage | protectPage()}, or {@link MonoCloudNextClient.protect | protect()}.\n *\n * @example Basic Usage\n *\n * ```tsx title=\"Basic Usage\"\n * \"use client\";\n *\n * import { Protected } from \"@monocloud/auth-nextjs/components/client\";\n *\n * export default function Home() {\n * return (\n * <Protected fallback={<>Sign in to view the message.</>}>\n * <>This is the protected content.</>\n * </Protected>\n * );\n * }\n * ```\n *\n * @example With Groups\n *\n * ```tsx title=\"With Groups\"\n * \"use client\";\n *\n * import { Protected } from \"@monocloud/auth-nextjs/components/client\";\n *\n * export default function Home() {\n * return (\n * <Protected\n * groups={[\"admin\"]}\n * onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access admin content.</>}\n * >\n * <>Signed in as admin</>\n * </Protected>\n * );\n * }\n * ```\n *\n * @example Requiring all groups\n *\n * ```tsx title=\"Requiring all groups\"\n * \"use client\";\n *\n * import { Protected } from \"@monocloud/auth-nextjs/components/client\";\n *\n * export default function Home() {\n * return (\n * <Protected\n * groups={[\"admin\", \"billing\"]}\n * matchAllGroups\n * onGroupAccessDenied={(user) => <>User {user.email} is not allowed to access billing content.</>}\n * >\n * <>Sensitive settings</>\n * </Protected>\n * );\n * }\n * ```\n *\n * @param props - Props for customizing the Protected component.\n * @returns The children if authorized, the `fallback` or `onGroupAccessDenied` content if unauthenticated or unauthorized, or `null` while loading.\n *\n * @category Components\n */\nexport const Protected = ({\n children,\n groups,\n groupsClaim,\n matchAllGroups = false,\n fallback = null,\n onGroupAccessDenied = (): React.ReactNode => <></>,\n}: ProtectedComponentProps): React.ReactNode | null => {\n const { isLoading, error, isAuthenticated, user } = useAuth();\n\n if (isLoading) {\n return null;\n }\n\n if (error || !isAuthenticated || !user) {\n if (fallback) {\n return fallback;\n }\n\n return null;\n }\n\n return (\n <>\n {!groups ||\n isUserInGroup(\n user,\n groups,\n groupsClaim ?? process.env.NEXT_PUBLIC_MONOCLOUD_AUTH_GROUPS_CLAIM,\n matchAllGroups\n )\n ? children\n : onGroupAccessDenied(user)}\n </>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,MAAa,oBAAoB,EAC/B,WACA,GAAG,iBAC8B;AACjC,iBAAgB;AACd,mBAAiB;GAAE;GAAW,GAAG;GAAY,CAAC;IAC7C,CAAC,YAAY,UAAU,CAAC;AAC3B,QAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC6BT,MAAa,aAAa,EACxB,UACA,QACA,aACA,iBAAiB,OACjB,WAAW,MACX,4BAA6C,yDAAK,OACG;CACrD,MAAM,EAAE,WAAW,OAAO,iBAAiB,SAAS,SAAS;AAE7D,KAAI,UACF,QAAO;AAGT,KAAI,SAAS,CAAC,mBAAmB,CAAC,MAAM;AACtC,MAAI,SACF,QAAO;AAGT,SAAO;;AAGT,QACE,0DACG,CAAC,UACF,cACE,MACA,QACA,eAAe,QAAQ,IAAI,yCAC3B,eACD,GACG,WACA,oBAAoB,KAAK,CAC5B"}
|