@thetechfossil/auth2 1.2.1 → 1.2.2
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.NEW.md +365 -0
- package/dist/index.components.d.ts +112 -2
- package/dist/index.components.js +1995 -19
- package/dist/index.components.js.map +1 -1
- package/dist/index.components.mjs +1986 -21
- package/dist/index.components.mjs.map +1 -1
- package/dist/index.d.ts +250 -13
- package/dist/index.js +2392 -132
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2376 -134
- package/dist/index.mjs.map +1 -1
- package/dist/index.next.d.ts +253 -4
- package/dist/index.next.js +2514 -133
- package/dist/index.next.js.map +1 -1
- package/dist/index.next.mjs +2494 -134
- package/dist/index.next.mjs.map +1 -1
- package/dist/index.next.server.d.ts +68 -2
- package/dist/index.next.server.js +184 -18
- package/dist/index.next.server.js.map +1 -1
- package/dist/index.next.server.mjs +184 -18
- package/dist/index.next.server.mjs.map +1 -1
- package/dist/index.node.d.ts +68 -2
- package/dist/index.node.js +184 -18
- package/dist/index.node.js.map +1 -1
- package/dist/index.node.mjs +184 -18
- package/dist/index.node.mjs.map +1 -1
- package/package.json +40 -18
package/dist/index.next.js
CHANGED
|
@@ -3,6 +3,9 @@
|
|
|
3
3
|
var axios = require('axios');
|
|
4
4
|
var react = require('react');
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var headers = require('next/headers');
|
|
7
|
+
var navigation = require('next/navigation');
|
|
8
|
+
var server = require('next/server');
|
|
6
9
|
|
|
7
10
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
11
|
|
|
@@ -12,6 +15,7 @@ var axios__default = /*#__PURE__*/_interopDefault(axios);
|
|
|
12
15
|
var HttpClient = class {
|
|
13
16
|
constructor(baseUrl, defaultHeaders = {}) {
|
|
14
17
|
this.csrfToken = null;
|
|
18
|
+
this.frontendBaseUrl = null;
|
|
15
19
|
this.axiosInstance = axios__default.default.create({
|
|
16
20
|
baseURL: baseUrl.replace(/\/$/, ""),
|
|
17
21
|
headers: {
|
|
@@ -28,6 +32,9 @@ var HttpClient = class {
|
|
|
28
32
|
if (this.csrfToken && ["post", "put", "delete", "patch"].includes(config.method?.toLowerCase() || "")) {
|
|
29
33
|
config.headers["x-csrf-token"] = this.csrfToken;
|
|
30
34
|
}
|
|
35
|
+
if (this.frontendBaseUrl) {
|
|
36
|
+
config.headers["X-Frontend-URL"] = this.frontendBaseUrl;
|
|
37
|
+
}
|
|
31
38
|
return config;
|
|
32
39
|
},
|
|
33
40
|
(error) => Promise.reject(error)
|
|
@@ -83,6 +90,15 @@ var HttpClient = class {
|
|
|
83
90
|
removeCsrfToken() {
|
|
84
91
|
this.csrfToken = null;
|
|
85
92
|
}
|
|
93
|
+
setFrontendBaseUrl(url) {
|
|
94
|
+
this.frontendBaseUrl = url;
|
|
95
|
+
}
|
|
96
|
+
getFrontendBaseUrl() {
|
|
97
|
+
return this.frontendBaseUrl;
|
|
98
|
+
}
|
|
99
|
+
removeFrontendBaseUrl() {
|
|
100
|
+
this.frontendBaseUrl = null;
|
|
101
|
+
}
|
|
86
102
|
async refreshCsrfToken() {
|
|
87
103
|
try {
|
|
88
104
|
const response = await this.axiosInstance.get("/api/v1/auth/csrf-token");
|
|
@@ -105,6 +121,12 @@ var AuthService = class {
|
|
|
105
121
|
};
|
|
106
122
|
this.httpClient = new HttpClient(this.config.baseUrl);
|
|
107
123
|
this.loadTokenFromStorage();
|
|
124
|
+
if (typeof window !== "undefined") {
|
|
125
|
+
const frontendBaseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
|
|
126
|
+
if (frontendBaseUrl) {
|
|
127
|
+
this.httpClient.setFrontendBaseUrl(frontendBaseUrl);
|
|
128
|
+
}
|
|
129
|
+
}
|
|
108
130
|
if (this.config.csrfEnabled && typeof window !== "undefined") {
|
|
109
131
|
this.refreshCsrfToken();
|
|
110
132
|
}
|
|
@@ -221,11 +243,7 @@ var AuthService = class {
|
|
|
221
243
|
throw new Error(response.message || "Login failed");
|
|
222
244
|
}
|
|
223
245
|
async register(data) {
|
|
224
|
-
const
|
|
225
|
-
if (!registerData.frontendBaseUrl && typeof window !== "undefined") {
|
|
226
|
-
registerData.frontendBaseUrl = process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
|
|
227
|
-
}
|
|
228
|
-
const response = await this.httpClient.post("/api/v1/auth/register", registerData);
|
|
246
|
+
const response = await this.httpClient.post("/api/v1/auth/register", data);
|
|
229
247
|
if (response.success && response.message === "Registration data saved. Verification email sent. Please check your inbox.") {
|
|
230
248
|
return response;
|
|
231
249
|
}
|
|
@@ -241,15 +259,33 @@ var AuthService = class {
|
|
|
241
259
|
return response;
|
|
242
260
|
}
|
|
243
261
|
async verifyEmailToken(token) {
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
262
|
+
try {
|
|
263
|
+
const response = await this.httpClient.get(`/api/v1/auth/verify-email?token=${token}`);
|
|
264
|
+
if (response.success && response.token) {
|
|
265
|
+
this.token = response.token;
|
|
266
|
+
this.httpClient.setAuthToken(response.token);
|
|
267
|
+
this.saveTokenToStorage(response.token);
|
|
268
|
+
}
|
|
269
|
+
return response;
|
|
270
|
+
} catch (error) {
|
|
271
|
+
if (error.response?.data) {
|
|
272
|
+
return {
|
|
273
|
+
success: false,
|
|
274
|
+
message: error.response.data.message || "Email verification failed"
|
|
275
|
+
};
|
|
276
|
+
}
|
|
277
|
+
return {
|
|
278
|
+
success: false,
|
|
279
|
+
message: error.message || "Network error occurred"
|
|
280
|
+
};
|
|
249
281
|
}
|
|
250
|
-
return response;
|
|
251
282
|
}
|
|
252
283
|
async logout() {
|
|
284
|
+
try {
|
|
285
|
+
await this.httpClient.post("/api/v1/auth/logout", {});
|
|
286
|
+
} catch (error) {
|
|
287
|
+
console.warn("Failed to call logout endpoint:", error);
|
|
288
|
+
}
|
|
253
289
|
this.token = null;
|
|
254
290
|
this.httpClient.removeAuthToken();
|
|
255
291
|
this.httpClient.removeCsrfToken();
|
|
@@ -286,9 +322,6 @@ var AuthService = class {
|
|
|
286
322
|
return response.user;
|
|
287
323
|
}
|
|
288
324
|
async forgotPassword(email) {
|
|
289
|
-
if (typeof window !== "undefined") {
|
|
290
|
-
process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
|
|
291
|
-
}
|
|
292
325
|
const response = await this.httpClient.post("/api/v1/auth/forgot-password", { email });
|
|
293
326
|
return response;
|
|
294
327
|
}
|
|
@@ -296,6 +329,142 @@ var AuthService = class {
|
|
|
296
329
|
const response = await this.httpClient.post("/api/v1/auth/reset-password", { token, password });
|
|
297
330
|
return response;
|
|
298
331
|
}
|
|
332
|
+
async changePassword(oldPassword, newPassword) {
|
|
333
|
+
if (!this.token) {
|
|
334
|
+
throw new Error("Not authenticated");
|
|
335
|
+
}
|
|
336
|
+
const response = await this.httpClient.post("/api/v1/user/change-password", {
|
|
337
|
+
oldPassword,
|
|
338
|
+
newPassword
|
|
339
|
+
});
|
|
340
|
+
return response;
|
|
341
|
+
}
|
|
342
|
+
async updateAvatar(avatar) {
|
|
343
|
+
if (!this.token) {
|
|
344
|
+
throw new Error("Not authenticated");
|
|
345
|
+
}
|
|
346
|
+
const response = await this.httpClient.post("/api/v1/user/update/avatar", { avatar });
|
|
347
|
+
if (response.success && response.token) {
|
|
348
|
+
this.token = response.token;
|
|
349
|
+
this.httpClient.setAuthToken(response.token);
|
|
350
|
+
this.saveTokenToStorage(response.token);
|
|
351
|
+
}
|
|
352
|
+
return response;
|
|
353
|
+
}
|
|
354
|
+
async requestEmailChange(newEmail) {
|
|
355
|
+
if (!this.token) {
|
|
356
|
+
throw new Error("Not authenticated");
|
|
357
|
+
}
|
|
358
|
+
const response = await this.httpClient.post("/api/v1/user/request-email-change", {
|
|
359
|
+
newEmail
|
|
360
|
+
});
|
|
361
|
+
return response;
|
|
362
|
+
}
|
|
363
|
+
async verifyEmailChange(token) {
|
|
364
|
+
const response = await this.httpClient.get(`/api/v1/user/verify-email-change?token=${token}`);
|
|
365
|
+
if (response.success && response.token) {
|
|
366
|
+
this.token = response.token;
|
|
367
|
+
this.httpClient.setAuthToken(response.token);
|
|
368
|
+
this.saveTokenToStorage(response.token);
|
|
369
|
+
}
|
|
370
|
+
return response;
|
|
371
|
+
}
|
|
372
|
+
// 2FA / MFA Methods
|
|
373
|
+
async generate2FA() {
|
|
374
|
+
if (!this.token) {
|
|
375
|
+
throw new Error("Not authenticated");
|
|
376
|
+
}
|
|
377
|
+
const response = await this.httpClient.post(
|
|
378
|
+
"/api/v1/mfa/generate",
|
|
379
|
+
{}
|
|
380
|
+
);
|
|
381
|
+
return response;
|
|
382
|
+
}
|
|
383
|
+
async enable2FA(token) {
|
|
384
|
+
if (!this.token) {
|
|
385
|
+
throw new Error("Not authenticated");
|
|
386
|
+
}
|
|
387
|
+
const response = await this.httpClient.post("/api/v1/mfa/enable", { token });
|
|
388
|
+
return response;
|
|
389
|
+
}
|
|
390
|
+
async disable2FA(token) {
|
|
391
|
+
if (!this.token) {
|
|
392
|
+
throw new Error("Not authenticated");
|
|
393
|
+
}
|
|
394
|
+
const response = await this.httpClient.post("/api/v1/mfa/disable", { token });
|
|
395
|
+
return response;
|
|
396
|
+
}
|
|
397
|
+
async validate2FA(token) {
|
|
398
|
+
if (!this.token) {
|
|
399
|
+
throw new Error("Not authenticated");
|
|
400
|
+
}
|
|
401
|
+
const response = await this.httpClient.post("/api/v1/mfa/validate", { token });
|
|
402
|
+
return response;
|
|
403
|
+
}
|
|
404
|
+
// Session Management Methods
|
|
405
|
+
async getSessions() {
|
|
406
|
+
if (!this.token) {
|
|
407
|
+
throw new Error("Not authenticated");
|
|
408
|
+
}
|
|
409
|
+
const response = await this.httpClient.get("/api/v1/session");
|
|
410
|
+
return response;
|
|
411
|
+
}
|
|
412
|
+
async revokeSession(sessionId) {
|
|
413
|
+
if (!this.token) {
|
|
414
|
+
throw new Error("Not authenticated");
|
|
415
|
+
}
|
|
416
|
+
const response = await this.httpClient.delete(`/api/v1/session/${sessionId}`);
|
|
417
|
+
return response;
|
|
418
|
+
}
|
|
419
|
+
async revokeAllSessions() {
|
|
420
|
+
if (!this.token) {
|
|
421
|
+
throw new Error("Not authenticated");
|
|
422
|
+
}
|
|
423
|
+
const response = await this.httpClient.delete("/api/v1/session/revoke/all");
|
|
424
|
+
this.token = null;
|
|
425
|
+
this.httpClient.removeAuthToken();
|
|
426
|
+
this.removeTokenFromStorage();
|
|
427
|
+
return response;
|
|
428
|
+
}
|
|
429
|
+
// Admin Methods
|
|
430
|
+
async getAuditLogs(filters) {
|
|
431
|
+
if (!this.token) {
|
|
432
|
+
throw new Error("Not authenticated");
|
|
433
|
+
}
|
|
434
|
+
const response = await this.httpClient.get(
|
|
435
|
+
"/api/v1/admin/audit-logs",
|
|
436
|
+
filters
|
|
437
|
+
);
|
|
438
|
+
return response;
|
|
439
|
+
}
|
|
440
|
+
async adminVerifyUser(userId) {
|
|
441
|
+
if (!this.token) {
|
|
442
|
+
throw new Error("Not authenticated");
|
|
443
|
+
}
|
|
444
|
+
const response = await this.httpClient.post(`/api/v1/admin/verify-user/${userId}`, {});
|
|
445
|
+
return response;
|
|
446
|
+
}
|
|
447
|
+
async adminForcePasswordReset(userId) {
|
|
448
|
+
if (!this.token) {
|
|
449
|
+
throw new Error("Not authenticated");
|
|
450
|
+
}
|
|
451
|
+
const response = await this.httpClient.post(`/api/v1/admin/force-password-reset/${userId}`, {});
|
|
452
|
+
return response;
|
|
453
|
+
}
|
|
454
|
+
async adminSuspendUser(userId) {
|
|
455
|
+
if (!this.token) {
|
|
456
|
+
throw new Error("Not authenticated");
|
|
457
|
+
}
|
|
458
|
+
const response = await this.httpClient.post(`/api/v1/admin/suspend-user/${userId}`, {});
|
|
459
|
+
return response;
|
|
460
|
+
}
|
|
461
|
+
async adminActivateUser(userId) {
|
|
462
|
+
if (!this.token) {
|
|
463
|
+
throw new Error("Not authenticated");
|
|
464
|
+
}
|
|
465
|
+
const response = await this.httpClient.post(`/api/v1/admin/activate-user/${userId}`, {});
|
|
466
|
+
return response;
|
|
467
|
+
}
|
|
299
468
|
};
|
|
300
469
|
var useAuth = (config) => {
|
|
301
470
|
const [authService] = react.useState(() => new AuthService(config));
|
|
@@ -306,8 +475,8 @@ var useAuth = (config) => {
|
|
|
306
475
|
const authenticated = authService.isAuthenticated();
|
|
307
476
|
setIsAuthenticated(authenticated);
|
|
308
477
|
if (authenticated) {
|
|
309
|
-
const
|
|
310
|
-
setUser(
|
|
478
|
+
const currentUser2 = authService.getCurrentUser();
|
|
479
|
+
setUser(currentUser2);
|
|
311
480
|
} else {
|
|
312
481
|
setUser(null);
|
|
313
482
|
}
|
|
@@ -319,11 +488,7 @@ var useAuth = (config) => {
|
|
|
319
488
|
const register = react.useCallback(async (data) => {
|
|
320
489
|
setLoading(true);
|
|
321
490
|
try {
|
|
322
|
-
const
|
|
323
|
-
if (!registerData.frontendBaseUrl && typeof window !== "undefined") {
|
|
324
|
-
registerData.frontendBaseUrl = process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
|
|
325
|
-
}
|
|
326
|
-
const response = await authService.register(registerData);
|
|
491
|
+
const response = await authService.register(data);
|
|
327
492
|
return response;
|
|
328
493
|
} finally {
|
|
329
494
|
setLoading(false);
|
|
@@ -431,101 +596,373 @@ var useAuth = (config) => {
|
|
|
431
596
|
getUserById
|
|
432
597
|
};
|
|
433
598
|
};
|
|
434
|
-
var
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
const [
|
|
444
|
-
const [
|
|
445
|
-
const
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
599
|
+
var AuthContext = react.createContext(void 0);
|
|
600
|
+
var AuthProvider = ({ children, config }) => {
|
|
601
|
+
const authConfig = {
|
|
602
|
+
baseUrl: config?.baseUrl || (typeof window !== "undefined" ? process.env.NEXT_PUBLIC_AUTH_API_URL || process.env.REACT_APP_AUTH_API_URL || "http://localhost:7000" : "http://localhost:7000"),
|
|
603
|
+
localStorageKey: config?.localStorageKey || "auth_token",
|
|
604
|
+
csrfEnabled: config?.csrfEnabled !== void 0 ? config.csrfEnabled : true
|
|
605
|
+
};
|
|
606
|
+
const [authService] = react.useState(() => new AuthService(authConfig));
|
|
607
|
+
const [user, setUser] = react.useState(null);
|
|
608
|
+
const [isLoaded, setIsLoaded] = react.useState(false);
|
|
609
|
+
const [loading, setLoading] = react.useState(false);
|
|
610
|
+
const checkAuthStatus = react.useCallback(async () => {
|
|
611
|
+
const authenticated = authService.isAuthenticated();
|
|
612
|
+
if (authenticated) {
|
|
613
|
+
try {
|
|
614
|
+
const currentUser2 = authService.getCurrentUser();
|
|
615
|
+
setUser(currentUser2);
|
|
616
|
+
} catch (error) {
|
|
617
|
+
console.error("Failed to get current user:", error);
|
|
618
|
+
setUser(null);
|
|
619
|
+
}
|
|
620
|
+
} else {
|
|
621
|
+
setUser(null);
|
|
622
|
+
}
|
|
623
|
+
setIsLoaded(true);
|
|
624
|
+
}, [authService]);
|
|
625
|
+
react.useEffect(() => {
|
|
626
|
+
checkAuthStatus();
|
|
627
|
+
}, [checkAuthStatus]);
|
|
628
|
+
const signIn = react.useCallback(async (data) => {
|
|
629
|
+
setLoading(true);
|
|
457
630
|
try {
|
|
458
|
-
|
|
459
|
-
if (
|
|
460
|
-
response
|
|
461
|
-
} else {
|
|
462
|
-
response = await login({ email });
|
|
631
|
+
const response = await authService.login(data);
|
|
632
|
+
if (response.success && response.user) {
|
|
633
|
+
setUser(response.user);
|
|
463
634
|
}
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
635
|
+
return response;
|
|
636
|
+
} finally {
|
|
637
|
+
setLoading(false);
|
|
638
|
+
}
|
|
639
|
+
}, [authService]);
|
|
640
|
+
const signUp = react.useCallback(async (data) => {
|
|
641
|
+
setLoading(true);
|
|
642
|
+
try {
|
|
643
|
+
const response = await authService.register(data);
|
|
644
|
+
return response;
|
|
645
|
+
} finally {
|
|
646
|
+
setLoading(false);
|
|
647
|
+
}
|
|
648
|
+
}, [authService]);
|
|
649
|
+
const signOut = react.useCallback(async () => {
|
|
650
|
+
setLoading(true);
|
|
651
|
+
try {
|
|
652
|
+
await authService.logout();
|
|
653
|
+
setUser(null);
|
|
654
|
+
} finally {
|
|
655
|
+
setLoading(false);
|
|
656
|
+
}
|
|
657
|
+
}, [authService]);
|
|
658
|
+
const verify = react.useCallback(async (data) => {
|
|
659
|
+
setLoading(true);
|
|
660
|
+
try {
|
|
661
|
+
const response = await authService.verify(data);
|
|
662
|
+
if (response.success && response.user) {
|
|
663
|
+
setUser(response.user);
|
|
477
664
|
}
|
|
478
|
-
|
|
479
|
-
setError(err instanceof Error ? err.message : "An unknown error occurred");
|
|
665
|
+
return response;
|
|
480
666
|
} finally {
|
|
481
|
-
|
|
667
|
+
setLoading(false);
|
|
482
668
|
}
|
|
483
|
-
};
|
|
484
|
-
const
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
669
|
+
}, [authService]);
|
|
670
|
+
const verifyEmailToken = react.useCallback(async (token) => {
|
|
671
|
+
setLoading(true);
|
|
672
|
+
try {
|
|
673
|
+
const response = await authService.verifyEmailToken(token);
|
|
674
|
+
if (response.success && response.user) {
|
|
675
|
+
setUser(response.user);
|
|
676
|
+
}
|
|
677
|
+
return response;
|
|
678
|
+
} finally {
|
|
679
|
+
setLoading(false);
|
|
680
|
+
}
|
|
681
|
+
}, [authService]);
|
|
682
|
+
const updateProfile = react.useCallback(async (data) => {
|
|
683
|
+
setLoading(true);
|
|
684
|
+
try {
|
|
685
|
+
const response = await authService.updateProfile(data);
|
|
686
|
+
if (response.success && response.user) {
|
|
687
|
+
setUser(response.user);
|
|
688
|
+
}
|
|
689
|
+
return response;
|
|
690
|
+
} finally {
|
|
691
|
+
setLoading(false);
|
|
692
|
+
}
|
|
693
|
+
}, [authService]);
|
|
694
|
+
const getProfile = react.useCallback(async () => {
|
|
695
|
+
setLoading(true);
|
|
696
|
+
try {
|
|
697
|
+
const userData = await authService.getProfile();
|
|
698
|
+
setUser(userData);
|
|
699
|
+
return userData;
|
|
700
|
+
} finally {
|
|
701
|
+
setLoading(false);
|
|
702
|
+
}
|
|
703
|
+
}, [authService]);
|
|
704
|
+
const signInWithOAuth = react.useCallback((provider) => {
|
|
705
|
+
authService.loginWithOAuth(provider);
|
|
706
|
+
}, [authService]);
|
|
707
|
+
const linkOAuthProvider = react.useCallback((provider) => {
|
|
708
|
+
authService.linkOAuthProvider(provider);
|
|
709
|
+
}, [authService]);
|
|
710
|
+
const unlinkOAuthProvider = react.useCallback(async (provider) => {
|
|
711
|
+
setLoading(true);
|
|
712
|
+
try {
|
|
713
|
+
return await authService.unlinkOAuthProvider(provider);
|
|
714
|
+
} finally {
|
|
715
|
+
setLoading(false);
|
|
716
|
+
}
|
|
717
|
+
}, [authService]);
|
|
718
|
+
const forgotPassword = react.useCallback(async (email) => {
|
|
719
|
+
setLoading(true);
|
|
720
|
+
try {
|
|
721
|
+
return await authService.forgotPassword(email);
|
|
722
|
+
} finally {
|
|
723
|
+
setLoading(false);
|
|
724
|
+
}
|
|
725
|
+
}, [authService]);
|
|
726
|
+
const resetPassword = react.useCallback(async (token, password) => {
|
|
727
|
+
setLoading(true);
|
|
728
|
+
try {
|
|
729
|
+
return await authService.resetPassword(token, password);
|
|
730
|
+
} finally {
|
|
731
|
+
setLoading(false);
|
|
732
|
+
}
|
|
733
|
+
}, [authService]);
|
|
734
|
+
const changePassword = react.useCallback(async (oldPassword, newPassword) => {
|
|
735
|
+
setLoading(true);
|
|
736
|
+
try {
|
|
737
|
+
return await authService.changePassword(oldPassword, newPassword);
|
|
738
|
+
} finally {
|
|
739
|
+
setLoading(false);
|
|
740
|
+
}
|
|
741
|
+
}, [authService]);
|
|
742
|
+
const updateAvatar = react.useCallback(async (avatar) => {
|
|
743
|
+
setLoading(true);
|
|
744
|
+
try {
|
|
745
|
+
const response = await authService.updateAvatar(avatar);
|
|
746
|
+
if (response.success && response.user) {
|
|
747
|
+
setUser(response.user);
|
|
748
|
+
}
|
|
749
|
+
return response;
|
|
750
|
+
} finally {
|
|
751
|
+
setLoading(false);
|
|
752
|
+
}
|
|
753
|
+
}, [authService]);
|
|
754
|
+
const requestEmailChange = react.useCallback(async (newEmail) => {
|
|
755
|
+
setLoading(true);
|
|
756
|
+
try {
|
|
757
|
+
return await authService.requestEmailChange(newEmail);
|
|
758
|
+
} finally {
|
|
759
|
+
setLoading(false);
|
|
760
|
+
}
|
|
761
|
+
}, [authService]);
|
|
762
|
+
const verifyEmailChange = react.useCallback(async (token) => {
|
|
763
|
+
setLoading(true);
|
|
764
|
+
try {
|
|
765
|
+
const response = await authService.verifyEmailChange(token);
|
|
766
|
+
if (response.success && response.user) {
|
|
767
|
+
setUser(response.user);
|
|
768
|
+
}
|
|
769
|
+
return response;
|
|
770
|
+
} finally {
|
|
771
|
+
setLoading(false);
|
|
772
|
+
}
|
|
773
|
+
}, [authService]);
|
|
774
|
+
const generate2FA = react.useCallback(async () => {
|
|
775
|
+
setLoading(true);
|
|
776
|
+
try {
|
|
777
|
+
return await authService.generate2FA();
|
|
778
|
+
} finally {
|
|
779
|
+
setLoading(false);
|
|
780
|
+
}
|
|
781
|
+
}, [authService]);
|
|
782
|
+
const enable2FA = react.useCallback(async (token) => {
|
|
783
|
+
setLoading(true);
|
|
784
|
+
try {
|
|
785
|
+
return await authService.enable2FA(token);
|
|
786
|
+
} finally {
|
|
787
|
+
setLoading(false);
|
|
788
|
+
}
|
|
789
|
+
}, [authService]);
|
|
790
|
+
const disable2FA = react.useCallback(async (token) => {
|
|
791
|
+
setLoading(true);
|
|
792
|
+
try {
|
|
793
|
+
return await authService.disable2FA(token);
|
|
794
|
+
} finally {
|
|
795
|
+
setLoading(false);
|
|
796
|
+
}
|
|
797
|
+
}, [authService]);
|
|
798
|
+
const validate2FA = react.useCallback(async (token) => {
|
|
799
|
+
setLoading(true);
|
|
800
|
+
try {
|
|
801
|
+
return await authService.validate2FA(token);
|
|
802
|
+
} finally {
|
|
803
|
+
setLoading(false);
|
|
804
|
+
}
|
|
805
|
+
}, [authService]);
|
|
806
|
+
const getSessions = react.useCallback(async () => {
|
|
807
|
+
setLoading(true);
|
|
808
|
+
try {
|
|
809
|
+
return await authService.getSessions();
|
|
810
|
+
} finally {
|
|
811
|
+
setLoading(false);
|
|
812
|
+
}
|
|
813
|
+
}, [authService]);
|
|
814
|
+
const revokeSession = react.useCallback(async (sessionId) => {
|
|
815
|
+
setLoading(true);
|
|
816
|
+
try {
|
|
817
|
+
return await authService.revokeSession(sessionId);
|
|
818
|
+
} finally {
|
|
819
|
+
setLoading(false);
|
|
820
|
+
}
|
|
821
|
+
}, [authService]);
|
|
822
|
+
const revokeAllSessions = react.useCallback(async () => {
|
|
823
|
+
setLoading(true);
|
|
824
|
+
try {
|
|
825
|
+
const response = await authService.revokeAllSessions();
|
|
826
|
+
setUser(null);
|
|
827
|
+
return response;
|
|
828
|
+
} finally {
|
|
829
|
+
setLoading(false);
|
|
830
|
+
}
|
|
831
|
+
}, [authService]);
|
|
832
|
+
const value = {
|
|
833
|
+
user,
|
|
834
|
+
isLoaded,
|
|
835
|
+
isSignedIn: !!user,
|
|
836
|
+
loading,
|
|
837
|
+
signIn,
|
|
838
|
+
signUp,
|
|
839
|
+
signOut,
|
|
840
|
+
verify,
|
|
841
|
+
verifyEmailToken,
|
|
842
|
+
updateProfile,
|
|
843
|
+
getProfile,
|
|
844
|
+
signInWithOAuth,
|
|
845
|
+
linkOAuthProvider,
|
|
846
|
+
unlinkOAuthProvider,
|
|
847
|
+
forgotPassword,
|
|
848
|
+
resetPassword,
|
|
849
|
+
changePassword,
|
|
850
|
+
updateAvatar,
|
|
851
|
+
requestEmailChange,
|
|
852
|
+
verifyEmailChange,
|
|
853
|
+
generate2FA,
|
|
854
|
+
enable2FA,
|
|
855
|
+
disable2FA,
|
|
856
|
+
validate2FA,
|
|
857
|
+
getSessions,
|
|
858
|
+
revokeSession,
|
|
859
|
+
revokeAllSessions,
|
|
860
|
+
authService
|
|
861
|
+
};
|
|
862
|
+
return /* @__PURE__ */ jsxRuntime.jsx(AuthContext.Provider, { value, children });
|
|
863
|
+
};
|
|
864
|
+
var useAuth2 = () => {
|
|
865
|
+
const context = react.useContext(AuthContext);
|
|
866
|
+
if (context === void 0) {
|
|
867
|
+
throw new Error("useAuth must be used within an AuthProvider");
|
|
868
|
+
}
|
|
869
|
+
return context;
|
|
870
|
+
};
|
|
871
|
+
var LoginForm = ({
|
|
872
|
+
onSuccess,
|
|
873
|
+
onLoginSuccess,
|
|
874
|
+
onRegisterClick,
|
|
875
|
+
showRegisterLink = true,
|
|
876
|
+
config,
|
|
877
|
+
oauthProviders = ["google", "github"],
|
|
878
|
+
showOAuthButtons = true
|
|
879
|
+
}) => {
|
|
880
|
+
const [email, setEmail] = react.useState("");
|
|
881
|
+
const [password, setPassword] = react.useState("");
|
|
882
|
+
const [usePassword, setUsePassword] = react.useState(false);
|
|
883
|
+
const [showPassword, setShowPassword] = react.useState(false);
|
|
884
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
885
|
+
const [error, setError] = react.useState(null);
|
|
886
|
+
const [rememberMe, setRememberMe] = react.useState(false);
|
|
887
|
+
const { login } = useAuth({
|
|
888
|
+
baseUrl: config?.baseUrl || (typeof window !== "undefined" ? window.location.origin : "http://localhost:7000")
|
|
889
|
+
});
|
|
890
|
+
const handleSubmit = async (e) => {
|
|
891
|
+
e.preventDefault();
|
|
892
|
+
setIsLoading(true);
|
|
893
|
+
setError(null);
|
|
894
|
+
try {
|
|
895
|
+
let response;
|
|
896
|
+
if (usePassword) {
|
|
897
|
+
response = await login({ email, password });
|
|
898
|
+
} else {
|
|
899
|
+
response = await login({ email });
|
|
900
|
+
}
|
|
901
|
+
if (response.success) {
|
|
902
|
+
onSuccess?.(response);
|
|
903
|
+
if (onLoginSuccess) {
|
|
904
|
+
if (response.message === "OTP sent to your email.") {
|
|
905
|
+
onLoginSuccess(email, true);
|
|
906
|
+
} else if (response.token) {
|
|
907
|
+
onLoginSuccess(email, false);
|
|
908
|
+
} else {
|
|
909
|
+
onLoginSuccess(email, true);
|
|
910
|
+
}
|
|
911
|
+
}
|
|
912
|
+
} else {
|
|
913
|
+
setError(response.message || "Login failed");
|
|
914
|
+
}
|
|
915
|
+
} catch (err) {
|
|
916
|
+
setError(err instanceof Error ? err.message : "An unknown error occurred");
|
|
917
|
+
} finally {
|
|
918
|
+
setIsLoading(false);
|
|
919
|
+
}
|
|
920
|
+
};
|
|
921
|
+
const toggleAuthMethod = () => {
|
|
922
|
+
setUsePassword(!usePassword);
|
|
923
|
+
setError(null);
|
|
924
|
+
};
|
|
925
|
+
const togglePasswordVisibility = () => {
|
|
926
|
+
setShowPassword(!showPassword);
|
|
927
|
+
};
|
|
928
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
929
|
+
maxWidth: "400px",
|
|
930
|
+
margin: "0 auto",
|
|
931
|
+
padding: "30px",
|
|
932
|
+
borderRadius: "12px",
|
|
933
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
934
|
+
backgroundColor: "#ffffff",
|
|
935
|
+
border: "1px solid #eaeaea"
|
|
936
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, style: {
|
|
937
|
+
display: "flex",
|
|
938
|
+
flexDirection: "column"
|
|
939
|
+
}, children: [
|
|
940
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
941
|
+
textAlign: "center",
|
|
942
|
+
marginBottom: "24px",
|
|
943
|
+
color: "#1f2937",
|
|
944
|
+
fontSize: "24px",
|
|
945
|
+
fontWeight: 600
|
|
946
|
+
}, children: usePassword ? "Login with Password" : "Login with OTP" }),
|
|
947
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
948
|
+
padding: "12px 16px",
|
|
949
|
+
marginBottom: "20px",
|
|
950
|
+
backgroundColor: "#f8d7da",
|
|
951
|
+
color: "#721c24",
|
|
952
|
+
border: "1px solid #f5c6cb",
|
|
953
|
+
borderRadius: "8px",
|
|
954
|
+
fontSize: "14px",
|
|
955
|
+
fontWeight: 500
|
|
956
|
+
}, children: error }),
|
|
957
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
958
|
+
marginBottom: "20px"
|
|
959
|
+
}, children: [
|
|
960
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "email", style: {
|
|
961
|
+
display: "block",
|
|
962
|
+
marginBottom: "8px",
|
|
963
|
+
fontWeight: 500,
|
|
964
|
+
color: "#374151",
|
|
965
|
+
fontSize: "14px"
|
|
529
966
|
}, children: "Email:" }),
|
|
530
967
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
531
968
|
"input",
|
|
@@ -1745,15 +2182,1810 @@ var EmailVerificationPage = ({
|
|
|
1745
2182
|
] })
|
|
1746
2183
|
] }) });
|
|
1747
2184
|
};
|
|
1748
|
-
var
|
|
1749
|
-
|
|
1750
|
-
const [
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
2185
|
+
var SignIn = ({ redirectUrl, appearance }) => {
|
|
2186
|
+
const { signIn, isSignedIn, loading: authLoading } = useAuth2();
|
|
2187
|
+
const [email, setEmail] = react.useState("");
|
|
2188
|
+
const [password, setPassword] = react.useState("");
|
|
2189
|
+
const [otp, setOtp] = react.useState("");
|
|
2190
|
+
const [usePassword, setUsePassword] = react.useState(false);
|
|
2191
|
+
const [showPassword, setShowPassword] = react.useState(false);
|
|
2192
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
2193
|
+
const [error, setError] = react.useState(null);
|
|
2194
|
+
const [needsOtp, setNeedsOtp] = react.useState(false);
|
|
2195
|
+
const [success, setSuccess] = react.useState(null);
|
|
2196
|
+
react.useEffect(() => {
|
|
2197
|
+
if (isSignedIn && redirectUrl) {
|
|
2198
|
+
const redirect2 = redirectUrl || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_AFTER_LOGIN || "/dashboard";
|
|
2199
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2200
|
+
window.location.href = `${baseUrl}${redirect2}`;
|
|
1755
2201
|
}
|
|
1756
|
-
|
|
2202
|
+
}, [isSignedIn, redirectUrl]);
|
|
2203
|
+
const handleSubmit = async (e) => {
|
|
2204
|
+
e.preventDefault();
|
|
2205
|
+
setIsLoading(true);
|
|
2206
|
+
setError(null);
|
|
2207
|
+
setSuccess(null);
|
|
2208
|
+
try {
|
|
2209
|
+
if (needsOtp) {
|
|
2210
|
+
const response = await signIn({ email, otp });
|
|
2211
|
+
if (response.success) {
|
|
2212
|
+
setSuccess("Login successful!");
|
|
2213
|
+
} else {
|
|
2214
|
+
setError(response.message || "OTP verification failed");
|
|
2215
|
+
}
|
|
2216
|
+
} else if (usePassword) {
|
|
2217
|
+
const response = await signIn({ email, password });
|
|
2218
|
+
if (response.success) {
|
|
2219
|
+
setSuccess("Login successful!");
|
|
2220
|
+
} else {
|
|
2221
|
+
setError(response.message || "Login failed");
|
|
2222
|
+
}
|
|
2223
|
+
} else {
|
|
2224
|
+
const response = await signIn({ email });
|
|
2225
|
+
if (response.success && response.message === "OTP sent to your email.") {
|
|
2226
|
+
setNeedsOtp(true);
|
|
2227
|
+
setSuccess("OTP sent to your email. Please check your inbox.");
|
|
2228
|
+
} else {
|
|
2229
|
+
setError(response.message || "Failed to send OTP");
|
|
2230
|
+
}
|
|
2231
|
+
}
|
|
2232
|
+
} catch (err) {
|
|
2233
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
2234
|
+
} finally {
|
|
2235
|
+
setIsLoading(false);
|
|
2236
|
+
}
|
|
2237
|
+
};
|
|
2238
|
+
const toggleAuthMethod = () => {
|
|
2239
|
+
setUsePassword(!usePassword);
|
|
2240
|
+
setNeedsOtp(false);
|
|
2241
|
+
setError(null);
|
|
2242
|
+
setSuccess(null);
|
|
2243
|
+
setOtp("");
|
|
2244
|
+
};
|
|
2245
|
+
if (authLoading) {
|
|
2246
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center", padding: "40px" }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Loading..." }) });
|
|
2247
|
+
}
|
|
2248
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2249
|
+
maxWidth: "400px",
|
|
2250
|
+
margin: "0 auto",
|
|
2251
|
+
padding: "30px",
|
|
2252
|
+
borderRadius: "12px",
|
|
2253
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
2254
|
+
backgroundColor: "#ffffff",
|
|
2255
|
+
border: "1px solid #eaeaea",
|
|
2256
|
+
...appearance?.elements?.card
|
|
2257
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
|
|
2258
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
2259
|
+
textAlign: "center",
|
|
2260
|
+
marginBottom: "24px",
|
|
2261
|
+
color: "#1f2937",
|
|
2262
|
+
fontSize: "24px",
|
|
2263
|
+
fontWeight: 600,
|
|
2264
|
+
...appearance?.elements?.headerTitle
|
|
2265
|
+
}, children: needsOtp ? "Enter OTP" : usePassword ? "Sign in with password" : "Sign in" }),
|
|
2266
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2267
|
+
padding: "12px 16px",
|
|
2268
|
+
marginBottom: "20px",
|
|
2269
|
+
backgroundColor: "#fee",
|
|
2270
|
+
color: "#c33",
|
|
2271
|
+
border: "1px solid #fcc",
|
|
2272
|
+
borderRadius: "8px",
|
|
2273
|
+
fontSize: "14px"
|
|
2274
|
+
}, children: error }),
|
|
2275
|
+
success && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2276
|
+
padding: "12px 16px",
|
|
2277
|
+
marginBottom: "20px",
|
|
2278
|
+
backgroundColor: "#efe",
|
|
2279
|
+
color: "#3c3",
|
|
2280
|
+
border: "1px solid #cfc",
|
|
2281
|
+
borderRadius: "8px",
|
|
2282
|
+
fontSize: "14px"
|
|
2283
|
+
}, children: success }),
|
|
2284
|
+
!needsOtp && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
2285
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "email", style: {
|
|
2286
|
+
display: "block",
|
|
2287
|
+
marginBottom: "8px",
|
|
2288
|
+
fontWeight: 500,
|
|
2289
|
+
color: "#374151",
|
|
2290
|
+
fontSize: "14px"
|
|
2291
|
+
}, children: "Email" }),
|
|
2292
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2293
|
+
"input",
|
|
2294
|
+
{
|
|
2295
|
+
id: "email",
|
|
2296
|
+
type: "email",
|
|
2297
|
+
value: email,
|
|
2298
|
+
onChange: (e) => setEmail(e.target.value),
|
|
2299
|
+
required: true,
|
|
2300
|
+
disabled: isLoading,
|
|
2301
|
+
style: {
|
|
2302
|
+
width: "100%",
|
|
2303
|
+
padding: "12px 16px",
|
|
2304
|
+
border: "1px solid #ddd",
|
|
2305
|
+
borderRadius: "8px",
|
|
2306
|
+
fontSize: "16px",
|
|
2307
|
+
boxSizing: "border-box",
|
|
2308
|
+
...appearance?.elements?.formFieldInput
|
|
2309
|
+
},
|
|
2310
|
+
placeholder: "Enter your email"
|
|
2311
|
+
}
|
|
2312
|
+
)
|
|
2313
|
+
] }),
|
|
2314
|
+
usePassword && !needsOtp && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px", position: "relative" }, children: [
|
|
2315
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "password", style: {
|
|
2316
|
+
display: "block",
|
|
2317
|
+
marginBottom: "8px",
|
|
2318
|
+
fontWeight: 500,
|
|
2319
|
+
color: "#374151",
|
|
2320
|
+
fontSize: "14px"
|
|
2321
|
+
}, children: "Password" }),
|
|
2322
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2323
|
+
"input",
|
|
2324
|
+
{
|
|
2325
|
+
id: "password",
|
|
2326
|
+
type: showPassword ? "text" : "password",
|
|
2327
|
+
value: password,
|
|
2328
|
+
onChange: (e) => setPassword(e.target.value),
|
|
2329
|
+
required: true,
|
|
2330
|
+
disabled: isLoading,
|
|
2331
|
+
style: {
|
|
2332
|
+
width: "100%",
|
|
2333
|
+
padding: "12px 16px",
|
|
2334
|
+
border: "1px solid #ddd",
|
|
2335
|
+
borderRadius: "8px",
|
|
2336
|
+
fontSize: "16px",
|
|
2337
|
+
boxSizing: "border-box",
|
|
2338
|
+
...appearance?.elements?.formFieldInput
|
|
2339
|
+
},
|
|
2340
|
+
placeholder: "Enter your password"
|
|
2341
|
+
}
|
|
2342
|
+
),
|
|
2343
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2344
|
+
"button",
|
|
2345
|
+
{
|
|
2346
|
+
type: "button",
|
|
2347
|
+
onClick: () => setShowPassword(!showPassword),
|
|
2348
|
+
style: {
|
|
2349
|
+
position: "absolute",
|
|
2350
|
+
right: "12px",
|
|
2351
|
+
top: "38px",
|
|
2352
|
+
background: "none",
|
|
2353
|
+
border: "none",
|
|
2354
|
+
cursor: "pointer",
|
|
2355
|
+
color: "#666",
|
|
2356
|
+
fontSize: "14px"
|
|
2357
|
+
},
|
|
2358
|
+
children: showPassword ? "Hide" : "Show"
|
|
2359
|
+
}
|
|
2360
|
+
)
|
|
2361
|
+
] }),
|
|
2362
|
+
needsOtp && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
2363
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "otp", style: {
|
|
2364
|
+
display: "block",
|
|
2365
|
+
marginBottom: "8px",
|
|
2366
|
+
fontWeight: 500,
|
|
2367
|
+
color: "#374151",
|
|
2368
|
+
fontSize: "14px"
|
|
2369
|
+
}, children: "One-Time Password" }),
|
|
2370
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2371
|
+
"input",
|
|
2372
|
+
{
|
|
2373
|
+
id: "otp",
|
|
2374
|
+
type: "text",
|
|
2375
|
+
value: otp,
|
|
2376
|
+
onChange: (e) => setOtp(e.target.value),
|
|
2377
|
+
required: true,
|
|
2378
|
+
disabled: isLoading,
|
|
2379
|
+
maxLength: 6,
|
|
2380
|
+
style: {
|
|
2381
|
+
width: "100%",
|
|
2382
|
+
padding: "12px 16px",
|
|
2383
|
+
border: "1px solid #ddd",
|
|
2384
|
+
borderRadius: "8px",
|
|
2385
|
+
fontSize: "16px",
|
|
2386
|
+
boxSizing: "border-box",
|
|
2387
|
+
letterSpacing: "0.5em",
|
|
2388
|
+
textAlign: "center",
|
|
2389
|
+
...appearance?.elements?.formFieldInput
|
|
2390
|
+
},
|
|
2391
|
+
placeholder: "000000"
|
|
2392
|
+
}
|
|
2393
|
+
)
|
|
2394
|
+
] }),
|
|
2395
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2396
|
+
"button",
|
|
2397
|
+
{
|
|
2398
|
+
type: "submit",
|
|
2399
|
+
disabled: isLoading,
|
|
2400
|
+
style: {
|
|
2401
|
+
width: "100%",
|
|
2402
|
+
padding: "14px",
|
|
2403
|
+
backgroundColor: "#007bff",
|
|
2404
|
+
color: "white",
|
|
2405
|
+
border: "none",
|
|
2406
|
+
borderRadius: "8px",
|
|
2407
|
+
fontSize: "16px",
|
|
2408
|
+
fontWeight: 600,
|
|
2409
|
+
cursor: "pointer",
|
|
2410
|
+
transition: "all 0.2s ease",
|
|
2411
|
+
...appearance?.elements?.formButtonPrimary
|
|
2412
|
+
},
|
|
2413
|
+
children: isLoading ? "Please wait..." : needsOtp ? "Verify OTP" : usePassword ? "Sign in" : "Continue with email"
|
|
2414
|
+
}
|
|
2415
|
+
),
|
|
2416
|
+
!needsOtp && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center", marginTop: "16px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2417
|
+
"button",
|
|
2418
|
+
{
|
|
2419
|
+
type: "button",
|
|
2420
|
+
onClick: toggleAuthMethod,
|
|
2421
|
+
disabled: isLoading,
|
|
2422
|
+
style: {
|
|
2423
|
+
background: "none",
|
|
2424
|
+
border: "none",
|
|
2425
|
+
color: "#007bff",
|
|
2426
|
+
cursor: "pointer",
|
|
2427
|
+
fontSize: "14px",
|
|
2428
|
+
fontWeight: 600
|
|
2429
|
+
},
|
|
2430
|
+
children: usePassword ? "Use email code instead" : "Use password instead"
|
|
2431
|
+
}
|
|
2432
|
+
) }),
|
|
2433
|
+
needsOtp && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center", marginTop: "16px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2434
|
+
"button",
|
|
2435
|
+
{
|
|
2436
|
+
type: "button",
|
|
2437
|
+
onClick: () => {
|
|
2438
|
+
setNeedsOtp(false);
|
|
2439
|
+
setOtp("");
|
|
2440
|
+
setError(null);
|
|
2441
|
+
setSuccess(null);
|
|
2442
|
+
},
|
|
2443
|
+
disabled: isLoading,
|
|
2444
|
+
style: {
|
|
2445
|
+
background: "none",
|
|
2446
|
+
border: "none",
|
|
2447
|
+
color: "#007bff",
|
|
2448
|
+
cursor: "pointer",
|
|
2449
|
+
fontSize: "14px",
|
|
2450
|
+
fontWeight: 600
|
|
2451
|
+
},
|
|
2452
|
+
children: "Back to sign in"
|
|
2453
|
+
}
|
|
2454
|
+
) })
|
|
2455
|
+
] }) });
|
|
2456
|
+
};
|
|
2457
|
+
var SignUp = ({ redirectUrl, appearance }) => {
|
|
2458
|
+
const { signUp, isSignedIn } = useAuth2();
|
|
2459
|
+
const [name, setName] = react.useState("");
|
|
2460
|
+
const [email, setEmail] = react.useState("");
|
|
2461
|
+
const [password, setPassword] = react.useState("");
|
|
2462
|
+
const [confirmPassword, setConfirmPassword] = react.useState("");
|
|
2463
|
+
const [showPassword, setShowPassword] = react.useState(false);
|
|
2464
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
2465
|
+
const [error, setError] = react.useState(null);
|
|
2466
|
+
const [success, setSuccess] = react.useState(null);
|
|
2467
|
+
react.useEffect(() => {
|
|
2468
|
+
if (isSignedIn && redirectUrl) {
|
|
2469
|
+
const redirect2 = redirectUrl || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_REGISTER || process.env.REACT_APP_AUTH_REDIRECT_AFTER_REGISTER || "/dashboard";
|
|
2470
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2471
|
+
window.location.href = `${baseUrl}${redirect2}`;
|
|
2472
|
+
}
|
|
2473
|
+
}, [isSignedIn, redirectUrl]);
|
|
2474
|
+
const getPasswordStrength = (pwd) => {
|
|
2475
|
+
if (!pwd)
|
|
2476
|
+
return { strength: "weak", color: "#ddd" };
|
|
2477
|
+
let score = 0;
|
|
2478
|
+
if (pwd.length >= 6)
|
|
2479
|
+
score++;
|
|
2480
|
+
if (pwd.length >= 8)
|
|
2481
|
+
score++;
|
|
2482
|
+
if (/[a-z]/.test(pwd) && /[A-Z]/.test(pwd))
|
|
2483
|
+
score++;
|
|
2484
|
+
if (/\d/.test(pwd))
|
|
2485
|
+
score++;
|
|
2486
|
+
if (/[^a-zA-Z\d]/.test(pwd))
|
|
2487
|
+
score++;
|
|
2488
|
+
if (score <= 2)
|
|
2489
|
+
return { strength: "weak", color: "#f44" };
|
|
2490
|
+
if (score <= 3)
|
|
2491
|
+
return { strength: "medium", color: "#fa4" };
|
|
2492
|
+
return { strength: "strong", color: "#4f4" };
|
|
2493
|
+
};
|
|
2494
|
+
const passwordStrength = getPasswordStrength(password);
|
|
2495
|
+
const handleSubmit = async (e) => {
|
|
2496
|
+
e.preventDefault();
|
|
2497
|
+
setIsLoading(true);
|
|
2498
|
+
setError(null);
|
|
2499
|
+
setSuccess(null);
|
|
2500
|
+
if (password !== confirmPassword) {
|
|
2501
|
+
setError("Passwords do not match");
|
|
2502
|
+
setIsLoading(false);
|
|
2503
|
+
return;
|
|
2504
|
+
}
|
|
2505
|
+
if (password.length < 6) {
|
|
2506
|
+
setError("Password must be at least 6 characters");
|
|
2507
|
+
setIsLoading(false);
|
|
2508
|
+
return;
|
|
2509
|
+
}
|
|
2510
|
+
try {
|
|
2511
|
+
const response = await signUp({ name, email, password });
|
|
2512
|
+
if (response.success) {
|
|
2513
|
+
setSuccess("Registration successful! Please check your email to verify your account.");
|
|
2514
|
+
} else {
|
|
2515
|
+
setError(response.message || "Registration failed");
|
|
2516
|
+
}
|
|
2517
|
+
} catch (err) {
|
|
2518
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
2519
|
+
} finally {
|
|
2520
|
+
setIsLoading(false);
|
|
2521
|
+
}
|
|
2522
|
+
};
|
|
2523
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2524
|
+
maxWidth: "400px",
|
|
2525
|
+
margin: "0 auto",
|
|
2526
|
+
padding: "30px",
|
|
2527
|
+
borderRadius: "12px",
|
|
2528
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
2529
|
+
backgroundColor: "#ffffff",
|
|
2530
|
+
border: "1px solid #eaeaea",
|
|
2531
|
+
...appearance?.elements?.card
|
|
2532
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
|
|
2533
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
2534
|
+
textAlign: "center",
|
|
2535
|
+
marginBottom: "24px",
|
|
2536
|
+
color: "#1f2937",
|
|
2537
|
+
fontSize: "24px",
|
|
2538
|
+
fontWeight: 600,
|
|
2539
|
+
...appearance?.elements?.headerTitle
|
|
2540
|
+
}, children: "Create your account" }),
|
|
2541
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2542
|
+
padding: "12px 16px",
|
|
2543
|
+
marginBottom: "20px",
|
|
2544
|
+
backgroundColor: "#fee",
|
|
2545
|
+
color: "#c33",
|
|
2546
|
+
border: "1px solid #fcc",
|
|
2547
|
+
borderRadius: "8px",
|
|
2548
|
+
fontSize: "14px"
|
|
2549
|
+
}, children: error }),
|
|
2550
|
+
success && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2551
|
+
padding: "12px 16px",
|
|
2552
|
+
marginBottom: "20px",
|
|
2553
|
+
backgroundColor: "#efe",
|
|
2554
|
+
color: "#3c3",
|
|
2555
|
+
border: "1px solid #cfc",
|
|
2556
|
+
borderRadius: "8px",
|
|
2557
|
+
fontSize: "14px"
|
|
2558
|
+
}, children: success }),
|
|
2559
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
2560
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "name", style: {
|
|
2561
|
+
display: "block",
|
|
2562
|
+
marginBottom: "8px",
|
|
2563
|
+
fontWeight: 500,
|
|
2564
|
+
color: "#374151",
|
|
2565
|
+
fontSize: "14px"
|
|
2566
|
+
}, children: "Full name" }),
|
|
2567
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2568
|
+
"input",
|
|
2569
|
+
{
|
|
2570
|
+
id: "name",
|
|
2571
|
+
type: "text",
|
|
2572
|
+
value: name,
|
|
2573
|
+
onChange: (e) => setName(e.target.value),
|
|
2574
|
+
required: true,
|
|
2575
|
+
disabled: isLoading,
|
|
2576
|
+
style: {
|
|
2577
|
+
width: "100%",
|
|
2578
|
+
padding: "12px 16px",
|
|
2579
|
+
border: "1px solid #ddd",
|
|
2580
|
+
borderRadius: "8px",
|
|
2581
|
+
fontSize: "16px",
|
|
2582
|
+
boxSizing: "border-box",
|
|
2583
|
+
...appearance?.elements?.formFieldInput
|
|
2584
|
+
},
|
|
2585
|
+
placeholder: "Enter your full name"
|
|
2586
|
+
}
|
|
2587
|
+
)
|
|
2588
|
+
] }),
|
|
2589
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
2590
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "email", style: {
|
|
2591
|
+
display: "block",
|
|
2592
|
+
marginBottom: "8px",
|
|
2593
|
+
fontWeight: 500,
|
|
2594
|
+
color: "#374151",
|
|
2595
|
+
fontSize: "14px"
|
|
2596
|
+
}, children: "Email" }),
|
|
2597
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2598
|
+
"input",
|
|
2599
|
+
{
|
|
2600
|
+
id: "email",
|
|
2601
|
+
type: "email",
|
|
2602
|
+
value: email,
|
|
2603
|
+
onChange: (e) => setEmail(e.target.value),
|
|
2604
|
+
required: true,
|
|
2605
|
+
disabled: isLoading,
|
|
2606
|
+
style: {
|
|
2607
|
+
width: "100%",
|
|
2608
|
+
padding: "12px 16px",
|
|
2609
|
+
border: "1px solid #ddd",
|
|
2610
|
+
borderRadius: "8px",
|
|
2611
|
+
fontSize: "16px",
|
|
2612
|
+
boxSizing: "border-box",
|
|
2613
|
+
...appearance?.elements?.formFieldInput
|
|
2614
|
+
},
|
|
2615
|
+
placeholder: "Enter your email"
|
|
2616
|
+
}
|
|
2617
|
+
)
|
|
2618
|
+
] }),
|
|
2619
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px", position: "relative" }, children: [
|
|
2620
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "password", style: {
|
|
2621
|
+
display: "block",
|
|
2622
|
+
marginBottom: "8px",
|
|
2623
|
+
fontWeight: 500,
|
|
2624
|
+
color: "#374151",
|
|
2625
|
+
fontSize: "14px"
|
|
2626
|
+
}, children: "Password" }),
|
|
2627
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2628
|
+
"input",
|
|
2629
|
+
{
|
|
2630
|
+
id: "password",
|
|
2631
|
+
type: showPassword ? "text" : "password",
|
|
2632
|
+
value: password,
|
|
2633
|
+
onChange: (e) => setPassword(e.target.value),
|
|
2634
|
+
required: true,
|
|
2635
|
+
disabled: isLoading,
|
|
2636
|
+
minLength: 6,
|
|
2637
|
+
style: {
|
|
2638
|
+
width: "100%",
|
|
2639
|
+
padding: "12px 16px",
|
|
2640
|
+
border: "1px solid #ddd",
|
|
2641
|
+
borderRadius: "8px",
|
|
2642
|
+
fontSize: "16px",
|
|
2643
|
+
boxSizing: "border-box",
|
|
2644
|
+
...appearance?.elements?.formFieldInput
|
|
2645
|
+
},
|
|
2646
|
+
placeholder: "Create a password"
|
|
2647
|
+
}
|
|
2648
|
+
),
|
|
2649
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2650
|
+
"button",
|
|
2651
|
+
{
|
|
2652
|
+
type: "button",
|
|
2653
|
+
onClick: () => setShowPassword(!showPassword),
|
|
2654
|
+
style: {
|
|
2655
|
+
position: "absolute",
|
|
2656
|
+
right: "12px",
|
|
2657
|
+
top: "38px",
|
|
2658
|
+
background: "none",
|
|
2659
|
+
border: "none",
|
|
2660
|
+
cursor: "pointer",
|
|
2661
|
+
color: "#666",
|
|
2662
|
+
fontSize: "14px"
|
|
2663
|
+
},
|
|
2664
|
+
children: showPassword ? "Hide" : "Show"
|
|
2665
|
+
}
|
|
2666
|
+
),
|
|
2667
|
+
password && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "8px" }, children: [
|
|
2668
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2669
|
+
height: "4px",
|
|
2670
|
+
backgroundColor: "#eee",
|
|
2671
|
+
borderRadius: "2px",
|
|
2672
|
+
overflow: "hidden"
|
|
2673
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2674
|
+
height: "100%",
|
|
2675
|
+
width: passwordStrength.strength === "weak" ? "33%" : passwordStrength.strength === "medium" ? "66%" : "100%",
|
|
2676
|
+
backgroundColor: passwordStrength.color,
|
|
2677
|
+
transition: "all 0.3s ease"
|
|
2678
|
+
} }) }),
|
|
2679
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { style: {
|
|
2680
|
+
fontSize: "12px",
|
|
2681
|
+
color: passwordStrength.color,
|
|
2682
|
+
marginTop: "4px",
|
|
2683
|
+
textTransform: "capitalize"
|
|
2684
|
+
}, children: [
|
|
2685
|
+
passwordStrength.strength,
|
|
2686
|
+
" password"
|
|
2687
|
+
] })
|
|
2688
|
+
] })
|
|
2689
|
+
] }),
|
|
2690
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
2691
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "confirmPassword", style: {
|
|
2692
|
+
display: "block",
|
|
2693
|
+
marginBottom: "8px",
|
|
2694
|
+
fontWeight: 500,
|
|
2695
|
+
color: "#374151",
|
|
2696
|
+
fontSize: "14px"
|
|
2697
|
+
}, children: "Confirm password" }),
|
|
2698
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2699
|
+
"input",
|
|
2700
|
+
{
|
|
2701
|
+
id: "confirmPassword",
|
|
2702
|
+
type: showPassword ? "text" : "password",
|
|
2703
|
+
value: confirmPassword,
|
|
2704
|
+
onChange: (e) => setConfirmPassword(e.target.value),
|
|
2705
|
+
required: true,
|
|
2706
|
+
disabled: isLoading,
|
|
2707
|
+
style: {
|
|
2708
|
+
width: "100%",
|
|
2709
|
+
padding: "12px 16px",
|
|
2710
|
+
border: "1px solid #ddd",
|
|
2711
|
+
borderRadius: "8px",
|
|
2712
|
+
fontSize: "16px",
|
|
2713
|
+
boxSizing: "border-box",
|
|
2714
|
+
...appearance?.elements?.formFieldInput
|
|
2715
|
+
},
|
|
2716
|
+
placeholder: "Confirm your password"
|
|
2717
|
+
}
|
|
2718
|
+
)
|
|
2719
|
+
] }),
|
|
2720
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2721
|
+
"button",
|
|
2722
|
+
{
|
|
2723
|
+
type: "submit",
|
|
2724
|
+
disabled: isLoading,
|
|
2725
|
+
style: {
|
|
2726
|
+
width: "100%",
|
|
2727
|
+
padding: "14px",
|
|
2728
|
+
backgroundColor: "#007bff",
|
|
2729
|
+
color: "white",
|
|
2730
|
+
border: "none",
|
|
2731
|
+
borderRadius: "8px",
|
|
2732
|
+
fontSize: "16px",
|
|
2733
|
+
fontWeight: 600,
|
|
2734
|
+
cursor: "pointer",
|
|
2735
|
+
transition: "all 0.2s ease",
|
|
2736
|
+
...appearance?.elements?.formButtonPrimary
|
|
2737
|
+
},
|
|
2738
|
+
children: isLoading ? "Creating account..." : "Sign up"
|
|
2739
|
+
}
|
|
2740
|
+
)
|
|
2741
|
+
] }) });
|
|
2742
|
+
};
|
|
2743
|
+
var SignOut = ({ redirectUrl }) => {
|
|
2744
|
+
const { signOut } = useAuth2();
|
|
2745
|
+
react.useEffect(() => {
|
|
2746
|
+
const performSignOut = async () => {
|
|
2747
|
+
await signOut();
|
|
2748
|
+
const redirect2 = redirectUrl || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGOUT || process.env.REACT_APP_AUTH_REDIRECT_AFTER_LOGOUT || "/";
|
|
2749
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2750
|
+
window.location.href = `${baseUrl}${redirect2}`;
|
|
2751
|
+
};
|
|
2752
|
+
performSignOut();
|
|
2753
|
+
}, [signOut, redirectUrl]);
|
|
2754
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center", padding: "40px" }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Signing out..." }) });
|
|
2755
|
+
};
|
|
2756
|
+
var UserButton = ({ showName = false, appearance }) => {
|
|
2757
|
+
const { user, signOut } = useAuth2();
|
|
2758
|
+
const [isOpen, setIsOpen] = react.useState(false);
|
|
2759
|
+
const dropdownRef = react.useRef(null);
|
|
2760
|
+
react.useEffect(() => {
|
|
2761
|
+
const handleClickOutside = (event) => {
|
|
2762
|
+
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
2763
|
+
setIsOpen(false);
|
|
2764
|
+
}
|
|
2765
|
+
};
|
|
2766
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
2767
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
2768
|
+
}, []);
|
|
2769
|
+
if (!user)
|
|
2770
|
+
return null;
|
|
2771
|
+
const getInitials = (name) => {
|
|
2772
|
+
return name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
|
|
2773
|
+
};
|
|
2774
|
+
const handleSignOut = async () => {
|
|
2775
|
+
await signOut();
|
|
2776
|
+
const redirect2 = process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGOUT || process.env.REACT_APP_AUTH_REDIRECT_AFTER_LOGOUT || "/";
|
|
2777
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2778
|
+
window.location.href = `${baseUrl}${redirect2}`;
|
|
2779
|
+
};
|
|
2780
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { position: "relative", ...appearance?.elements?.userButtonBox }, ref: dropdownRef, children: [
|
|
2781
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2782
|
+
"button",
|
|
2783
|
+
{
|
|
2784
|
+
onClick: () => setIsOpen(!isOpen),
|
|
2785
|
+
style: {
|
|
2786
|
+
display: "flex",
|
|
2787
|
+
alignItems: "center",
|
|
2788
|
+
gap: "8px",
|
|
2789
|
+
padding: "6px",
|
|
2790
|
+
backgroundColor: "transparent",
|
|
2791
|
+
border: "none",
|
|
2792
|
+
borderRadius: "8px",
|
|
2793
|
+
cursor: "pointer",
|
|
2794
|
+
transition: "background-color 0.2s",
|
|
2795
|
+
...appearance?.elements?.userButtonTrigger
|
|
2796
|
+
},
|
|
2797
|
+
onMouseEnter: (e) => {
|
|
2798
|
+
e.currentTarget.style.backgroundColor = "#f5f5f5";
|
|
2799
|
+
},
|
|
2800
|
+
onMouseLeave: (e) => {
|
|
2801
|
+
e.currentTarget.style.backgroundColor = "transparent";
|
|
2802
|
+
},
|
|
2803
|
+
children: [
|
|
2804
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2805
|
+
width: "36px",
|
|
2806
|
+
height: "36px",
|
|
2807
|
+
borderRadius: "50%",
|
|
2808
|
+
backgroundColor: "#007bff",
|
|
2809
|
+
color: "white",
|
|
2810
|
+
display: "flex",
|
|
2811
|
+
alignItems: "center",
|
|
2812
|
+
justifyContent: "center",
|
|
2813
|
+
fontSize: "14px",
|
|
2814
|
+
fontWeight: 600
|
|
2815
|
+
}, children: getInitials(user.name) }),
|
|
2816
|
+
showName && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "14px", fontWeight: 500, color: "#333" }, children: user.name })
|
|
2817
|
+
]
|
|
2818
|
+
}
|
|
2819
|
+
),
|
|
2820
|
+
isOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
2821
|
+
position: "absolute",
|
|
2822
|
+
top: "100%",
|
|
2823
|
+
right: 0,
|
|
2824
|
+
marginTop: "8px",
|
|
2825
|
+
width: "240px",
|
|
2826
|
+
backgroundColor: "white",
|
|
2827
|
+
borderRadius: "12px",
|
|
2828
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.15)",
|
|
2829
|
+
border: "1px solid #eaeaea",
|
|
2830
|
+
zIndex: 1e3,
|
|
2831
|
+
...appearance?.elements?.userButtonPopoverCard
|
|
2832
|
+
}, children: [
|
|
2833
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2834
|
+
padding: "16px",
|
|
2835
|
+
borderBottom: "1px solid #eee"
|
|
2836
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
2837
|
+
display: "flex",
|
|
2838
|
+
alignItems: "center",
|
|
2839
|
+
gap: "12px"
|
|
2840
|
+
}, children: [
|
|
2841
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2842
|
+
width: "48px",
|
|
2843
|
+
height: "48px",
|
|
2844
|
+
borderRadius: "50%",
|
|
2845
|
+
backgroundColor: "#007bff",
|
|
2846
|
+
color: "white",
|
|
2847
|
+
display: "flex",
|
|
2848
|
+
alignItems: "center",
|
|
2849
|
+
justifyContent: "center",
|
|
2850
|
+
fontSize: "18px",
|
|
2851
|
+
fontWeight: 600
|
|
2852
|
+
}, children: getInitials(user.name) }),
|
|
2853
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
2854
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2855
|
+
fontSize: "14px",
|
|
2856
|
+
fontWeight: 600,
|
|
2857
|
+
color: "#333",
|
|
2858
|
+
overflow: "hidden",
|
|
2859
|
+
textOverflow: "ellipsis",
|
|
2860
|
+
whiteSpace: "nowrap"
|
|
2861
|
+
}, children: user.name }),
|
|
2862
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2863
|
+
fontSize: "12px",
|
|
2864
|
+
color: "#666",
|
|
2865
|
+
overflow: "hidden",
|
|
2866
|
+
textOverflow: "ellipsis",
|
|
2867
|
+
whiteSpace: "nowrap"
|
|
2868
|
+
}, children: user.email })
|
|
2869
|
+
] })
|
|
2870
|
+
] }) }),
|
|
2871
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "8px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2872
|
+
"button",
|
|
2873
|
+
{
|
|
2874
|
+
onClick: handleSignOut,
|
|
2875
|
+
style: {
|
|
2876
|
+
width: "100%",
|
|
2877
|
+
padding: "10px 16px",
|
|
2878
|
+
backgroundColor: "transparent",
|
|
2879
|
+
border: "none",
|
|
2880
|
+
borderRadius: "8px",
|
|
2881
|
+
textAlign: "left",
|
|
2882
|
+
cursor: "pointer",
|
|
2883
|
+
fontSize: "14px",
|
|
2884
|
+
color: "#333",
|
|
2885
|
+
fontWeight: 500,
|
|
2886
|
+
transition: "background-color 0.2s"
|
|
2887
|
+
},
|
|
2888
|
+
onMouseEnter: (e) => {
|
|
2889
|
+
e.currentTarget.style.backgroundColor = "#f5f5f5";
|
|
2890
|
+
},
|
|
2891
|
+
onMouseLeave: (e) => {
|
|
2892
|
+
e.currentTarget.style.backgroundColor = "transparent";
|
|
2893
|
+
},
|
|
2894
|
+
children: "Sign out"
|
|
2895
|
+
}
|
|
2896
|
+
) })
|
|
2897
|
+
] })
|
|
2898
|
+
] });
|
|
2899
|
+
};
|
|
2900
|
+
var ProtectedRoute = ({
|
|
2901
|
+
children,
|
|
2902
|
+
fallback,
|
|
2903
|
+
redirectTo
|
|
2904
|
+
}) => {
|
|
2905
|
+
const { isSignedIn, isLoaded } = useAuth2();
|
|
2906
|
+
react.useEffect(() => {
|
|
2907
|
+
if (isLoaded && !isSignedIn) {
|
|
2908
|
+
const loginPath = redirectTo || process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
|
|
2909
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2910
|
+
window.location.href = `${baseUrl}${loginPath}`;
|
|
2911
|
+
}
|
|
2912
|
+
}, [isSignedIn, isLoaded, redirectTo]);
|
|
2913
|
+
if (!isLoaded) {
|
|
2914
|
+
return fallback || /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2915
|
+
display: "flex",
|
|
2916
|
+
justifyContent: "center",
|
|
2917
|
+
alignItems: "center",
|
|
2918
|
+
minHeight: "100vh"
|
|
2919
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Loading..." }) });
|
|
2920
|
+
}
|
|
2921
|
+
if (!isSignedIn) {
|
|
2922
|
+
return fallback || null;
|
|
2923
|
+
}
|
|
2924
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
|
2925
|
+
};
|
|
2926
|
+
var PublicRoute = ({
|
|
2927
|
+
children,
|
|
2928
|
+
redirectTo
|
|
2929
|
+
}) => {
|
|
2930
|
+
const { isSignedIn, isLoaded } = useAuth2();
|
|
2931
|
+
react.useEffect(() => {
|
|
2932
|
+
if (isLoaded && isSignedIn) {
|
|
2933
|
+
const dashboardPath = redirectTo || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_AFTER_LOGIN || "/dashboard";
|
|
2934
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2935
|
+
window.location.href = `${baseUrl}${dashboardPath}`;
|
|
2936
|
+
}
|
|
2937
|
+
}, [isSignedIn, isLoaded, redirectTo]);
|
|
2938
|
+
if (!isLoaded) {
|
|
2939
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
2940
|
+
display: "flex",
|
|
2941
|
+
justifyContent: "center",
|
|
2942
|
+
alignItems: "center",
|
|
2943
|
+
minHeight: "100vh"
|
|
2944
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Loading..." }) });
|
|
2945
|
+
}
|
|
2946
|
+
if (isSignedIn) {
|
|
2947
|
+
return null;
|
|
2948
|
+
}
|
|
2949
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
|
2950
|
+
};
|
|
2951
|
+
var VerifyEmail = ({ token, onSuccess, onError }) => {
|
|
2952
|
+
const { verifyEmailToken } = useAuth2();
|
|
2953
|
+
const [status, setStatus] = react.useState("loading");
|
|
2954
|
+
const [message, setMessage] = react.useState("");
|
|
2955
|
+
react.useEffect(() => {
|
|
2956
|
+
const verify = async () => {
|
|
2957
|
+
const verifyToken = token || (typeof window !== "undefined" ? new URLSearchParams(window.location.search).get("token") : null);
|
|
2958
|
+
if (!verifyToken) {
|
|
2959
|
+
setStatus("error");
|
|
2960
|
+
setMessage("No verification token provided");
|
|
2961
|
+
onError?.("No verification token provided");
|
|
2962
|
+
return;
|
|
2963
|
+
}
|
|
2964
|
+
try {
|
|
2965
|
+
const response = await verifyEmailToken(verifyToken);
|
|
2966
|
+
if (response.success) {
|
|
2967
|
+
setStatus("success");
|
|
2968
|
+
setMessage("Email verified successfully! Redirecting...");
|
|
2969
|
+
onSuccess?.();
|
|
2970
|
+
setTimeout(() => {
|
|
2971
|
+
const redirect2 = process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_VERIFY || process.env.REACT_APP_AUTH_REDIRECT_AFTER_VERIFY || "/dashboard";
|
|
2972
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
2973
|
+
window.location.href = `${baseUrl}${redirect2}`;
|
|
2974
|
+
}, 2e3);
|
|
2975
|
+
} else {
|
|
2976
|
+
setStatus("error");
|
|
2977
|
+
setMessage(response.message || "Verification failed");
|
|
2978
|
+
onError?.(response.message || "Verification failed");
|
|
2979
|
+
}
|
|
2980
|
+
} catch (err) {
|
|
2981
|
+
setStatus("error");
|
|
2982
|
+
const errorMsg = err instanceof Error ? err.message : "An error occurred";
|
|
2983
|
+
setMessage(errorMsg);
|
|
2984
|
+
onError?.(errorMsg);
|
|
2985
|
+
}
|
|
2986
|
+
};
|
|
2987
|
+
verify();
|
|
2988
|
+
}, [token, verifyEmailToken, onSuccess, onError]);
|
|
2989
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
2990
|
+
maxWidth: "400px",
|
|
2991
|
+
margin: "40px auto",
|
|
2992
|
+
padding: "30px",
|
|
2993
|
+
borderRadius: "12px",
|
|
2994
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
2995
|
+
backgroundColor: "#ffffff",
|
|
2996
|
+
border: "1px solid #eaeaea",
|
|
2997
|
+
textAlign: "center"
|
|
2998
|
+
}, children: [
|
|
2999
|
+
status === "loading" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3000
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3001
|
+
width: "48px",
|
|
3002
|
+
height: "48px",
|
|
3003
|
+
margin: "0 auto 20px",
|
|
3004
|
+
border: "4px solid #f3f3f3",
|
|
3005
|
+
borderTop: "4px solid #007bff",
|
|
3006
|
+
borderRadius: "50%",
|
|
3007
|
+
animation: "spin 1s linear infinite"
|
|
3008
|
+
} }),
|
|
3009
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
3010
|
+
@keyframes spin {
|
|
3011
|
+
0% { transform: rotate(0deg); }
|
|
3012
|
+
100% { transform: rotate(360deg); }
|
|
3013
|
+
}
|
|
3014
|
+
` }),
|
|
3015
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3016
|
+
fontSize: "20px",
|
|
3017
|
+
fontWeight: 600,
|
|
3018
|
+
color: "#333",
|
|
3019
|
+
marginBottom: "12px"
|
|
3020
|
+
}, children: "Verifying your email..." }),
|
|
3021
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "14px", color: "#666" }, children: "Please wait while we verify your email address." })
|
|
3022
|
+
] }),
|
|
3023
|
+
status === "success" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3024
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3025
|
+
width: "64px",
|
|
3026
|
+
height: "64px",
|
|
3027
|
+
margin: "0 auto 20px",
|
|
3028
|
+
backgroundColor: "#4caf50",
|
|
3029
|
+
borderRadius: "50%",
|
|
3030
|
+
display: "flex",
|
|
3031
|
+
alignItems: "center",
|
|
3032
|
+
justifyContent: "center"
|
|
3033
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "3", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) }),
|
|
3034
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3035
|
+
fontSize: "20px",
|
|
3036
|
+
fontWeight: 600,
|
|
3037
|
+
color: "#333",
|
|
3038
|
+
marginBottom: "12px"
|
|
3039
|
+
}, children: "Email Verified!" }),
|
|
3040
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "14px", color: "#666" }, children: message })
|
|
3041
|
+
] }),
|
|
3042
|
+
status === "error" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3043
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3044
|
+
width: "64px",
|
|
3045
|
+
height: "64px",
|
|
3046
|
+
margin: "0 auto 20px",
|
|
3047
|
+
backgroundColor: "#f44336",
|
|
3048
|
+
borderRadius: "50%",
|
|
3049
|
+
display: "flex",
|
|
3050
|
+
alignItems: "center",
|
|
3051
|
+
justifyContent: "center"
|
|
3052
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "3", children: [
|
|
3053
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
3054
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
3055
|
+
] }) }),
|
|
3056
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3057
|
+
fontSize: "20px",
|
|
3058
|
+
fontWeight: 600,
|
|
3059
|
+
color: "#333",
|
|
3060
|
+
marginBottom: "12px"
|
|
3061
|
+
}, children: "Verification Failed" }),
|
|
3062
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "14px", color: "#666", marginBottom: "20px" }, children: message }),
|
|
3063
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3064
|
+
"button",
|
|
3065
|
+
{
|
|
3066
|
+
onClick: () => {
|
|
3067
|
+
const loginPath = process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
|
|
3068
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
3069
|
+
window.location.href = `${baseUrl}${loginPath}`;
|
|
3070
|
+
},
|
|
3071
|
+
style: {
|
|
3072
|
+
padding: "10px 20px",
|
|
3073
|
+
backgroundColor: "#007bff",
|
|
3074
|
+
color: "white",
|
|
3075
|
+
border: "none",
|
|
3076
|
+
borderRadius: "8px",
|
|
3077
|
+
fontSize: "14px",
|
|
3078
|
+
fontWeight: 600,
|
|
3079
|
+
cursor: "pointer"
|
|
3080
|
+
},
|
|
3081
|
+
children: "Go to Login"
|
|
3082
|
+
}
|
|
3083
|
+
)
|
|
3084
|
+
] })
|
|
3085
|
+
] });
|
|
3086
|
+
};
|
|
3087
|
+
var ForgotPassword = ({ appearance }) => {
|
|
3088
|
+
const { forgotPassword } = useAuth2();
|
|
3089
|
+
const [email, setEmail] = react.useState("");
|
|
3090
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
3091
|
+
const [error, setError] = react.useState(null);
|
|
3092
|
+
const [success, setSuccess] = react.useState(null);
|
|
3093
|
+
const handleSubmit = async (e) => {
|
|
3094
|
+
e.preventDefault();
|
|
3095
|
+
setIsLoading(true);
|
|
3096
|
+
setError(null);
|
|
3097
|
+
setSuccess(null);
|
|
3098
|
+
try {
|
|
3099
|
+
const response = await forgotPassword(email);
|
|
3100
|
+
if (response.success) {
|
|
3101
|
+
setSuccess("Password reset link sent! Please check your email.");
|
|
3102
|
+
setEmail("");
|
|
3103
|
+
} else {
|
|
3104
|
+
setError(response.message || "Failed to send reset link");
|
|
3105
|
+
}
|
|
3106
|
+
} catch (err) {
|
|
3107
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3108
|
+
} finally {
|
|
3109
|
+
setIsLoading(false);
|
|
3110
|
+
}
|
|
3111
|
+
};
|
|
3112
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3113
|
+
maxWidth: "400px",
|
|
3114
|
+
margin: "0 auto",
|
|
3115
|
+
padding: "30px",
|
|
3116
|
+
borderRadius: "12px",
|
|
3117
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
3118
|
+
backgroundColor: "#ffffff",
|
|
3119
|
+
border: "1px solid #eaeaea",
|
|
3120
|
+
...appearance?.elements?.card
|
|
3121
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
|
|
3122
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3123
|
+
textAlign: "center",
|
|
3124
|
+
marginBottom: "12px",
|
|
3125
|
+
color: "#1f2937",
|
|
3126
|
+
fontSize: "24px",
|
|
3127
|
+
fontWeight: 600,
|
|
3128
|
+
...appearance?.elements?.headerTitle
|
|
3129
|
+
}, children: "Forgot password?" }),
|
|
3130
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: {
|
|
3131
|
+
textAlign: "center",
|
|
3132
|
+
marginBottom: "24px",
|
|
3133
|
+
color: "#666",
|
|
3134
|
+
fontSize: "14px"
|
|
3135
|
+
}, children: "Enter your email address and we'll send you a link to reset your password." }),
|
|
3136
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3137
|
+
padding: "12px 16px",
|
|
3138
|
+
marginBottom: "20px",
|
|
3139
|
+
backgroundColor: "#fee",
|
|
3140
|
+
color: "#c33",
|
|
3141
|
+
border: "1px solid #fcc",
|
|
3142
|
+
borderRadius: "8px",
|
|
3143
|
+
fontSize: "14px"
|
|
3144
|
+
}, children: error }),
|
|
3145
|
+
success && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3146
|
+
padding: "12px 16px",
|
|
3147
|
+
marginBottom: "20px",
|
|
3148
|
+
backgroundColor: "#efe",
|
|
3149
|
+
color: "#3c3",
|
|
3150
|
+
border: "1px solid #cfc",
|
|
3151
|
+
borderRadius: "8px",
|
|
3152
|
+
fontSize: "14px"
|
|
3153
|
+
}, children: success }),
|
|
3154
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
3155
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "email", style: {
|
|
3156
|
+
display: "block",
|
|
3157
|
+
marginBottom: "8px",
|
|
3158
|
+
fontWeight: 500,
|
|
3159
|
+
color: "#374151",
|
|
3160
|
+
fontSize: "14px"
|
|
3161
|
+
}, children: "Email" }),
|
|
3162
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3163
|
+
"input",
|
|
3164
|
+
{
|
|
3165
|
+
id: "email",
|
|
3166
|
+
type: "email",
|
|
3167
|
+
value: email,
|
|
3168
|
+
onChange: (e) => setEmail(e.target.value),
|
|
3169
|
+
required: true,
|
|
3170
|
+
disabled: isLoading,
|
|
3171
|
+
style: {
|
|
3172
|
+
width: "100%",
|
|
3173
|
+
padding: "12px 16px",
|
|
3174
|
+
border: "1px solid #ddd",
|
|
3175
|
+
borderRadius: "8px",
|
|
3176
|
+
fontSize: "16px",
|
|
3177
|
+
boxSizing: "border-box",
|
|
3178
|
+
...appearance?.elements?.formFieldInput
|
|
3179
|
+
},
|
|
3180
|
+
placeholder: "Enter your email"
|
|
3181
|
+
}
|
|
3182
|
+
)
|
|
3183
|
+
] }),
|
|
3184
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3185
|
+
"button",
|
|
3186
|
+
{
|
|
3187
|
+
type: "submit",
|
|
3188
|
+
disabled: isLoading,
|
|
3189
|
+
style: {
|
|
3190
|
+
width: "100%",
|
|
3191
|
+
padding: "14px",
|
|
3192
|
+
backgroundColor: "#007bff",
|
|
3193
|
+
color: "white",
|
|
3194
|
+
border: "none",
|
|
3195
|
+
borderRadius: "8px",
|
|
3196
|
+
fontSize: "16px",
|
|
3197
|
+
fontWeight: 600,
|
|
3198
|
+
cursor: "pointer",
|
|
3199
|
+
transition: "all 0.2s ease",
|
|
3200
|
+
marginBottom: "16px",
|
|
3201
|
+
...appearance?.elements?.formButtonPrimary
|
|
3202
|
+
},
|
|
3203
|
+
children: isLoading ? "Sending..." : "Send reset link"
|
|
3204
|
+
}
|
|
3205
|
+
),
|
|
3206
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3207
|
+
"button",
|
|
3208
|
+
{
|
|
3209
|
+
type: "button",
|
|
3210
|
+
onClick: () => {
|
|
3211
|
+
const loginPath = process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
|
|
3212
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
3213
|
+
window.location.href = `${baseUrl}${loginPath}`;
|
|
3214
|
+
},
|
|
3215
|
+
disabled: isLoading,
|
|
3216
|
+
style: {
|
|
3217
|
+
background: "none",
|
|
3218
|
+
border: "none",
|
|
3219
|
+
color: "#007bff",
|
|
3220
|
+
cursor: "pointer",
|
|
3221
|
+
fontSize: "14px",
|
|
3222
|
+
fontWeight: 600
|
|
3223
|
+
},
|
|
3224
|
+
children: "Back to sign in"
|
|
3225
|
+
}
|
|
3226
|
+
) })
|
|
3227
|
+
] }) });
|
|
3228
|
+
};
|
|
3229
|
+
var ResetPassword = ({ token, appearance }) => {
|
|
3230
|
+
const { resetPassword } = useAuth2();
|
|
3231
|
+
const [resetToken, setResetToken] = react.useState(token || "");
|
|
3232
|
+
const [password, setPassword] = react.useState("");
|
|
3233
|
+
const [confirmPassword, setConfirmPassword] = react.useState("");
|
|
3234
|
+
const [showPassword, setShowPassword] = react.useState(false);
|
|
3235
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
3236
|
+
const [error, setError] = react.useState(null);
|
|
3237
|
+
const [success, setSuccess] = react.useState(false);
|
|
3238
|
+
react.useEffect(() => {
|
|
3239
|
+
if (!resetToken && typeof window !== "undefined") {
|
|
3240
|
+
const urlToken = new URLSearchParams(window.location.search).get("token");
|
|
3241
|
+
if (urlToken) {
|
|
3242
|
+
setResetToken(urlToken);
|
|
3243
|
+
}
|
|
3244
|
+
}
|
|
3245
|
+
}, [resetToken]);
|
|
3246
|
+
const getPasswordStrength = (pwd) => {
|
|
3247
|
+
if (!pwd)
|
|
3248
|
+
return { strength: "weak", color: "#ddd" };
|
|
3249
|
+
let score = 0;
|
|
3250
|
+
if (pwd.length >= 6)
|
|
3251
|
+
score++;
|
|
3252
|
+
if (pwd.length >= 8)
|
|
3253
|
+
score++;
|
|
3254
|
+
if (/[a-z]/.test(pwd) && /[A-Z]/.test(pwd))
|
|
3255
|
+
score++;
|
|
3256
|
+
if (/\d/.test(pwd))
|
|
3257
|
+
score++;
|
|
3258
|
+
if (/[^a-zA-Z\d]/.test(pwd))
|
|
3259
|
+
score++;
|
|
3260
|
+
if (score <= 2)
|
|
3261
|
+
return { strength: "weak", color: "#f44" };
|
|
3262
|
+
if (score <= 3)
|
|
3263
|
+
return { strength: "medium", color: "#fa4" };
|
|
3264
|
+
return { strength: "strong", color: "#4f4" };
|
|
3265
|
+
};
|
|
3266
|
+
const passwordStrength = getPasswordStrength(password);
|
|
3267
|
+
const handleSubmit = async (e) => {
|
|
3268
|
+
e.preventDefault();
|
|
3269
|
+
setIsLoading(true);
|
|
3270
|
+
setError(null);
|
|
3271
|
+
if (password !== confirmPassword) {
|
|
3272
|
+
setError("Passwords do not match");
|
|
3273
|
+
setIsLoading(false);
|
|
3274
|
+
return;
|
|
3275
|
+
}
|
|
3276
|
+
if (password.length < 6) {
|
|
3277
|
+
setError("Password must be at least 6 characters");
|
|
3278
|
+
setIsLoading(false);
|
|
3279
|
+
return;
|
|
3280
|
+
}
|
|
3281
|
+
if (!resetToken) {
|
|
3282
|
+
setError("Invalid reset token");
|
|
3283
|
+
setIsLoading(false);
|
|
3284
|
+
return;
|
|
3285
|
+
}
|
|
3286
|
+
try {
|
|
3287
|
+
const response = await resetPassword(resetToken, password);
|
|
3288
|
+
if (response.success) {
|
|
3289
|
+
setSuccess(true);
|
|
3290
|
+
setTimeout(() => {
|
|
3291
|
+
const loginPath = process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
|
|
3292
|
+
const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
|
|
3293
|
+
window.location.href = `${baseUrl}${loginPath}`;
|
|
3294
|
+
}, 2e3);
|
|
3295
|
+
} else {
|
|
3296
|
+
setError(response.message || "Failed to reset password");
|
|
3297
|
+
}
|
|
3298
|
+
} catch (err) {
|
|
3299
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3300
|
+
} finally {
|
|
3301
|
+
setIsLoading(false);
|
|
3302
|
+
}
|
|
3303
|
+
};
|
|
3304
|
+
if (success) {
|
|
3305
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
3306
|
+
maxWidth: "400px",
|
|
3307
|
+
margin: "40px auto",
|
|
3308
|
+
padding: "30px",
|
|
3309
|
+
borderRadius: "12px",
|
|
3310
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
3311
|
+
backgroundColor: "#ffffff",
|
|
3312
|
+
border: "1px solid #eaeaea",
|
|
3313
|
+
textAlign: "center"
|
|
3314
|
+
}, children: [
|
|
3315
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3316
|
+
width: "64px",
|
|
3317
|
+
height: "64px",
|
|
3318
|
+
margin: "0 auto 20px",
|
|
3319
|
+
backgroundColor: "#4caf50",
|
|
3320
|
+
borderRadius: "50%",
|
|
3321
|
+
display: "flex",
|
|
3322
|
+
alignItems: "center",
|
|
3323
|
+
justifyContent: "center"
|
|
3324
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "3", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) }),
|
|
3325
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3326
|
+
fontSize: "20px",
|
|
3327
|
+
fontWeight: 600,
|
|
3328
|
+
color: "#333",
|
|
3329
|
+
marginBottom: "12px"
|
|
3330
|
+
}, children: "Password Reset Successful!" }),
|
|
3331
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "14px", color: "#666" }, children: "Your password has been reset. Redirecting to login..." })
|
|
3332
|
+
] });
|
|
3333
|
+
}
|
|
3334
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3335
|
+
maxWidth: "400px",
|
|
3336
|
+
margin: "0 auto",
|
|
3337
|
+
padding: "30px",
|
|
3338
|
+
borderRadius: "12px",
|
|
3339
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
3340
|
+
backgroundColor: "#ffffff",
|
|
3341
|
+
border: "1px solid #eaeaea",
|
|
3342
|
+
...appearance?.elements?.card
|
|
3343
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
|
|
3344
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3345
|
+
textAlign: "center",
|
|
3346
|
+
marginBottom: "12px",
|
|
3347
|
+
color: "#1f2937",
|
|
3348
|
+
fontSize: "24px",
|
|
3349
|
+
fontWeight: 600,
|
|
3350
|
+
...appearance?.elements?.headerTitle
|
|
3351
|
+
}, children: "Reset your password" }),
|
|
3352
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: {
|
|
3353
|
+
textAlign: "center",
|
|
3354
|
+
marginBottom: "24px",
|
|
3355
|
+
color: "#666",
|
|
3356
|
+
fontSize: "14px"
|
|
3357
|
+
}, children: "Enter your new password below." }),
|
|
3358
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3359
|
+
padding: "12px 16px",
|
|
3360
|
+
marginBottom: "20px",
|
|
3361
|
+
backgroundColor: "#fee",
|
|
3362
|
+
color: "#c33",
|
|
3363
|
+
border: "1px solid #fcc",
|
|
3364
|
+
borderRadius: "8px",
|
|
3365
|
+
fontSize: "14px"
|
|
3366
|
+
}, children: error }),
|
|
3367
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px", position: "relative" }, children: [
|
|
3368
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "password", style: {
|
|
3369
|
+
display: "block",
|
|
3370
|
+
marginBottom: "8px",
|
|
3371
|
+
fontWeight: 500,
|
|
3372
|
+
color: "#374151",
|
|
3373
|
+
fontSize: "14px"
|
|
3374
|
+
}, children: "New password" }),
|
|
3375
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3376
|
+
"input",
|
|
3377
|
+
{
|
|
3378
|
+
id: "password",
|
|
3379
|
+
type: showPassword ? "text" : "password",
|
|
3380
|
+
value: password,
|
|
3381
|
+
onChange: (e) => setPassword(e.target.value),
|
|
3382
|
+
required: true,
|
|
3383
|
+
disabled: isLoading,
|
|
3384
|
+
minLength: 6,
|
|
3385
|
+
style: {
|
|
3386
|
+
width: "100%",
|
|
3387
|
+
padding: "12px 16px",
|
|
3388
|
+
border: "1px solid #ddd",
|
|
3389
|
+
borderRadius: "8px",
|
|
3390
|
+
fontSize: "16px",
|
|
3391
|
+
boxSizing: "border-box",
|
|
3392
|
+
...appearance?.elements?.formFieldInput
|
|
3393
|
+
},
|
|
3394
|
+
placeholder: "Enter new password"
|
|
3395
|
+
}
|
|
3396
|
+
),
|
|
3397
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3398
|
+
"button",
|
|
3399
|
+
{
|
|
3400
|
+
type: "button",
|
|
3401
|
+
onClick: () => setShowPassword(!showPassword),
|
|
3402
|
+
style: {
|
|
3403
|
+
position: "absolute",
|
|
3404
|
+
right: "12px",
|
|
3405
|
+
top: "38px",
|
|
3406
|
+
background: "none",
|
|
3407
|
+
border: "none",
|
|
3408
|
+
cursor: "pointer",
|
|
3409
|
+
color: "#666",
|
|
3410
|
+
fontSize: "14px"
|
|
3411
|
+
},
|
|
3412
|
+
children: showPassword ? "Hide" : "Show"
|
|
3413
|
+
}
|
|
3414
|
+
),
|
|
3415
|
+
password && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "8px" }, children: [
|
|
3416
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3417
|
+
height: "4px",
|
|
3418
|
+
backgroundColor: "#eee",
|
|
3419
|
+
borderRadius: "2px",
|
|
3420
|
+
overflow: "hidden"
|
|
3421
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3422
|
+
height: "100%",
|
|
3423
|
+
width: passwordStrength.strength === "weak" ? "33%" : passwordStrength.strength === "medium" ? "66%" : "100%",
|
|
3424
|
+
backgroundColor: passwordStrength.color,
|
|
3425
|
+
transition: "all 0.3s ease"
|
|
3426
|
+
} }) }),
|
|
3427
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { style: {
|
|
3428
|
+
fontSize: "12px",
|
|
3429
|
+
color: passwordStrength.color,
|
|
3430
|
+
marginTop: "4px",
|
|
3431
|
+
textTransform: "capitalize"
|
|
3432
|
+
}, children: [
|
|
3433
|
+
passwordStrength.strength,
|
|
3434
|
+
" password"
|
|
3435
|
+
] })
|
|
3436
|
+
] })
|
|
3437
|
+
] }),
|
|
3438
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
3439
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "confirmPassword", style: {
|
|
3440
|
+
display: "block",
|
|
3441
|
+
marginBottom: "8px",
|
|
3442
|
+
fontWeight: 500,
|
|
3443
|
+
color: "#374151",
|
|
3444
|
+
fontSize: "14px"
|
|
3445
|
+
}, children: "Confirm password" }),
|
|
3446
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3447
|
+
"input",
|
|
3448
|
+
{
|
|
3449
|
+
id: "confirmPassword",
|
|
3450
|
+
type: showPassword ? "text" : "password",
|
|
3451
|
+
value: confirmPassword,
|
|
3452
|
+
onChange: (e) => setConfirmPassword(e.target.value),
|
|
3453
|
+
required: true,
|
|
3454
|
+
disabled: isLoading,
|
|
3455
|
+
style: {
|
|
3456
|
+
width: "100%",
|
|
3457
|
+
padding: "12px 16px",
|
|
3458
|
+
border: "1px solid #ddd",
|
|
3459
|
+
borderRadius: "8px",
|
|
3460
|
+
fontSize: "16px",
|
|
3461
|
+
boxSizing: "border-box",
|
|
3462
|
+
...appearance?.elements?.formFieldInput
|
|
3463
|
+
},
|
|
3464
|
+
placeholder: "Confirm new password"
|
|
3465
|
+
}
|
|
3466
|
+
)
|
|
3467
|
+
] }),
|
|
3468
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3469
|
+
"button",
|
|
3470
|
+
{
|
|
3471
|
+
type: "submit",
|
|
3472
|
+
disabled: isLoading,
|
|
3473
|
+
style: {
|
|
3474
|
+
width: "100%",
|
|
3475
|
+
padding: "14px",
|
|
3476
|
+
backgroundColor: "#007bff",
|
|
3477
|
+
color: "white",
|
|
3478
|
+
border: "none",
|
|
3479
|
+
borderRadius: "8px",
|
|
3480
|
+
fontSize: "16px",
|
|
3481
|
+
fontWeight: 600,
|
|
3482
|
+
cursor: "pointer",
|
|
3483
|
+
transition: "all 0.2s ease",
|
|
3484
|
+
...appearance?.elements?.formButtonPrimary
|
|
3485
|
+
},
|
|
3486
|
+
children: isLoading ? "Resetting..." : "Reset password"
|
|
3487
|
+
}
|
|
3488
|
+
)
|
|
3489
|
+
] }) });
|
|
3490
|
+
};
|
|
3491
|
+
var ChangePassword = ({ onSuccess, appearance }) => {
|
|
3492
|
+
const { changePassword } = useAuth2();
|
|
3493
|
+
const [oldPassword, setOldPassword] = react.useState("");
|
|
3494
|
+
const [newPassword, setNewPassword] = react.useState("");
|
|
3495
|
+
const [confirmPassword, setConfirmPassword] = react.useState("");
|
|
3496
|
+
const [showPasswords, setShowPasswords] = react.useState(false);
|
|
3497
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
3498
|
+
const [error, setError] = react.useState(null);
|
|
3499
|
+
const [success, setSuccess] = react.useState(false);
|
|
3500
|
+
const getPasswordStrength = (pwd) => {
|
|
3501
|
+
if (!pwd)
|
|
3502
|
+
return { strength: "weak", color: "#ddd" };
|
|
3503
|
+
let score = 0;
|
|
3504
|
+
if (pwd.length >= 6)
|
|
3505
|
+
score++;
|
|
3506
|
+
if (pwd.length >= 8)
|
|
3507
|
+
score++;
|
|
3508
|
+
if (/[a-z]/.test(pwd) && /[A-Z]/.test(pwd))
|
|
3509
|
+
score++;
|
|
3510
|
+
if (/\d/.test(pwd))
|
|
3511
|
+
score++;
|
|
3512
|
+
if (/[^a-zA-Z\d]/.test(pwd))
|
|
3513
|
+
score++;
|
|
3514
|
+
if (score <= 2)
|
|
3515
|
+
return { strength: "weak", color: "#f44" };
|
|
3516
|
+
if (score <= 3)
|
|
3517
|
+
return { strength: "medium", color: "#fa4" };
|
|
3518
|
+
return { strength: "strong", color: "#4f4" };
|
|
3519
|
+
};
|
|
3520
|
+
const passwordStrength = getPasswordStrength(newPassword);
|
|
3521
|
+
const handleSubmit = async (e) => {
|
|
3522
|
+
e.preventDefault();
|
|
3523
|
+
setIsLoading(true);
|
|
3524
|
+
setError(null);
|
|
3525
|
+
setSuccess(false);
|
|
3526
|
+
if (newPassword !== confirmPassword) {
|
|
3527
|
+
setError("New passwords do not match");
|
|
3528
|
+
setIsLoading(false);
|
|
3529
|
+
return;
|
|
3530
|
+
}
|
|
3531
|
+
if (newPassword.length < 6) {
|
|
3532
|
+
setError("New password must be at least 6 characters");
|
|
3533
|
+
setIsLoading(false);
|
|
3534
|
+
return;
|
|
3535
|
+
}
|
|
3536
|
+
try {
|
|
3537
|
+
const response = await changePassword(oldPassword, newPassword);
|
|
3538
|
+
if (response.success) {
|
|
3539
|
+
setSuccess(true);
|
|
3540
|
+
setOldPassword("");
|
|
3541
|
+
setNewPassword("");
|
|
3542
|
+
setConfirmPassword("");
|
|
3543
|
+
onSuccess?.();
|
|
3544
|
+
} else {
|
|
3545
|
+
setError(response.message || "Failed to change password");
|
|
3546
|
+
}
|
|
3547
|
+
} catch (err) {
|
|
3548
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3549
|
+
} finally {
|
|
3550
|
+
setIsLoading(false);
|
|
3551
|
+
}
|
|
3552
|
+
};
|
|
3553
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3554
|
+
maxWidth: "400px",
|
|
3555
|
+
margin: "0 auto",
|
|
3556
|
+
padding: "30px",
|
|
3557
|
+
borderRadius: "12px",
|
|
3558
|
+
boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
|
|
3559
|
+
backgroundColor: "#ffffff",
|
|
3560
|
+
border: "1px solid #eaeaea",
|
|
3561
|
+
...appearance?.elements?.card
|
|
3562
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
|
|
3563
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: {
|
|
3564
|
+
textAlign: "center",
|
|
3565
|
+
marginBottom: "24px",
|
|
3566
|
+
color: "#1f2937",
|
|
3567
|
+
fontSize: "24px",
|
|
3568
|
+
fontWeight: 600,
|
|
3569
|
+
...appearance?.elements?.headerTitle
|
|
3570
|
+
}, children: "Change Password" }),
|
|
3571
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3572
|
+
padding: "12px 16px",
|
|
3573
|
+
marginBottom: "20px",
|
|
3574
|
+
backgroundColor: "#fee",
|
|
3575
|
+
color: "#c33",
|
|
3576
|
+
border: "1px solid #fcc",
|
|
3577
|
+
borderRadius: "8px",
|
|
3578
|
+
fontSize: "14px"
|
|
3579
|
+
}, children: error }),
|
|
3580
|
+
success && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3581
|
+
padding: "12px 16px",
|
|
3582
|
+
marginBottom: "20px",
|
|
3583
|
+
backgroundColor: "#efe",
|
|
3584
|
+
color: "#3c3",
|
|
3585
|
+
border: "1px solid #cfc",
|
|
3586
|
+
borderRadius: "8px",
|
|
3587
|
+
fontSize: "14px"
|
|
3588
|
+
}, children: "Password changed successfully!" }),
|
|
3589
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
3590
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "oldPassword", style: {
|
|
3591
|
+
display: "block",
|
|
3592
|
+
marginBottom: "8px",
|
|
3593
|
+
fontWeight: 500,
|
|
3594
|
+
color: "#374151",
|
|
3595
|
+
fontSize: "14px"
|
|
3596
|
+
}, children: "Current password" }),
|
|
3597
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3598
|
+
"input",
|
|
3599
|
+
{
|
|
3600
|
+
id: "oldPassword",
|
|
3601
|
+
type: showPasswords ? "text" : "password",
|
|
3602
|
+
value: oldPassword,
|
|
3603
|
+
onChange: (e) => setOldPassword(e.target.value),
|
|
3604
|
+
required: true,
|
|
3605
|
+
disabled: isLoading,
|
|
3606
|
+
style: {
|
|
3607
|
+
width: "100%",
|
|
3608
|
+
padding: "12px 16px",
|
|
3609
|
+
border: "1px solid #ddd",
|
|
3610
|
+
borderRadius: "8px",
|
|
3611
|
+
fontSize: "16px",
|
|
3612
|
+
boxSizing: "border-box",
|
|
3613
|
+
...appearance?.elements?.formFieldInput
|
|
3614
|
+
},
|
|
3615
|
+
placeholder: "Enter current password"
|
|
3616
|
+
}
|
|
3617
|
+
)
|
|
3618
|
+
] }),
|
|
3619
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
3620
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "newPassword", style: {
|
|
3621
|
+
display: "block",
|
|
3622
|
+
marginBottom: "8px",
|
|
3623
|
+
fontWeight: 500,
|
|
3624
|
+
color: "#374151",
|
|
3625
|
+
fontSize: "14px"
|
|
3626
|
+
}, children: "New password" }),
|
|
3627
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3628
|
+
"input",
|
|
3629
|
+
{
|
|
3630
|
+
id: "newPassword",
|
|
3631
|
+
type: showPasswords ? "text" : "password",
|
|
3632
|
+
value: newPassword,
|
|
3633
|
+
onChange: (e) => setNewPassword(e.target.value),
|
|
3634
|
+
required: true,
|
|
3635
|
+
disabled: isLoading,
|
|
3636
|
+
minLength: 6,
|
|
3637
|
+
style: {
|
|
3638
|
+
width: "100%",
|
|
3639
|
+
padding: "12px 16px",
|
|
3640
|
+
border: "1px solid #ddd",
|
|
3641
|
+
borderRadius: "8px",
|
|
3642
|
+
fontSize: "16px",
|
|
3643
|
+
boxSizing: "border-box",
|
|
3644
|
+
...appearance?.elements?.formFieldInput
|
|
3645
|
+
},
|
|
3646
|
+
placeholder: "Enter new password"
|
|
3647
|
+
}
|
|
3648
|
+
),
|
|
3649
|
+
newPassword && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "8px" }, children: [
|
|
3650
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3651
|
+
height: "4px",
|
|
3652
|
+
backgroundColor: "#eee",
|
|
3653
|
+
borderRadius: "2px",
|
|
3654
|
+
overflow: "hidden"
|
|
3655
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3656
|
+
height: "100%",
|
|
3657
|
+
width: passwordStrength.strength === "weak" ? "33%" : passwordStrength.strength === "medium" ? "66%" : "100%",
|
|
3658
|
+
backgroundColor: passwordStrength.color,
|
|
3659
|
+
transition: "all 0.3s ease"
|
|
3660
|
+
} }) }),
|
|
3661
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { style: {
|
|
3662
|
+
fontSize: "12px",
|
|
3663
|
+
color: passwordStrength.color,
|
|
3664
|
+
marginTop: "4px",
|
|
3665
|
+
textTransform: "capitalize"
|
|
3666
|
+
}, children: [
|
|
3667
|
+
passwordStrength.strength,
|
|
3668
|
+
" password"
|
|
3669
|
+
] })
|
|
3670
|
+
] })
|
|
3671
|
+
] }),
|
|
3672
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "20px" }, children: [
|
|
3673
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "confirmPassword", style: {
|
|
3674
|
+
display: "block",
|
|
3675
|
+
marginBottom: "8px",
|
|
3676
|
+
fontWeight: 500,
|
|
3677
|
+
color: "#374151",
|
|
3678
|
+
fontSize: "14px"
|
|
3679
|
+
}, children: "Confirm new password" }),
|
|
3680
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3681
|
+
"input",
|
|
3682
|
+
{
|
|
3683
|
+
id: "confirmPassword",
|
|
3684
|
+
type: showPasswords ? "text" : "password",
|
|
3685
|
+
value: confirmPassword,
|
|
3686
|
+
onChange: (e) => setConfirmPassword(e.target.value),
|
|
3687
|
+
required: true,
|
|
3688
|
+
disabled: isLoading,
|
|
3689
|
+
style: {
|
|
3690
|
+
width: "100%",
|
|
3691
|
+
padding: "12px 16px",
|
|
3692
|
+
border: "1px solid #ddd",
|
|
3693
|
+
borderRadius: "8px",
|
|
3694
|
+
fontSize: "16px",
|
|
3695
|
+
boxSizing: "border-box",
|
|
3696
|
+
...appearance?.elements?.formFieldInput
|
|
3697
|
+
},
|
|
3698
|
+
placeholder: "Confirm new password"
|
|
3699
|
+
}
|
|
3700
|
+
)
|
|
3701
|
+
] }),
|
|
3702
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginBottom: "20px" }, children: /* @__PURE__ */ jsxRuntime.jsxs("label", { style: { display: "flex", alignItems: "center", cursor: "pointer" }, children: [
|
|
3703
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3704
|
+
"input",
|
|
3705
|
+
{
|
|
3706
|
+
type: "checkbox",
|
|
3707
|
+
checked: showPasswords,
|
|
3708
|
+
onChange: (e) => setShowPasswords(e.target.checked),
|
|
3709
|
+
style: { marginRight: "8px" }
|
|
3710
|
+
}
|
|
3711
|
+
),
|
|
3712
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "14px", color: "#666" }, children: "Show passwords" })
|
|
3713
|
+
] }) }),
|
|
3714
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3715
|
+
"button",
|
|
3716
|
+
{
|
|
3717
|
+
type: "submit",
|
|
3718
|
+
disabled: isLoading,
|
|
3719
|
+
style: {
|
|
3720
|
+
width: "100%",
|
|
3721
|
+
padding: "14px",
|
|
3722
|
+
backgroundColor: "#007bff",
|
|
3723
|
+
color: "white",
|
|
3724
|
+
border: "none",
|
|
3725
|
+
borderRadius: "8px",
|
|
3726
|
+
fontSize: "16px",
|
|
3727
|
+
fontWeight: 600,
|
|
3728
|
+
cursor: "pointer",
|
|
3729
|
+
transition: "all 0.2s ease",
|
|
3730
|
+
...appearance?.elements?.formButtonPrimary
|
|
3731
|
+
},
|
|
3732
|
+
children: isLoading ? "Changing password..." : "Change password"
|
|
3733
|
+
}
|
|
3734
|
+
)
|
|
3735
|
+
] }) });
|
|
3736
|
+
};
|
|
3737
|
+
var UserProfile = ({
|
|
3738
|
+
showAvatar = true,
|
|
3739
|
+
showEmailChange = true,
|
|
3740
|
+
showPasswordChange = true
|
|
3741
|
+
}) => {
|
|
3742
|
+
const { user, updateProfile, updateAvatar, requestEmailChange } = useAuth2();
|
|
3743
|
+
const [name, setName] = react.useState(user?.name || "");
|
|
3744
|
+
const [avatar, setAvatar] = react.useState("");
|
|
3745
|
+
const [newEmail, setNewEmail] = react.useState("");
|
|
3746
|
+
const [isLoading, setIsLoading] = react.useState(false);
|
|
3747
|
+
const [error, setError] = react.useState(null);
|
|
3748
|
+
const [success, setSuccess] = react.useState(null);
|
|
3749
|
+
const handleUpdateName = async (e) => {
|
|
3750
|
+
e.preventDefault();
|
|
3751
|
+
setIsLoading(true);
|
|
3752
|
+
setError(null);
|
|
3753
|
+
setSuccess(null);
|
|
3754
|
+
try {
|
|
3755
|
+
const response = await updateProfile({ name });
|
|
3756
|
+
if (response.success) {
|
|
3757
|
+
setSuccess("Name updated successfully!");
|
|
3758
|
+
} else {
|
|
3759
|
+
setError(response.message || "Failed to update name");
|
|
3760
|
+
}
|
|
3761
|
+
} catch (err) {
|
|
3762
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3763
|
+
} finally {
|
|
3764
|
+
setIsLoading(false);
|
|
3765
|
+
}
|
|
3766
|
+
};
|
|
3767
|
+
const handleUpdateAvatar = async (e) => {
|
|
3768
|
+
e.preventDefault();
|
|
3769
|
+
setIsLoading(true);
|
|
3770
|
+
setError(null);
|
|
3771
|
+
setSuccess(null);
|
|
3772
|
+
try {
|
|
3773
|
+
const response = await updateAvatar(avatar);
|
|
3774
|
+
if (response.success) {
|
|
3775
|
+
setSuccess("Avatar updated successfully!");
|
|
3776
|
+
setAvatar("");
|
|
3777
|
+
} else {
|
|
3778
|
+
setError(response.message || "Failed to update avatar");
|
|
3779
|
+
}
|
|
3780
|
+
} catch (err) {
|
|
3781
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3782
|
+
} finally {
|
|
3783
|
+
setIsLoading(false);
|
|
3784
|
+
}
|
|
3785
|
+
};
|
|
3786
|
+
const handleRequestEmailChange = async (e) => {
|
|
3787
|
+
e.preventDefault();
|
|
3788
|
+
setIsLoading(true);
|
|
3789
|
+
setError(null);
|
|
3790
|
+
setSuccess(null);
|
|
3791
|
+
try {
|
|
3792
|
+
const response = await requestEmailChange(newEmail);
|
|
3793
|
+
if (response.success) {
|
|
3794
|
+
setSuccess("Verification email sent! Please check your inbox.");
|
|
3795
|
+
setNewEmail("");
|
|
3796
|
+
} else {
|
|
3797
|
+
setError(response.message || "Failed to request email change");
|
|
3798
|
+
}
|
|
3799
|
+
} catch (err) {
|
|
3800
|
+
setError(err instanceof Error ? err.message : "An error occurred");
|
|
3801
|
+
} finally {
|
|
3802
|
+
setIsLoading(false);
|
|
3803
|
+
}
|
|
3804
|
+
};
|
|
3805
|
+
if (!user)
|
|
3806
|
+
return null;
|
|
3807
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { maxWidth: "600px", margin: "0 auto", padding: "20px" }, children: [
|
|
3808
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { marginBottom: "24px", fontSize: "24px", fontWeight: 600 }, children: "Profile Settings" }),
|
|
3809
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3810
|
+
padding: "12px 16px",
|
|
3811
|
+
marginBottom: "20px",
|
|
3812
|
+
backgroundColor: "#fee",
|
|
3813
|
+
color: "#c33",
|
|
3814
|
+
border: "1px solid #fcc",
|
|
3815
|
+
borderRadius: "8px",
|
|
3816
|
+
fontSize: "14px"
|
|
3817
|
+
}, children: error }),
|
|
3818
|
+
success && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
3819
|
+
padding: "12px 16px",
|
|
3820
|
+
marginBottom: "20px",
|
|
3821
|
+
backgroundColor: "#efe",
|
|
3822
|
+
color: "#3c3",
|
|
3823
|
+
border: "1px solid #cfc",
|
|
3824
|
+
borderRadius: "8px",
|
|
3825
|
+
fontSize: "14px"
|
|
3826
|
+
}, children: success }),
|
|
3827
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
3828
|
+
padding: "20px",
|
|
3829
|
+
backgroundColor: "#fff",
|
|
3830
|
+
borderRadius: "8px",
|
|
3831
|
+
boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
|
|
3832
|
+
marginBottom: "20px"
|
|
3833
|
+
}, children: [
|
|
3834
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { marginBottom: "16px", fontSize: "18px", fontWeight: 600 }, children: "Update Name" }),
|
|
3835
|
+
/* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleUpdateName, children: [
|
|
3836
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3837
|
+
"input",
|
|
3838
|
+
{
|
|
3839
|
+
type: "text",
|
|
3840
|
+
value: name,
|
|
3841
|
+
onChange: (e) => setName(e.target.value),
|
|
3842
|
+
required: true,
|
|
3843
|
+
disabled: isLoading,
|
|
3844
|
+
style: {
|
|
3845
|
+
width: "100%",
|
|
3846
|
+
padding: "12px 16px",
|
|
3847
|
+
border: "1px solid #ddd",
|
|
3848
|
+
borderRadius: "8px",
|
|
3849
|
+
fontSize: "16px",
|
|
3850
|
+
boxSizing: "border-box",
|
|
3851
|
+
marginBottom: "12px"
|
|
3852
|
+
},
|
|
3853
|
+
placeholder: "Your name"
|
|
3854
|
+
}
|
|
3855
|
+
),
|
|
3856
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3857
|
+
"button",
|
|
3858
|
+
{
|
|
3859
|
+
type: "submit",
|
|
3860
|
+
disabled: isLoading,
|
|
3861
|
+
style: {
|
|
3862
|
+
padding: "10px 20px",
|
|
3863
|
+
backgroundColor: "#007bff",
|
|
3864
|
+
color: "white",
|
|
3865
|
+
border: "none",
|
|
3866
|
+
borderRadius: "8px",
|
|
3867
|
+
fontSize: "14px",
|
|
3868
|
+
fontWeight: 600,
|
|
3869
|
+
cursor: "pointer"
|
|
3870
|
+
},
|
|
3871
|
+
children: "Update Name"
|
|
3872
|
+
}
|
|
3873
|
+
)
|
|
3874
|
+
] })
|
|
3875
|
+
] }),
|
|
3876
|
+
showAvatar && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
3877
|
+
padding: "20px",
|
|
3878
|
+
backgroundColor: "#fff",
|
|
3879
|
+
borderRadius: "8px",
|
|
3880
|
+
boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
|
|
3881
|
+
marginBottom: "20px"
|
|
3882
|
+
}, children: [
|
|
3883
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { marginBottom: "16px", fontSize: "18px", fontWeight: 600 }, children: "Update Avatar" }),
|
|
3884
|
+
/* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleUpdateAvatar, children: [
|
|
3885
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3886
|
+
"input",
|
|
3887
|
+
{
|
|
3888
|
+
type: "url",
|
|
3889
|
+
value: avatar,
|
|
3890
|
+
onChange: (e) => setAvatar(e.target.value),
|
|
3891
|
+
required: true,
|
|
3892
|
+
disabled: isLoading,
|
|
3893
|
+
style: {
|
|
3894
|
+
width: "100%",
|
|
3895
|
+
padding: "12px 16px",
|
|
3896
|
+
border: "1px solid #ddd",
|
|
3897
|
+
borderRadius: "8px",
|
|
3898
|
+
fontSize: "16px",
|
|
3899
|
+
boxSizing: "border-box",
|
|
3900
|
+
marginBottom: "12px"
|
|
3901
|
+
},
|
|
3902
|
+
placeholder: "Avatar URL"
|
|
3903
|
+
}
|
|
3904
|
+
),
|
|
3905
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3906
|
+
"button",
|
|
3907
|
+
{
|
|
3908
|
+
type: "submit",
|
|
3909
|
+
disabled: isLoading,
|
|
3910
|
+
style: {
|
|
3911
|
+
padding: "10px 20px",
|
|
3912
|
+
backgroundColor: "#007bff",
|
|
3913
|
+
color: "white",
|
|
3914
|
+
border: "none",
|
|
3915
|
+
borderRadius: "8px",
|
|
3916
|
+
fontSize: "14px",
|
|
3917
|
+
fontWeight: 600,
|
|
3918
|
+
cursor: "pointer"
|
|
3919
|
+
},
|
|
3920
|
+
children: "Update Avatar"
|
|
3921
|
+
}
|
|
3922
|
+
)
|
|
3923
|
+
] })
|
|
3924
|
+
] }),
|
|
3925
|
+
showEmailChange && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
|
|
3926
|
+
padding: "20px",
|
|
3927
|
+
backgroundColor: "#fff",
|
|
3928
|
+
borderRadius: "8px",
|
|
3929
|
+
boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
|
|
3930
|
+
marginBottom: "20px"
|
|
3931
|
+
}, children: [
|
|
3932
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { marginBottom: "16px", fontSize: "18px", fontWeight: 600 }, children: "Change Email" }),
|
|
3933
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { style: { fontSize: "14px", color: "#666", marginBottom: "12px" }, children: [
|
|
3934
|
+
"Current email: ",
|
|
3935
|
+
/* @__PURE__ */ jsxRuntime.jsx("strong", { children: user.email })
|
|
3936
|
+
] }),
|
|
3937
|
+
/* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleRequestEmailChange, children: [
|
|
3938
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3939
|
+
"input",
|
|
3940
|
+
{
|
|
3941
|
+
type: "email",
|
|
3942
|
+
value: newEmail,
|
|
3943
|
+
onChange: (e) => setNewEmail(e.target.value),
|
|
3944
|
+
required: true,
|
|
3945
|
+
disabled: isLoading,
|
|
3946
|
+
style: {
|
|
3947
|
+
width: "100%",
|
|
3948
|
+
padding: "12px 16px",
|
|
3949
|
+
border: "1px solid #ddd",
|
|
3950
|
+
borderRadius: "8px",
|
|
3951
|
+
fontSize: "16px",
|
|
3952
|
+
boxSizing: "border-box",
|
|
3953
|
+
marginBottom: "12px"
|
|
3954
|
+
},
|
|
3955
|
+
placeholder: "New email address"
|
|
3956
|
+
}
|
|
3957
|
+
),
|
|
3958
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3959
|
+
"button",
|
|
3960
|
+
{
|
|
3961
|
+
type: "submit",
|
|
3962
|
+
disabled: isLoading,
|
|
3963
|
+
style: {
|
|
3964
|
+
padding: "10px 20px",
|
|
3965
|
+
backgroundColor: "#007bff",
|
|
3966
|
+
color: "white",
|
|
3967
|
+
border: "none",
|
|
3968
|
+
borderRadius: "8px",
|
|
3969
|
+
fontSize: "14px",
|
|
3970
|
+
fontWeight: 600,
|
|
3971
|
+
cursor: "pointer"
|
|
3972
|
+
},
|
|
3973
|
+
children: "Request Email Change"
|
|
3974
|
+
}
|
|
3975
|
+
)
|
|
3976
|
+
] })
|
|
3977
|
+
] })
|
|
3978
|
+
] });
|
|
3979
|
+
};
|
|
3980
|
+
var isServer = typeof window === "undefined";
|
|
3981
|
+
var useNextAuth = (config) => {
|
|
3982
|
+
const [authService] = react.useState(() => {
|
|
3983
|
+
const service = new AuthService(config);
|
|
3984
|
+
if (isServer && config.token) {
|
|
3985
|
+
service["token"] = config.token;
|
|
3986
|
+
service["httpClient"].setAuthToken(config.token);
|
|
3987
|
+
}
|
|
3988
|
+
return service;
|
|
1757
3989
|
});
|
|
1758
3990
|
const [user, setUser] = react.useState(null);
|
|
1759
3991
|
const [isAuthenticated, setIsAuthenticated] = react.useState(false);
|
|
@@ -1778,8 +4010,8 @@ var useNextAuth = (config) => {
|
|
|
1778
4010
|
const authenticated = authService.isAuthenticated();
|
|
1779
4011
|
setIsAuthenticated(authenticated);
|
|
1780
4012
|
if (authenticated) {
|
|
1781
|
-
const
|
|
1782
|
-
setUser(
|
|
4013
|
+
const currentUser2 = authService.getCurrentUser();
|
|
4014
|
+
setUser(currentUser2);
|
|
1783
4015
|
} else {
|
|
1784
4016
|
setUser(null);
|
|
1785
4017
|
}
|
|
@@ -1792,11 +4024,7 @@ var useNextAuth = (config) => {
|
|
|
1792
4024
|
const register = react.useCallback(async (data) => {
|
|
1793
4025
|
setLoading(true);
|
|
1794
4026
|
try {
|
|
1795
|
-
const
|
|
1796
|
-
if (!registerData.frontendBaseUrl && typeof window !== "undefined") {
|
|
1797
|
-
registerData.frontendBaseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || process.env.REACT_APP_FRONTEND_BASE_URL || window.location.origin;
|
|
1798
|
-
}
|
|
1799
|
-
const response = await authService.register(registerData);
|
|
4027
|
+
const response = await authService.register(data);
|
|
1800
4028
|
return response;
|
|
1801
4029
|
} finally {
|
|
1802
4030
|
setLoading(false);
|
|
@@ -1949,11 +4177,11 @@ var AuthClient = class extends AuthService {
|
|
|
1949
4177
|
// Override methods that require browser-specific features
|
|
1950
4178
|
// For Node.js, token persistence must be handled manually
|
|
1951
4179
|
async register(data) {
|
|
1952
|
-
const
|
|
1953
|
-
if (
|
|
1954
|
-
|
|
4180
|
+
const frontendBaseUrl = process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL;
|
|
4181
|
+
if (frontendBaseUrl) {
|
|
4182
|
+
this["httpClient"].setFrontendBaseUrl(frontendBaseUrl);
|
|
1955
4183
|
}
|
|
1956
|
-
const response = await this["httpClient"].post("/api/v1/auth/register",
|
|
4184
|
+
const response = await this["httpClient"].post("/api/v1/auth/register", data);
|
|
1957
4185
|
if (response.success && response.message === "Registration data saved. Verification email sent. Please check your inbox.") {
|
|
1958
4186
|
return response;
|
|
1959
4187
|
}
|
|
@@ -2033,8 +4261,8 @@ var NextServerAuth = class extends AuthClient {
|
|
|
2033
4261
|
return authHeader.substring(7);
|
|
2034
4262
|
}
|
|
2035
4263
|
// Parse token from cookies
|
|
2036
|
-
static parseTokenFromCookies(
|
|
2037
|
-
const cookieArray =
|
|
4264
|
+
static parseTokenFromCookies(cookies2) {
|
|
4265
|
+
const cookieArray = cookies2.split(";");
|
|
2038
4266
|
for (const cookie of cookieArray) {
|
|
2039
4267
|
const [name, value] = cookie.trim().split("=");
|
|
2040
4268
|
if (name === "auth_token") {
|
|
@@ -2078,16 +4306,169 @@ var NextServerAuth = class extends AuthClient {
|
|
|
2078
4306
|
return client;
|
|
2079
4307
|
}
|
|
2080
4308
|
};
|
|
4309
|
+
var AuthServer = class {
|
|
4310
|
+
constructor(config) {
|
|
4311
|
+
this.config = {
|
|
4312
|
+
authApiUrl: config?.authApiUrl || process.env.AUTH_API_URL || "http://localhost:7000",
|
|
4313
|
+
tokenCookieName: config?.tokenCookieName || "auth_token"
|
|
4314
|
+
};
|
|
4315
|
+
}
|
|
4316
|
+
async getToken() {
|
|
4317
|
+
const cookieStore = await headers.cookies();
|
|
4318
|
+
const token = cookieStore.get(this.config.tokenCookieName);
|
|
4319
|
+
return token?.value || null;
|
|
4320
|
+
}
|
|
4321
|
+
async getCurrentUser() {
|
|
4322
|
+
const token = await this.getToken();
|
|
4323
|
+
if (!token)
|
|
4324
|
+
return null;
|
|
4325
|
+
try {
|
|
4326
|
+
const payload = JSON.parse(Buffer.from(token.split(".")[1], "base64").toString());
|
|
4327
|
+
return payload.user || null;
|
|
4328
|
+
} catch (error) {
|
|
4329
|
+
console.error("Failed to parse user from token:", error);
|
|
4330
|
+
return null;
|
|
4331
|
+
}
|
|
4332
|
+
}
|
|
4333
|
+
async isAuthenticated() {
|
|
4334
|
+
const token = await this.getToken();
|
|
4335
|
+
return !!token;
|
|
4336
|
+
}
|
|
4337
|
+
async requireAuth(redirectTo) {
|
|
4338
|
+
const user = await this.getCurrentUser();
|
|
4339
|
+
if (!user) {
|
|
4340
|
+
const loginPath = redirectTo || process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
|
|
4341
|
+
navigation.redirect(loginPath);
|
|
4342
|
+
}
|
|
4343
|
+
return user;
|
|
4344
|
+
}
|
|
4345
|
+
async redirectIfAuthenticated(redirectTo) {
|
|
4346
|
+
const isAuth = await this.isAuthenticated();
|
|
4347
|
+
if (isAuth) {
|
|
4348
|
+
const dashboardPath = redirectTo || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGIN || "/dashboard";
|
|
4349
|
+
navigation.redirect(dashboardPath);
|
|
4350
|
+
}
|
|
4351
|
+
}
|
|
4352
|
+
async getProfile() {
|
|
4353
|
+
const token = await this.getToken();
|
|
4354
|
+
if (!token)
|
|
4355
|
+
return null;
|
|
4356
|
+
try {
|
|
4357
|
+
const response = await fetch(`${this.config.authApiUrl}/api/v1/user/me`, {
|
|
4358
|
+
headers: {
|
|
4359
|
+
"Authorization": `Bearer ${token}`
|
|
4360
|
+
}
|
|
4361
|
+
});
|
|
4362
|
+
if (!response.ok) {
|
|
4363
|
+
return null;
|
|
4364
|
+
}
|
|
4365
|
+
const data = await response.json();
|
|
4366
|
+
return data.user;
|
|
4367
|
+
} catch (error) {
|
|
4368
|
+
console.error("Failed to fetch profile:", error);
|
|
4369
|
+
return null;
|
|
4370
|
+
}
|
|
4371
|
+
}
|
|
4372
|
+
};
|
|
4373
|
+
var authServerInstance = null;
|
|
4374
|
+
function getAuthServer(config) {
|
|
4375
|
+
if (!authServerInstance) {
|
|
4376
|
+
authServerInstance = new AuthServer(config);
|
|
4377
|
+
}
|
|
4378
|
+
return authServerInstance;
|
|
4379
|
+
}
|
|
4380
|
+
async function currentUser() {
|
|
4381
|
+
const auth2 = getAuthServer();
|
|
4382
|
+
return auth2.getCurrentUser();
|
|
4383
|
+
}
|
|
4384
|
+
async function auth() {
|
|
4385
|
+
const authServer = getAuthServer();
|
|
4386
|
+
const user = await authServer.getCurrentUser();
|
|
4387
|
+
const token = await authServer.getToken();
|
|
4388
|
+
return {
|
|
4389
|
+
user,
|
|
4390
|
+
userId: user?._id || null,
|
|
4391
|
+
isAuthenticated: !!user,
|
|
4392
|
+
token
|
|
4393
|
+
};
|
|
4394
|
+
}
|
|
4395
|
+
async function requireAuth(redirectTo) {
|
|
4396
|
+
const authServer = getAuthServer();
|
|
4397
|
+
return authServer.requireAuth(redirectTo);
|
|
4398
|
+
}
|
|
4399
|
+
async function redirectIfAuthenticated(redirectTo) {
|
|
4400
|
+
const authServer = getAuthServer();
|
|
4401
|
+
return authServer.redirectIfAuthenticated(redirectTo);
|
|
4402
|
+
}
|
|
4403
|
+
function authMiddleware(config) {
|
|
4404
|
+
const {
|
|
4405
|
+
publicRoutes = ["/auth/login", "/auth/register", "/auth/verify-email", "/auth/forgot-password", "/auth/reset-password"],
|
|
4406
|
+
protectedRoutes = ["/dashboard"],
|
|
4407
|
+
loginUrl = "/auth/login",
|
|
4408
|
+
afterLoginUrl = "/dashboard",
|
|
4409
|
+
tokenCookieName = "auth_token"
|
|
4410
|
+
} = config || {};
|
|
4411
|
+
return function middleware(request) {
|
|
4412
|
+
const { pathname } = request.nextUrl;
|
|
4413
|
+
const token = request.cookies.get(tokenCookieName)?.value;
|
|
4414
|
+
const isAuthenticated = !!token;
|
|
4415
|
+
const isPublicRoute = publicRoutes.some((route) => {
|
|
4416
|
+
if (route.endsWith("*")) {
|
|
4417
|
+
return pathname.startsWith(route.slice(0, -1));
|
|
4418
|
+
}
|
|
4419
|
+
return pathname === route || pathname.startsWith(route + "/");
|
|
4420
|
+
});
|
|
4421
|
+
const isProtectedRoute = protectedRoutes.some((route) => {
|
|
4422
|
+
if (route.endsWith("*")) {
|
|
4423
|
+
return pathname.startsWith(route.slice(0, -1));
|
|
4424
|
+
}
|
|
4425
|
+
return pathname === route || pathname.startsWith(route + "/");
|
|
4426
|
+
});
|
|
4427
|
+
if (isAuthenticated && isPublicRoute) {
|
|
4428
|
+
return server.NextResponse.redirect(new URL(afterLoginUrl, request.url));
|
|
4429
|
+
}
|
|
4430
|
+
if (!isAuthenticated && isProtectedRoute) {
|
|
4431
|
+
const loginUrlWithRedirect = new URL(loginUrl, request.url);
|
|
4432
|
+
loginUrlWithRedirect.searchParams.set("redirect", pathname);
|
|
4433
|
+
return server.NextResponse.redirect(loginUrlWithRedirect);
|
|
4434
|
+
}
|
|
4435
|
+
return server.NextResponse.next();
|
|
4436
|
+
};
|
|
4437
|
+
}
|
|
4438
|
+
function createAuthMiddleware(config) {
|
|
4439
|
+
return authMiddleware(config);
|
|
4440
|
+
}
|
|
2081
4441
|
|
|
2082
4442
|
exports.AuthFlow = AuthFlow;
|
|
4443
|
+
exports.AuthProvider = AuthProvider;
|
|
4444
|
+
exports.AuthServer = AuthServer;
|
|
2083
4445
|
exports.AuthService = AuthService;
|
|
4446
|
+
exports.ChangePassword = ChangePassword;
|
|
2084
4447
|
exports.EmailVerificationPage = EmailVerificationPage;
|
|
4448
|
+
exports.ForgotPassword = ForgotPassword;
|
|
2085
4449
|
exports.HttpClient = HttpClient;
|
|
2086
4450
|
exports.LoginForm = LoginForm;
|
|
2087
4451
|
exports.NextServerAuth = NextServerAuth;
|
|
2088
4452
|
exports.OtpForm = OtpForm;
|
|
4453
|
+
exports.ProtectedRoute = ProtectedRoute;
|
|
4454
|
+
exports.PublicRoute = PublicRoute;
|
|
2089
4455
|
exports.RegisterForm = RegisterForm;
|
|
2090
|
-
exports.
|
|
4456
|
+
exports.ResetPassword = ResetPassword;
|
|
4457
|
+
exports.SignIn = SignIn;
|
|
4458
|
+
exports.SignOut = SignOut;
|
|
4459
|
+
exports.SignUp = SignUp;
|
|
4460
|
+
exports.UserButton = UserButton;
|
|
4461
|
+
exports.UserProfile = UserProfile;
|
|
4462
|
+
exports.VerifyEmail = VerifyEmail;
|
|
4463
|
+
exports.auth = auth;
|
|
4464
|
+
exports.authMiddleware = authMiddleware;
|
|
4465
|
+
exports.createAuthMiddleware = createAuthMiddleware;
|
|
4466
|
+
exports.currentUser = currentUser;
|
|
4467
|
+
exports.getAuthServer = getAuthServer;
|
|
4468
|
+
exports.redirectIfAuthenticated = redirectIfAuthenticated;
|
|
4469
|
+
exports.requireAuth = requireAuth;
|
|
4470
|
+
exports.useAuth = useAuth2;
|
|
4471
|
+
exports.useAuthLegacy = useAuth;
|
|
2091
4472
|
exports.useNextAuth = useNextAuth;
|
|
2092
4473
|
//# sourceMappingURL=out.js.map
|
|
2093
4474
|
//# sourceMappingURL=index.next.js.map
|