@burdenoff/microfe-auth 2026.514.4 → 2026.514.5
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/dist/auth/hooks/useUserOperations.d.ts +1 -0
- package/dist/auth/hooks/useUserOperations.d.ts.map +1 -1
- package/dist/auth/hooks/useUserOperations.js.map +1 -1
- package/dist/auth/pages/UserProfilePage.d.ts.map +1 -1
- package/dist/auth/pages/UserProfilePage.js +283 -212
- package/dist/auth/pages/UserProfilePage.js.map +1 -1
- package/dist/generated/global-operations.d.ts +1 -0
- package/dist/generated/global-operations.d.ts.map +1 -1
- package/dist/generated/global-operations.js +1 -0
- package/dist/generated/global-operations.js.map +1 -1
- package/dist/generated/global-types.d.ts +2 -0
- package/dist/generated/global-types.d.ts.map +1 -1
- package/dist/generated/wspace-operations.d.ts +82 -0
- package/dist/generated/wspace-operations.d.ts.map +1 -1
- package/dist/generated/wspace-operations.js +43 -1
- package/dist/generated/wspace-operations.js.map +1 -1
- package/dist/microfe-auth.css +1 -1
- package/package.json +1 -1
|
@@ -3,393 +3,464 @@ import { useUserOperations as t } from "../hooks/useUserOperations.js";
|
|
|
3
3
|
import "../hooks/index.js";
|
|
4
4
|
import { AuthLayout as n } from "../components/AuthLayout.js";
|
|
5
5
|
import { AlertIcon as r, CheckIcon as i, EmailIcon as a, SpinnerIcon as o, UserIcon as s } from "../components/AuthIcons.js";
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
6
|
+
import { useCompleteAvatarUploadMutation as c, useInitiateAvatarUploadMutation as l } from "../../generated/wspace-operations.js";
|
|
7
|
+
import { useEffect as u, useRef as d, useState as f } from "react";
|
|
8
|
+
import { useNavigate as p } from "react-router-dom";
|
|
9
|
+
import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell";
|
|
10
|
+
import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
|
|
10
11
|
//#region src/auth/pages/UserProfilePage.tsx
|
|
11
|
-
function
|
|
12
|
-
let { t:
|
|
13
|
-
let n =
|
|
12
|
+
function v() {
|
|
13
|
+
let { t: v } = m(), y = (e, t) => {
|
|
14
|
+
let n = v(e);
|
|
14
15
|
return n === e ? t : n;
|
|
15
|
-
},
|
|
16
|
+
}, b = p(), x = e((e) => e.isAuthenticated), S = e((e) => e.user), { updateCurrentUserProfile: C, isLoading: w } = t(), [T] = l(), [E] = c(), D = d(null), [O, k] = f(!1), A = async (e) => {
|
|
17
|
+
let t = e.target.files?.[0];
|
|
18
|
+
if (t) {
|
|
19
|
+
if (!t.type.startsWith("image/")) {
|
|
20
|
+
I(y("auth.profile.invalidImageType", "Please select an image file"));
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
k(!0), I(null);
|
|
24
|
+
try {
|
|
25
|
+
let e = await T({ variables: { input: {
|
|
26
|
+
fileName: t.name,
|
|
27
|
+
fileSize: t.size.toString(),
|
|
28
|
+
mimeType: t.type
|
|
29
|
+
} } }), n = e.data?.initiateUpload.session, r = e.data?.initiateUpload.uploadUrl;
|
|
30
|
+
if (!n || !r) throw Error("Failed to initiate upload");
|
|
31
|
+
if (!(await fetch(r, {
|
|
32
|
+
method: "PUT",
|
|
33
|
+
headers: { "Content-Type": t.type },
|
|
34
|
+
body: t
|
|
35
|
+
})).ok) throw Error("Failed to upload file");
|
|
36
|
+
let i = (await E({ variables: { input: { sessionId: n.id } } })).data?.completeUpload.file?.downloadUrl;
|
|
37
|
+
if (!i) throw Error("Upload succeeded but no URL returned");
|
|
38
|
+
await C({ avatar: i }), R(y("auth.profile.avatarUpdated", "Profile picture updated!"));
|
|
39
|
+
} catch (e) {
|
|
40
|
+
I(e instanceof Error ? e.message : y("auth.profile.avatarFailed", "Failed to upload picture"));
|
|
41
|
+
} finally {
|
|
42
|
+
k(!1), D.current && (D.current.value = "");
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
}, [j, M] = f(!1), [N, P] = f({
|
|
16
46
|
username: "",
|
|
17
47
|
firstName: "",
|
|
18
48
|
lastName: "",
|
|
19
49
|
name: "",
|
|
20
50
|
phoneNumber: ""
|
|
21
|
-
}), [
|
|
22
|
-
return
|
|
23
|
-
|
|
24
|
-
username:
|
|
25
|
-
firstName:
|
|
26
|
-
lastName:
|
|
27
|
-
name:
|
|
28
|
-
phoneNumber:
|
|
51
|
+
}), [F, I] = f(null), [L, R] = f(null);
|
|
52
|
+
return u(() => {
|
|
53
|
+
S && P({
|
|
54
|
+
username: S.username || "",
|
|
55
|
+
firstName: S.firstName || "",
|
|
56
|
+
lastName: S.lastName || "",
|
|
57
|
+
name: S.name || "",
|
|
58
|
+
phoneNumber: S.phoneNumber || ""
|
|
29
59
|
});
|
|
30
|
-
}, [
|
|
31
|
-
title:
|
|
32
|
-
subtitle:
|
|
33
|
-
children: /* @__PURE__ */
|
|
60
|
+
}, [S]), !x || !S ? /* @__PURE__ */ g(n, {
|
|
61
|
+
title: y("auth.profile.title", "Profile"),
|
|
62
|
+
subtitle: y("auth.profile.subtitle", "View and manage your profile"),
|
|
63
|
+
children: /* @__PURE__ */ _("div", {
|
|
34
64
|
className: "text-center py-12",
|
|
35
65
|
children: [
|
|
36
|
-
/* @__PURE__ */
|
|
66
|
+
/* @__PURE__ */ g("div", {
|
|
37
67
|
className: "w-16 h-16 mx-auto mb-4 rounded-full bg-[var(--color-status-warning-bg-subtle)] flex items-center justify-center",
|
|
38
|
-
children: /* @__PURE__ */
|
|
68
|
+
children: /* @__PURE__ */ g(r, { className: "w-8 h-8 text-[var(--color-status-warning-text)]" })
|
|
39
69
|
}),
|
|
40
|
-
/* @__PURE__ */
|
|
70
|
+
/* @__PURE__ */ g("h2", {
|
|
41
71
|
className: "text-xl font-semibold text-[var(--color-text-primary)] mb-2",
|
|
42
|
-
children:
|
|
72
|
+
children: y("auth.profile.authRequired", "Authentication Required")
|
|
43
73
|
}),
|
|
44
|
-
/* @__PURE__ */
|
|
74
|
+
/* @__PURE__ */ g("p", {
|
|
45
75
|
className: "text-[var(--color-text-secondary)] mb-6",
|
|
46
|
-
children:
|
|
76
|
+
children: y("auth.profile.signInToView", "Please sign in to view your profile")
|
|
47
77
|
}),
|
|
48
|
-
/* @__PURE__ */
|
|
49
|
-
onClick: () =>
|
|
78
|
+
/* @__PURE__ */ g("button", {
|
|
79
|
+
onClick: () => b("/auth/login"),
|
|
50
80
|
className: "auth-primary-button px-6 py-3 font-semibold",
|
|
51
|
-
children:
|
|
81
|
+
children: y("auth.profile.signIn", "Sign In")
|
|
52
82
|
})
|
|
53
83
|
]
|
|
54
84
|
})
|
|
55
|
-
}) : /* @__PURE__ */
|
|
85
|
+
}) : /* @__PURE__ */ _("div", {
|
|
56
86
|
className: "max-w-4xl mx-auto p-6",
|
|
57
87
|
children: [
|
|
58
|
-
/* @__PURE__ */
|
|
88
|
+
/* @__PURE__ */ _("div", {
|
|
59
89
|
className: "mb-8",
|
|
60
|
-
children: [/* @__PURE__ */
|
|
90
|
+
children: [/* @__PURE__ */ g("h1", {
|
|
61
91
|
className: "text-3xl font-semibold text-[var(--color-text-primary)]",
|
|
62
|
-
children:
|
|
63
|
-
}), /* @__PURE__ */
|
|
92
|
+
children: y("auth.profile.myProfile", "My Profile")
|
|
93
|
+
}), /* @__PURE__ */ g("p", {
|
|
64
94
|
className: "text-[var(--color-text-secondary)] mt-2",
|
|
65
|
-
children:
|
|
95
|
+
children: y("auth.profile.viewAndManage", "View and manage your account information")
|
|
66
96
|
})]
|
|
67
97
|
}),
|
|
68
|
-
|
|
98
|
+
L && /* @__PURE__ */ _("div", {
|
|
69
99
|
className: "mb-6 flex items-center gap-3 p-4 rounded-xl bg-[var(--color-status-success-bg-subtle)] border border-[var(--color-status-success-border)]",
|
|
70
100
|
children: [
|
|
71
|
-
/* @__PURE__ */
|
|
72
|
-
/* @__PURE__ */
|
|
101
|
+
/* @__PURE__ */ g(i, { className: "w-5 h-5 text-[var(--color-status-success-text)] flex-shrink-0" }),
|
|
102
|
+
/* @__PURE__ */ g("p", {
|
|
73
103
|
className: "text-[var(--color-status-success-text)]",
|
|
74
|
-
children:
|
|
104
|
+
children: L
|
|
75
105
|
}),
|
|
76
|
-
/* @__PURE__ */
|
|
77
|
-
onClick: () =>
|
|
106
|
+
/* @__PURE__ */ g("button", {
|
|
107
|
+
onClick: () => R(null),
|
|
78
108
|
className: "ml-auto text-sm text-[var(--color-status-success-text)] hover:underline transition-colors duration-200",
|
|
79
|
-
children:
|
|
109
|
+
children: y("auth.profile.dismiss", "Dismiss")
|
|
80
110
|
})
|
|
81
111
|
]
|
|
82
112
|
}),
|
|
83
|
-
|
|
113
|
+
F && /* @__PURE__ */ _("div", {
|
|
84
114
|
className: "mb-6 flex items-start gap-3 p-4 rounded-xl bg-[var(--color-status-error-bg-subtle)] border border-[var(--color-status-error-border)]",
|
|
85
115
|
children: [
|
|
86
|
-
/* @__PURE__ */
|
|
87
|
-
/* @__PURE__ */
|
|
116
|
+
/* @__PURE__ */ g(r, { className: "w-5 h-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }),
|
|
117
|
+
/* @__PURE__ */ g("div", {
|
|
88
118
|
className: "flex-1",
|
|
89
|
-
children: /* @__PURE__ */
|
|
119
|
+
children: /* @__PURE__ */ g("p", {
|
|
90
120
|
className: "text-sm text-[var(--color-status-error-text)]",
|
|
91
|
-
children:
|
|
121
|
+
children: F
|
|
92
122
|
})
|
|
93
123
|
}),
|
|
94
|
-
/* @__PURE__ */
|
|
95
|
-
onClick: () =>
|
|
124
|
+
/* @__PURE__ */ g("button", {
|
|
125
|
+
onClick: () => I(null),
|
|
96
126
|
className: "text-sm text-[var(--color-status-error-text)] hover:underline transition-colors duration-200",
|
|
97
|
-
children:
|
|
127
|
+
children: y("auth.profile.dismiss", "Dismiss")
|
|
98
128
|
})
|
|
99
129
|
]
|
|
100
130
|
}),
|
|
101
|
-
/* @__PURE__ */
|
|
131
|
+
/* @__PURE__ */ _("div", {
|
|
102
132
|
className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-sm overflow-hidden",
|
|
103
|
-
children: [/* @__PURE__ */
|
|
133
|
+
children: [/* @__PURE__ */ g("div", {
|
|
104
134
|
className: "auth-hero-card p-6",
|
|
105
|
-
children: /* @__PURE__ */
|
|
135
|
+
children: /* @__PURE__ */ _("div", {
|
|
106
136
|
className: "flex items-center gap-4",
|
|
107
|
-
children: [/* @__PURE__ */
|
|
108
|
-
className: "
|
|
109
|
-
children:
|
|
110
|
-
|
|
137
|
+
children: [/* @__PURE__ */ _("div", {
|
|
138
|
+
className: "relative group",
|
|
139
|
+
children: [
|
|
140
|
+
S.avatar ? /* @__PURE__ */ g("img", {
|
|
141
|
+
src: S.avatar,
|
|
142
|
+
alt: y("auth.profile.avatarAlt", "Profile picture"),
|
|
143
|
+
className: "w-20 h-20 rounded-full object-cover shadow-lg"
|
|
144
|
+
}) : /* @__PURE__ */ g("div", {
|
|
145
|
+
className: "w-20 h-20 rounded-full bg-bg-surface/20 backdrop-blur-sm flex items-center justify-center text-white text-3xl font-semibold shadow-lg",
|
|
146
|
+
children: (S.name || S.username || S.email).charAt(0).toUpperCase()
|
|
147
|
+
}),
|
|
148
|
+
/* @__PURE__ */ g("button", {
|
|
149
|
+
type: "button",
|
|
150
|
+
onClick: () => D.current?.click(),
|
|
151
|
+
disabled: O,
|
|
152
|
+
"aria-label": y("auth.profile.changeAvatar", "Change profile picture"),
|
|
153
|
+
className: "absolute inset-0 rounded-full flex items-center justify-center bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity duration-200 cursor-pointer",
|
|
154
|
+
children: O ? /* @__PURE__ */ g(o, { className: "w-6 h-6 text-white animate-spin" }) : /* @__PURE__ */ _("svg", {
|
|
155
|
+
className: "w-6 h-6 text-white",
|
|
156
|
+
fill: "none",
|
|
157
|
+
viewBox: "0 0 24 24",
|
|
158
|
+
stroke: "currentColor",
|
|
159
|
+
children: [/* @__PURE__ */ g("path", {
|
|
160
|
+
strokeLinecap: "round",
|
|
161
|
+
strokeLinejoin: "round",
|
|
162
|
+
strokeWidth: 2,
|
|
163
|
+
d: "M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z"
|
|
164
|
+
}), /* @__PURE__ */ g("path", {
|
|
165
|
+
strokeLinecap: "round",
|
|
166
|
+
strokeLinejoin: "round",
|
|
167
|
+
strokeWidth: 2,
|
|
168
|
+
d: "M15 13a3 3 0 11-6 0 3 3 0 016 0z"
|
|
169
|
+
})]
|
|
170
|
+
})
|
|
171
|
+
}),
|
|
172
|
+
/* @__PURE__ */ g("input", {
|
|
173
|
+
ref: D,
|
|
174
|
+
type: "file",
|
|
175
|
+
accept: "image/*",
|
|
176
|
+
className: "hidden",
|
|
177
|
+
onChange: (e) => void A(e),
|
|
178
|
+
"aria-hidden": "true"
|
|
179
|
+
})
|
|
180
|
+
]
|
|
181
|
+
}), /* @__PURE__ */ _("div", {
|
|
111
182
|
className: "text-white",
|
|
112
183
|
children: [
|
|
113
|
-
/* @__PURE__ */
|
|
184
|
+
/* @__PURE__ */ g("h2", {
|
|
114
185
|
className: "text-2xl font-semibold",
|
|
115
|
-
children:
|
|
186
|
+
children: S.name || `${S.firstName || ""} ${S.lastName || ""}`.trim() || S.username
|
|
116
187
|
}),
|
|
117
|
-
/* @__PURE__ */
|
|
188
|
+
/* @__PURE__ */ _("p", {
|
|
118
189
|
className: "text-blue-100 flex items-center gap-2",
|
|
119
|
-
children: [/* @__PURE__ */
|
|
190
|
+
children: [/* @__PURE__ */ g(a, { className: "w-4 h-4" }), S.email]
|
|
120
191
|
}),
|
|
121
|
-
/* @__PURE__ */
|
|
192
|
+
/* @__PURE__ */ _("div", {
|
|
122
193
|
className: "flex items-center gap-2 mt-2",
|
|
123
|
-
children: [/* @__PURE__ */
|
|
194
|
+
children: [/* @__PURE__ */ g("span", {
|
|
124
195
|
className: "px-2.5 py-1 rounded-full text-xs font-medium bg-bg-surface/20 backdrop-blur-sm",
|
|
125
|
-
children:
|
|
126
|
-
}),
|
|
196
|
+
children: S.role?.replace("_", " ") || y("auth.profile.member", "Member")
|
|
197
|
+
}), S.emailVerified && /* @__PURE__ */ _("span", {
|
|
127
198
|
className: "px-2.5 py-1 rounded-full text-xs font-medium bg-status-success-text/30 flex items-center gap-1",
|
|
128
|
-
children: [/* @__PURE__ */
|
|
199
|
+
children: [/* @__PURE__ */ g(i, { className: "w-3 h-3" }), y("auth.profile.verified", "Verified")]
|
|
129
200
|
})]
|
|
130
201
|
})
|
|
131
202
|
]
|
|
132
203
|
})]
|
|
133
204
|
})
|
|
134
|
-
}), /* @__PURE__ */
|
|
205
|
+
}), /* @__PURE__ */ g("div", {
|
|
135
206
|
className: "p-6",
|
|
136
|
-
children:
|
|
207
|
+
children: j ? /* @__PURE__ */ _("form", {
|
|
137
208
|
onSubmit: async (e) => {
|
|
138
|
-
e.preventDefault(),
|
|
209
|
+
e.preventDefault(), I(null), R(null);
|
|
139
210
|
try {
|
|
140
|
-
await
|
|
141
|
-
username:
|
|
142
|
-
firstName:
|
|
143
|
-
lastName:
|
|
144
|
-
name:
|
|
145
|
-
phoneNumber:
|
|
146
|
-
}),
|
|
211
|
+
await C({
|
|
212
|
+
username: N.username || void 0,
|
|
213
|
+
firstName: N.firstName || void 0,
|
|
214
|
+
lastName: N.lastName || void 0,
|
|
215
|
+
name: N.name || void 0,
|
|
216
|
+
phoneNumber: N.phoneNumber || void 0
|
|
217
|
+
}), R(y("auth.profile.updateSuccess", "Profile updated successfully!")), M(!1);
|
|
147
218
|
} catch (e) {
|
|
148
|
-
|
|
219
|
+
I(e instanceof Error ? e.message : y("auth.profile.updateFailed", "Failed to update profile"));
|
|
149
220
|
}
|
|
150
221
|
},
|
|
151
222
|
className: "space-y-6",
|
|
152
|
-
children: [/* @__PURE__ */
|
|
223
|
+
children: [/* @__PURE__ */ _("div", {
|
|
153
224
|
className: "grid grid-cols-1 md:grid-cols-2 gap-6",
|
|
154
225
|
children: [
|
|
155
|
-
/* @__PURE__ */
|
|
226
|
+
/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
|
|
156
227
|
className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
|
|
157
|
-
children:
|
|
158
|
-
}), /* @__PURE__ */
|
|
228
|
+
children: y("auth.profile.username", "Username")
|
|
229
|
+
}), /* @__PURE__ */ _("div", {
|
|
159
230
|
className: "relative",
|
|
160
|
-
children: [/* @__PURE__ */
|
|
231
|
+
children: [/* @__PURE__ */ g("div", {
|
|
161
232
|
className: "absolute inset-y-0 left-0 pl-3.5 flex items-center pointer-events-none",
|
|
162
|
-
children: /* @__PURE__ */
|
|
163
|
-
}), /* @__PURE__ */
|
|
233
|
+
children: /* @__PURE__ */ g(s, { className: "w-5 h-5 text-[var(--color-text-tertiary)]" })
|
|
234
|
+
}), /* @__PURE__ */ g("input", {
|
|
164
235
|
type: "text",
|
|
165
|
-
value:
|
|
166
|
-
onChange: (e) =>
|
|
167
|
-
...
|
|
236
|
+
value: N.username,
|
|
237
|
+
onChange: (e) => P({
|
|
238
|
+
...N,
|
|
168
239
|
username: e.target.value
|
|
169
240
|
}),
|
|
170
241
|
className: "block w-full pl-[3.5rem] pr-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
|
|
171
|
-
placeholder:
|
|
242
|
+
placeholder: y("auth.profile.usernamePlaceholder", "Enter username")
|
|
172
243
|
})]
|
|
173
244
|
})] }),
|
|
174
|
-
/* @__PURE__ */
|
|
245
|
+
/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
|
|
175
246
|
className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
|
|
176
|
-
children:
|
|
177
|
-
}), /* @__PURE__ */
|
|
247
|
+
children: y("auth.profile.displayName", "Display Name")
|
|
248
|
+
}), /* @__PURE__ */ g("input", {
|
|
178
249
|
type: "text",
|
|
179
|
-
value:
|
|
180
|
-
onChange: (e) =>
|
|
181
|
-
...
|
|
250
|
+
value: N.name,
|
|
251
|
+
onChange: (e) => P({
|
|
252
|
+
...N,
|
|
182
253
|
name: e.target.value
|
|
183
254
|
}),
|
|
184
255
|
className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
|
|
185
|
-
placeholder:
|
|
256
|
+
placeholder: y("auth.profile.displayNamePlaceholder", "Enter display name")
|
|
186
257
|
})] }),
|
|
187
|
-
/* @__PURE__ */
|
|
258
|
+
/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
|
|
188
259
|
className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
|
|
189
|
-
children:
|
|
190
|
-
}), /* @__PURE__ */
|
|
260
|
+
children: y("auth.profile.firstName", "First Name")
|
|
261
|
+
}), /* @__PURE__ */ g("input", {
|
|
191
262
|
type: "text",
|
|
192
|
-
value:
|
|
193
|
-
onChange: (e) =>
|
|
194
|
-
...
|
|
263
|
+
value: N.firstName,
|
|
264
|
+
onChange: (e) => P({
|
|
265
|
+
...N,
|
|
195
266
|
firstName: e.target.value
|
|
196
267
|
}),
|
|
197
268
|
className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
|
|
198
|
-
placeholder:
|
|
269
|
+
placeholder: y("auth.profile.firstNamePlaceholder", "Enter first name")
|
|
199
270
|
})] }),
|
|
200
|
-
/* @__PURE__ */
|
|
271
|
+
/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
|
|
201
272
|
className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
|
|
202
|
-
children:
|
|
203
|
-
}), /* @__PURE__ */
|
|
273
|
+
children: y("auth.profile.lastName", "Last Name")
|
|
274
|
+
}), /* @__PURE__ */ g("input", {
|
|
204
275
|
type: "text",
|
|
205
|
-
value:
|
|
206
|
-
onChange: (e) =>
|
|
207
|
-
...
|
|
276
|
+
value: N.lastName,
|
|
277
|
+
onChange: (e) => P({
|
|
278
|
+
...N,
|
|
208
279
|
lastName: e.target.value
|
|
209
280
|
}),
|
|
210
281
|
className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
|
|
211
|
-
placeholder:
|
|
282
|
+
placeholder: y("auth.profile.lastNamePlaceholder", "Enter last name")
|
|
212
283
|
})] }),
|
|
213
|
-
/* @__PURE__ */
|
|
284
|
+
/* @__PURE__ */ _("div", {
|
|
214
285
|
className: "md:col-span-2",
|
|
215
|
-
children: [/* @__PURE__ */
|
|
286
|
+
children: [/* @__PURE__ */ g("label", {
|
|
216
287
|
className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
|
|
217
|
-
children:
|
|
218
|
-
}), /* @__PURE__ */
|
|
288
|
+
children: y("auth.profile.phoneNumber", "Phone Number")
|
|
289
|
+
}), /* @__PURE__ */ g("input", {
|
|
219
290
|
type: "tel",
|
|
220
|
-
value:
|
|
221
|
-
onChange: (e) =>
|
|
222
|
-
...
|
|
291
|
+
value: N.phoneNumber,
|
|
292
|
+
onChange: (e) => P({
|
|
293
|
+
...N,
|
|
223
294
|
phoneNumber: e.target.value
|
|
224
295
|
}),
|
|
225
296
|
className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
|
|
226
|
-
placeholder:
|
|
297
|
+
placeholder: y("auth.profile.phonePlaceholder", "Enter phone number")
|
|
227
298
|
})]
|
|
228
299
|
})
|
|
229
300
|
]
|
|
230
|
-
}), /* @__PURE__ */
|
|
301
|
+
}), /* @__PURE__ */ _("div", {
|
|
231
302
|
className: "flex gap-3 pt-4 border-t border-[var(--color-border-default)]",
|
|
232
|
-
children: [/* @__PURE__ */
|
|
303
|
+
children: [/* @__PURE__ */ g("button", {
|
|
233
304
|
type: "submit",
|
|
234
|
-
disabled:
|
|
305
|
+
disabled: w,
|
|
235
306
|
className: "auth-primary-button flex items-center gap-2 px-6 py-3 font-medium",
|
|
236
|
-
children:
|
|
237
|
-
}), /* @__PURE__ */
|
|
307
|
+
children: w ? /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g(o, { className: "w-4 h-4 animate-spin" }), y("auth.profile.saving", "Saving...")] }) : y("auth.profile.saveChanges", "Save Changes")
|
|
308
|
+
}), /* @__PURE__ */ g("button", {
|
|
238
309
|
type: "button",
|
|
239
310
|
onClick: () => {
|
|
240
|
-
|
|
241
|
-
username:
|
|
242
|
-
firstName:
|
|
243
|
-
lastName:
|
|
244
|
-
name:
|
|
245
|
-
phoneNumber:
|
|
246
|
-
}),
|
|
311
|
+
S && P({
|
|
312
|
+
username: S.username || "",
|
|
313
|
+
firstName: S.firstName || "",
|
|
314
|
+
lastName: S.lastName || "",
|
|
315
|
+
name: S.name || "",
|
|
316
|
+
phoneNumber: S.phoneNumber || ""
|
|
317
|
+
}), M(!1), I(null);
|
|
247
318
|
},
|
|
248
319
|
className: "px-6 py-3 rounded-xl border border-[var(--color-border-default)] text-[var(--color-text-secondary)] font-medium hover:bg-[var(--color-bg-muted)] transition-colors duration-200",
|
|
249
|
-
children:
|
|
320
|
+
children: y("auth.profile.cancel", "Cancel")
|
|
250
321
|
})]
|
|
251
322
|
})]
|
|
252
|
-
}) : /* @__PURE__ */
|
|
323
|
+
}) : /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ _("div", {
|
|
253
324
|
className: "grid grid-cols-1 md:grid-cols-2 gap-6",
|
|
254
325
|
children: [
|
|
255
|
-
/* @__PURE__ */
|
|
326
|
+
/* @__PURE__ */ _("div", {
|
|
256
327
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
257
|
-
children: [/* @__PURE__ */
|
|
328
|
+
children: [/* @__PURE__ */ g("label", {
|
|
258
329
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
259
|
-
children:
|
|
260
|
-
}), /* @__PURE__ */
|
|
330
|
+
children: y("auth.profile.username", "Username")
|
|
331
|
+
}), /* @__PURE__ */ g("p", {
|
|
261
332
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
262
|
-
children:
|
|
333
|
+
children: S.username || "-"
|
|
263
334
|
})]
|
|
264
335
|
}),
|
|
265
|
-
/* @__PURE__ */
|
|
336
|
+
/* @__PURE__ */ _("div", {
|
|
266
337
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
267
|
-
children: [/* @__PURE__ */
|
|
338
|
+
children: [/* @__PURE__ */ g("label", {
|
|
268
339
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
269
|
-
children:
|
|
270
|
-
}), /* @__PURE__ */
|
|
340
|
+
children: y("auth.profile.displayName", "Display Name")
|
|
341
|
+
}), /* @__PURE__ */ g("p", {
|
|
271
342
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
272
|
-
children:
|
|
343
|
+
children: S.name || "-"
|
|
273
344
|
})]
|
|
274
345
|
}),
|
|
275
|
-
/* @__PURE__ */
|
|
346
|
+
/* @__PURE__ */ _("div", {
|
|
276
347
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
277
|
-
children: [/* @__PURE__ */
|
|
348
|
+
children: [/* @__PURE__ */ g("label", {
|
|
278
349
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
279
|
-
children:
|
|
280
|
-
}), /* @__PURE__ */
|
|
350
|
+
children: y("auth.profile.firstName", "First Name")
|
|
351
|
+
}), /* @__PURE__ */ g("p", {
|
|
281
352
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
282
|
-
children:
|
|
353
|
+
children: S.firstName || "-"
|
|
283
354
|
})]
|
|
284
355
|
}),
|
|
285
|
-
/* @__PURE__ */
|
|
356
|
+
/* @__PURE__ */ _("div", {
|
|
286
357
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
287
|
-
children: [/* @__PURE__ */
|
|
358
|
+
children: [/* @__PURE__ */ g("label", {
|
|
288
359
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
289
|
-
children:
|
|
290
|
-
}), /* @__PURE__ */
|
|
360
|
+
children: y("auth.profile.lastName", "Last Name")
|
|
361
|
+
}), /* @__PURE__ */ g("p", {
|
|
291
362
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
292
|
-
children:
|
|
363
|
+
children: S.lastName || "-"
|
|
293
364
|
})]
|
|
294
365
|
}),
|
|
295
|
-
/* @__PURE__ */
|
|
366
|
+
/* @__PURE__ */ _("div", {
|
|
296
367
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
297
|
-
children: [/* @__PURE__ */
|
|
368
|
+
children: [/* @__PURE__ */ g("label", {
|
|
298
369
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
299
|
-
children:
|
|
300
|
-
}), /* @__PURE__ */
|
|
370
|
+
children: y("auth.profile.email", "Email")
|
|
371
|
+
}), /* @__PURE__ */ _("p", {
|
|
301
372
|
className: "text-[var(--color-text-primary)] font-medium flex items-center gap-2",
|
|
302
|
-
children: [
|
|
373
|
+
children: [S.email, S.emailVerified && /* @__PURE__ */ _("span", {
|
|
303
374
|
className: "inline-flex items-center gap-1 text-[var(--color-status-success-text)] text-xs",
|
|
304
|
-
children: [/* @__PURE__ */
|
|
375
|
+
children: [/* @__PURE__ */ g(i, { className: "w-3 h-3" }), y("auth.profile.verified", "Verified")]
|
|
305
376
|
})]
|
|
306
377
|
})]
|
|
307
378
|
}),
|
|
308
|
-
/* @__PURE__ */
|
|
379
|
+
/* @__PURE__ */ _("div", {
|
|
309
380
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
310
|
-
children: [/* @__PURE__ */
|
|
381
|
+
children: [/* @__PURE__ */ g("label", {
|
|
311
382
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
312
|
-
children:
|
|
313
|
-
}), /* @__PURE__ */
|
|
383
|
+
children: y("auth.profile.phoneNumber", "Phone Number")
|
|
384
|
+
}), /* @__PURE__ */ g("p", {
|
|
314
385
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
315
|
-
children:
|
|
386
|
+
children: S.phoneNumber || "-"
|
|
316
387
|
})]
|
|
317
388
|
}),
|
|
318
|
-
/* @__PURE__ */
|
|
389
|
+
/* @__PURE__ */ _("div", {
|
|
319
390
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
320
|
-
children: [/* @__PURE__ */
|
|
391
|
+
children: [/* @__PURE__ */ g("label", {
|
|
321
392
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
322
|
-
children:
|
|
323
|
-
}), /* @__PURE__ */
|
|
393
|
+
children: y("auth.profile.role", "Role")
|
|
394
|
+
}), /* @__PURE__ */ g("p", {
|
|
324
395
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
325
|
-
children:
|
|
396
|
+
children: S.role?.replace("_", " ") || y("auth.profile.member", "Member")
|
|
326
397
|
})]
|
|
327
398
|
}),
|
|
328
|
-
/* @__PURE__ */
|
|
399
|
+
/* @__PURE__ */ _("div", {
|
|
329
400
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
330
|
-
children: [/* @__PURE__ */
|
|
401
|
+
children: [/* @__PURE__ */ g("label", {
|
|
331
402
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
332
|
-
children:
|
|
333
|
-
}), /* @__PURE__ */
|
|
403
|
+
children: y("auth.profile.mfaStatus", "MFA Status")
|
|
404
|
+
}), /* @__PURE__ */ g("p", {
|
|
334
405
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
335
|
-
children:
|
|
406
|
+
children: S.mfaEnabled ? /* @__PURE__ */ _("span", {
|
|
336
407
|
className: "text-[var(--color-status-success-text)] flex items-center gap-1",
|
|
337
|
-
children: [/* @__PURE__ */
|
|
338
|
-
}) : /* @__PURE__ */
|
|
408
|
+
children: [/* @__PURE__ */ g(i, { className: "w-4 h-4" }), y("auth.profile.enabled", "Enabled")]
|
|
409
|
+
}) : /* @__PURE__ */ g("span", {
|
|
339
410
|
className: "text-[var(--color-status-warning-text)]",
|
|
340
|
-
children:
|
|
411
|
+
children: y("auth.profile.notEnabled", "Not Enabled")
|
|
341
412
|
})
|
|
342
413
|
})]
|
|
343
414
|
}),
|
|
344
|
-
/* @__PURE__ */
|
|
415
|
+
/* @__PURE__ */ _("div", {
|
|
345
416
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
346
|
-
children: [/* @__PURE__ */
|
|
417
|
+
children: [/* @__PURE__ */ g("label", {
|
|
347
418
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
348
|
-
children:
|
|
349
|
-
}), /* @__PURE__ */
|
|
419
|
+
children: y("auth.profile.lastLogin", "Last Login")
|
|
420
|
+
}), /* @__PURE__ */ g("p", {
|
|
350
421
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
351
|
-
children:
|
|
422
|
+
children: S.lastLoginAt ? new Date(S.lastLoginAt).toLocaleString() : y("auth.profile.never", "Never")
|
|
352
423
|
})]
|
|
353
424
|
}),
|
|
354
|
-
/* @__PURE__ */
|
|
425
|
+
/* @__PURE__ */ _("div", {
|
|
355
426
|
className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
|
|
356
|
-
children: [/* @__PURE__ */
|
|
427
|
+
children: [/* @__PURE__ */ g("label", {
|
|
357
428
|
className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
|
|
358
|
-
children:
|
|
359
|
-
}), /* @__PURE__ */
|
|
429
|
+
children: y("auth.profile.accountCreated", "Account Created")
|
|
430
|
+
}), /* @__PURE__ */ g("p", {
|
|
360
431
|
className: "text-[var(--color-text-primary)] font-medium",
|
|
361
|
-
children:
|
|
432
|
+
children: S.createdAt ? new Date(S.createdAt).toLocaleString() : "-"
|
|
362
433
|
})]
|
|
363
434
|
})
|
|
364
435
|
]
|
|
365
|
-
}), /* @__PURE__ */
|
|
436
|
+
}), /* @__PURE__ */ _("div", {
|
|
366
437
|
className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
|
|
367
|
-
children: [/* @__PURE__ */
|
|
368
|
-
onClick: () =>
|
|
438
|
+
children: [/* @__PURE__ */ g("button", {
|
|
439
|
+
onClick: () => M(!0),
|
|
369
440
|
className: "auth-primary-button px-6 py-3 font-medium",
|
|
370
|
-
children:
|
|
371
|
-
}), /* @__PURE__ */
|
|
372
|
-
onClick: () =>
|
|
441
|
+
children: y("auth.profile.editProfile", "Edit Profile")
|
|
442
|
+
}), /* @__PURE__ */ g("button", {
|
|
443
|
+
onClick: () => b("/auth/security"),
|
|
373
444
|
className: "px-6 py-3 rounded-xl border border-[var(--color-border-default)] text-[var(--color-text-secondary)] font-medium hover:bg-[var(--color-bg-muted)] transition-colors duration-200",
|
|
374
|
-
children:
|
|
445
|
+
children: y("auth.profile.securitySettings", "Security Settings")
|
|
375
446
|
})]
|
|
376
447
|
})] })
|
|
377
448
|
})]
|
|
378
449
|
}),
|
|
379
|
-
/* @__PURE__ */
|
|
450
|
+
/* @__PURE__ */ _("div", {
|
|
380
451
|
className: "mt-8 grid grid-cols-1 md:grid-cols-3 gap-4",
|
|
381
|
-
children: [/* @__PURE__ */
|
|
382
|
-
onClick: () =>
|
|
452
|
+
children: [/* @__PURE__ */ _("button", {
|
|
453
|
+
onClick: () => b("/auth/mfa"),
|
|
383
454
|
className: "p-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] hover:border-[var(--color-action-primary-border)] transition-colors duration-200 text-left group",
|
|
384
455
|
children: [
|
|
385
|
-
/* @__PURE__ */
|
|
456
|
+
/* @__PURE__ */ g("div", {
|
|
386
457
|
className: "w-10 h-10 rounded-lg bg-[var(--color-bg-accent)] flex items-center justify-center mb-3 group-hover:bg-[var(--color-action-primary-bg-subtle)] transition-colors duration-200",
|
|
387
|
-
children: /* @__PURE__ */
|
|
458
|
+
children: /* @__PURE__ */ g("svg", {
|
|
388
459
|
className: "w-5 h-5 text-[var(--color-text-link)]",
|
|
389
460
|
fill: "none",
|
|
390
461
|
viewBox: "0 0 24 24",
|
|
391
462
|
stroke: "currentColor",
|
|
392
|
-
children: /* @__PURE__ */
|
|
463
|
+
children: /* @__PURE__ */ g("path", {
|
|
393
464
|
strokeLinecap: "round",
|
|
394
465
|
strokeLinejoin: "round",
|
|
395
466
|
strokeWidth: 2,
|
|
@@ -397,27 +468,27 @@ function h() {
|
|
|
397
468
|
})
|
|
398
469
|
})
|
|
399
470
|
}),
|
|
400
|
-
/* @__PURE__ */
|
|
471
|
+
/* @__PURE__ */ g("h3", {
|
|
401
472
|
className: "font-medium text-[var(--color-text-primary)]",
|
|
402
|
-
children:
|
|
473
|
+
children: y("auth.profile.twoFactorAuth", "Two-Factor Auth")
|
|
403
474
|
}),
|
|
404
|
-
/* @__PURE__ */
|
|
475
|
+
/* @__PURE__ */ g("p", {
|
|
405
476
|
className: "text-sm text-[var(--color-text-tertiary)] mt-1",
|
|
406
|
-
children:
|
|
477
|
+
children: S.mfaEnabled ? y("auth.profile.manageMfa", "Manage MFA settings") : y("auth.profile.enableMfa", "Enable MFA for extra security")
|
|
407
478
|
})
|
|
408
479
|
]
|
|
409
|
-
}), /* @__PURE__ */
|
|
410
|
-
onClick: () =>
|
|
480
|
+
}), /* @__PURE__ */ _("button", {
|
|
481
|
+
onClick: () => b("/auth/api-keys"),
|
|
411
482
|
className: "p-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] hover:border-[var(--color-action-secondary-border)] transition-colors duration-200 text-left group",
|
|
412
483
|
children: [
|
|
413
|
-
/* @__PURE__ */
|
|
484
|
+
/* @__PURE__ */ g("div", {
|
|
414
485
|
className: "w-10 h-10 rounded-lg bg-[var(--color-action-secondary-bg-subtle)] flex items-center justify-center mb-3 group-hover:bg-[var(--color-action-secondary-bg-subtle)] transition-colors duration-200",
|
|
415
|
-
children: /* @__PURE__ */
|
|
486
|
+
children: /* @__PURE__ */ g("svg", {
|
|
416
487
|
className: "w-5 h-5 text-[var(--color-action-secondary-text)]",
|
|
417
488
|
fill: "none",
|
|
418
489
|
viewBox: "0 0 24 24",
|
|
419
490
|
stroke: "currentColor",
|
|
420
|
-
children: /* @__PURE__ */
|
|
491
|
+
children: /* @__PURE__ */ g("path", {
|
|
421
492
|
strokeLinecap: "round",
|
|
422
493
|
strokeLinejoin: "round",
|
|
423
494
|
strokeWidth: 2,
|
|
@@ -425,13 +496,13 @@ function h() {
|
|
|
425
496
|
})
|
|
426
497
|
})
|
|
427
498
|
}),
|
|
428
|
-
/* @__PURE__ */
|
|
499
|
+
/* @__PURE__ */ g("h3", {
|
|
429
500
|
className: "font-medium text-[var(--color-text-primary)]",
|
|
430
|
-
children:
|
|
501
|
+
children: y("auth.profile.apiKeys", "API Keys")
|
|
431
502
|
}),
|
|
432
|
-
/* @__PURE__ */
|
|
503
|
+
/* @__PURE__ */ g("p", {
|
|
433
504
|
className: "text-sm text-[var(--color-text-tertiary)] mt-1",
|
|
434
|
-
children:
|
|
505
|
+
children: y("auth.profile.manageApiKeys", "Manage your API access credentials")
|
|
435
506
|
})
|
|
436
507
|
]
|
|
437
508
|
})]
|
|
@@ -440,6 +511,6 @@ function h() {
|
|
|
440
511
|
});
|
|
441
512
|
}
|
|
442
513
|
//#endregion
|
|
443
|
-
export {
|
|
514
|
+
export { v as UserProfilePage };
|
|
444
515
|
|
|
445
516
|
//# sourceMappingURL=UserProfilePage.js.map
|