@burdenoff/microfe-auth 2026.917.1 → 2026.925.1

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.
Files changed (16) hide show
  1. package/dist/auth/pages/UserProfilePage.js +188 -171
  2. package/dist/auth/pages/UserProfilePage.js.map +1 -1
  3. package/dist/auth/pages/UsersPage.js +199 -182
  4. package/dist/auth/pages/UsersPage.js.map +1 -1
  5. package/dist/auth/utils/legalUrls.d.ts +1 -1
  6. package/dist/auth/utils/legalUrls.js.map +1 -1
  7. package/dist/auth/utils/ssoOrigins.js +1 -1
  8. package/dist/auth/utils/ssoOrigins.js.map +1 -1
  9. package/dist/auth/utils/validation.d.ts +19 -0
  10. package/dist/auth/utils/validation.js +20 -1
  11. package/dist/auth/utils/validation.js.map +1 -1
  12. package/dist/microfe-auth.css +1 -1
  13. package/dist/translations/en.d.ts +2 -0
  14. package/dist/translations/en.js +2 -0
  15. package/dist/translations/en.js.map +1 -1
  16. package/package.json +3 -2
package/dist/auth/pages/UserProfilePage.js CHANGED
@@ -3,32 +3,32 @@ import { useTr as t } from "../../shared/hooks/useTr.js";
3
3
  import { AuthLayout as n } from "../components/AuthLayout.js";
4
4
  import { AlertIcon as r, CheckIcon as i, EmailIcon as a, SpinnerIcon as o, UserIcon as s } from "../components/AuthIcons.js";
5
5
  import { useUserOperations as c } from "../hooks/useUserOperations.js";
6
- import { useCompleteAvatarUploadMutation as l, useInitiateAvatarUploadMutation as u } from "../../generated/wspace-operations.js";
7
- import { validateUserFields as d } from "../utils/validation.js";
6
+ import { useCompleteAvatarUploadMutation as ee, useInitiateAvatarUploadMutation as l } from "../../generated/wspace-operations.js";
7
+ import { validatePhoneNumber as u, validateUserFields as d } from "../utils/validation.js";
8
8
  import { useEffect as f, useId as p, useRef as m, useState as h } from "react";
9
9
  import { useNavigate as g } from "react-router";
10
10
  import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
11
11
  import { Button as b } from "@burdenoff/fe-libs/button";
12
12
  import { NextSteps as x, PagePurpose as S } from "@burdenoff/fe-libs/ui";
13
- import { useGatewayClient as C } from "@burdenoff/fe-libs/shared/graphql";
14
- import { useAuth as w } from "@burdenoff/fe-libs/shared/providers/shell/AuthProvider";
13
+ import { useGatewayClient as te } from "@burdenoff/fe-libs/shared/graphql";
14
+ import { useAuth as ne } from "@burdenoff/fe-libs/shared/providers/shell/AuthProvider";
15
15
  //#region src/auth/pages/UserProfilePage.tsx
16
- function T() {
17
- let T = t(), E = g(), D = w(), O = e((e) => e.isAuthenticated), k = e((e) => e.user), A = e((e) => e.setUser), { updateCurrentUserProfile: j, isLoading: M } = c(), N = p(), P = p(), F = p(), I = p(), L = p(), R = e((e) => e.currentWorkspaceId), z = C("workspace"), [B] = u({ client: z }), [V] = l({ client: z }), H = m(null), [U, W] = h(!1), G = async (e) => {
16
+ function C() {
17
+ let C = t(), w = g(), T = ne(), E = e((e) => e.isAuthenticated), D = e((e) => e.user), O = e((e) => e.setUser), { updateCurrentUserProfile: k, isLoading: A } = c(), j = p(), M = p(), N = p(), P = p(), F = p(), I = e((e) => e.currentWorkspaceId), L = te("workspace"), [R] = l({ client: L }), [z] = ee({ client: L }), B = m(null), [V, H] = h(!1), U = async (e) => {
18
18
  let t = e.target.files?.[0];
19
19
  if (!t) return;
20
20
  if (!t.type.startsWith("image/")) {
21
- Z(T("auth.profile.invalidImageType", "Please select an image file"));
21
+ Y(C("auth.profile.invalidImageType", "Please select an image file"));
22
22
  return;
23
23
  }
24
- if (!R) {
25
- Z(T("auth.profile.noWorkspace", "Please select a workspace before uploading a profile picture"));
24
+ if (!I) {
25
+ Y(C("auth.profile.noWorkspace", "Please select a workspace before uploading a profile picture"));
26
26
  return;
27
27
  }
28
- W(!0), Z(null);
29
- let n = { "x-workspace-id": R };
28
+ H(!0), Y(null);
29
+ let n = { "x-workspace-id": I };
30
30
  try {
31
- let e = t.name.split(".").pop()?.toLowerCase() ?? "", r = await B({
31
+ let e = t.name.split(".").pop()?.toLowerCase() ?? "", r = await R({
32
32
  variables: { input: {
33
33
  fileName: t.name,
34
34
  fileSize: t.size.toString(),
@@ -43,38 +43,38 @@ function T() {
43
43
  headers: { "Content-Type": t.type },
44
44
  body: t
45
45
  })).ok) throw Error("Failed to upload file");
46
- let o = (await V({
46
+ let o = (await z({
47
47
  variables: { input: { sessionId: i.id } },
48
48
  context: { headers: n }
49
49
  })).data?.completeUpload.file?.downloadUrl;
50
50
  if (!o) throw Error("Upload succeeded but no URL returned");
51
- await j({ avatar: o }), k && A({
52
- ...k,
51
+ await k({ avatar: o }), D && O({
52
+ ...D,
53
53
  avatar: o
54
- }), D.updateUser({ avatar: o }), $(T("auth.profile.avatarUpdated", "Profile picture updated!"));
54
+ }), T.updateUser({ avatar: o }), $(C("auth.profile.avatarUpdated", "Profile picture updated!"));
55
55
  } catch (e) {
56
- Z(e instanceof Error ? e.message : T("auth.profile.avatarFailed", "Failed to upload picture"));
56
+ Y(e instanceof Error ? e.message : C("auth.profile.avatarFailed", "Failed to upload picture"));
57
57
  } finally {
58
- W(!1), H.current && (H.current.value = "");
58
+ H(!1), B.current && (B.current.value = "");
59
59
  }
60
- }, [K, q] = h(!1), [J, Y] = h({
60
+ }, [W, G] = h(!1), [K, q] = h({
61
61
  username: "",
62
62
  firstName: "",
63
63
  lastName: "",
64
64
  name: "",
65
65
  phoneNumber: ""
66
- }), [X, Z] = h(null), [Q, $] = h(null);
66
+ }), [J, Y] = h(null), [X, Z] = h(null), [Q, $] = h(null);
67
67
  return f(() => {
68
- k && Y({
69
- username: k.username || "",
70
- firstName: k.firstName || "",
71
- lastName: k.lastName || "",
72
- name: k.name || "",
73
- phoneNumber: k.phoneNumber || ""
68
+ D && q({
69
+ username: D.username || "",
70
+ firstName: D.firstName || "",
71
+ lastName: D.lastName || "",
72
+ name: D.name || "",
73
+ phoneNumber: D.phoneNumber || ""
74
74
  });
75
- }, [k]), !O || !k ? /* @__PURE__ */ v(n, {
76
- title: T("auth.profile.title", "Profile"),
77
- subtitle: T("auth.profile.subtitle", "View and manage your profile"),
75
+ }, [D]), !E || !D ? /* @__PURE__ */ v(n, {
76
+ title: C("auth.profile.title", "Profile"),
77
+ subtitle: C("auth.profile.subtitle", "View and manage your profile"),
78
78
  children: /* @__PURE__ */ y("div", {
79
79
  className: "text-center py-12",
80
80
  children: [
@@ -84,19 +84,19 @@ function T() {
84
84
  }),
85
85
  /* @__PURE__ */ v("h2", {
86
86
  className: "text-xl font-semibold text-[var(--color-text-primary)] mb-2",
87
- children: T("auth.profile.authRequired", "Authentication Required")
87
+ children: C("auth.profile.authRequired", "Authentication Required")
88
88
  }),
89
89
  /* @__PURE__ */ v("p", {
90
90
  className: "text-[var(--color-text-secondary)] mb-6",
91
- children: T("auth.profile.signInToView", "Please sign in to view your profile")
91
+ children: C("auth.profile.signInToView", "Please sign in to view your profile")
92
92
  }),
93
93
  /* @__PURE__ */ v(b, {
94
94
  type: "button",
95
- onClick: () => E("/auth/login"),
95
+ onClick: () => w("/auth/login"),
96
96
  variant: "default",
97
97
  size: "lg",
98
98
  className: "font-semibold",
99
- children: T("auth.profile.signIn", "Sign In")
99
+ children: C("auth.profile.signIn", "Sign In")
100
100
  })
101
101
  ]
102
102
  })
@@ -108,15 +108,15 @@ function T() {
108
108
  children: [
109
109
  /* @__PURE__ */ v("h1", {
110
110
  className: "text-3xl font-semibold text-[var(--color-text-primary)]",
111
- children: T("auth.profile.myProfile", "My Profile")
111
+ children: C("auth.profile.myProfile", "My Profile")
112
112
  }),
113
113
  /* @__PURE__ */ v("p", {
114
114
  className: "text-[var(--color-text-secondary)] mt-2",
115
- children: T("auth.profile.viewAndManage", "View and manage your account information")
115
+ children: C("auth.profile.viewAndManage", "View and manage your account information")
116
116
  }),
117
117
  /* @__PURE__ */ v(S, {
118
118
  className: "mt-3",
119
- children: T("auth.profile.purpose", "This is how you appear across the platform. Update your name, photo, and contact details here — teammates see this information, and we use your email for sign-in and important notices.")
119
+ children: C("auth.profile.purpose", "This is how you appear across the platform. Update your name, photo, and contact details here — teammates see this information, and we use your email for sign-in and important notices.")
120
120
  })
121
121
  ]
122
122
  }),
@@ -132,11 +132,11 @@ function T() {
132
132
  type: "button",
133
133
  onClick: () => $(null),
134
134
  className: "ml-auto text-sm text-[var(--color-status-success-text)] hover:underline transition-colors duration-200",
135
- children: T("auth.profile.dismiss", "Dismiss")
135
+ children: C("auth.profile.dismiss", "Dismiss")
136
136
  })
137
137
  ]
138
138
  }),
139
- X && /* @__PURE__ */ y("div", {
139
+ J && /* @__PURE__ */ y("div", {
140
140
  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)]",
141
141
  children: [
142
142
  /* @__PURE__ */ v(r, { className: "size-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }),
@@ -144,14 +144,14 @@ function T() {
144
144
  className: "flex-1",
145
145
  children: /* @__PURE__ */ v("p", {
146
146
  className: "text-sm text-[var(--color-status-error-text)]",
147
- children: X
147
+ children: J
148
148
  })
149
149
  }),
150
150
  /* @__PURE__ */ v("button", {
151
151
  type: "button",
152
- onClick: () => Z(null),
152
+ onClick: () => Y(null),
153
153
  className: "text-sm text-[var(--color-status-error-text)] hover:underline transition-colors duration-200",
154
- children: T("auth.profile.dismiss", "Dismiss")
154
+ children: C("auth.profile.dismiss", "Dismiss")
155
155
  })
156
156
  ]
157
157
  }),
@@ -164,21 +164,21 @@ function T() {
164
164
  children: [/* @__PURE__ */ y("div", {
165
165
  className: "relative group",
166
166
  children: [
167
- k.avatar ? /* @__PURE__ */ v("img", {
168
- src: k.avatar,
169
- alt: T("auth.profile.avatarAlt", "Profile picture"),
167
+ D.avatar ? /* @__PURE__ */ v("img", {
168
+ src: D.avatar,
169
+ alt: C("auth.profile.avatarAlt", "Profile picture"),
170
170
  className: "size-20 rounded-full object-cover shadow-lg"
171
171
  }) : /* @__PURE__ */ v("div", {
172
172
  className: "size-20 rounded-full bg-accent-soft backdrop-blur-sm flex items-center justify-center text-[var(--color-action-primary-bg)] text-3xl font-semibold shadow-lg",
173
- children: (k.name || k.username || k.email).charAt(0).toUpperCase()
173
+ children: (D.name || D.username || D.email).charAt(0).toUpperCase()
174
174
  }),
175
175
  /* @__PURE__ */ v("button", {
176
176
  type: "button",
177
- onClick: () => H.current?.click(),
178
- disabled: U,
179
- "aria-label": T("auth.profile.changeAvatar", "Change profile picture"),
177
+ onClick: () => B.current?.click(),
178
+ disabled: V,
179
+ "aria-label": C("auth.profile.changeAvatar", "Change profile picture"),
180
180
  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",
181
- children: U ? /* @__PURE__ */ v(o, { className: "size-6 text-white animate-spin" }) : /* @__PURE__ */ y("svg", {
181
+ children: V ? /* @__PURE__ */ v(o, { className: "size-6 text-white animate-spin" }) : /* @__PURE__ */ y("svg", {
182
182
  className: "size-6 text-white",
183
183
  fill: "none",
184
184
  viewBox: "0 0 24 24",
@@ -197,13 +197,13 @@ function T() {
197
197
  })
198
198
  }),
199
199
  /* @__PURE__ */ v("input", {
200
- ref: H,
200
+ ref: B,
201
201
  type: "file",
202
202
  accept: "image/*",
203
203
  className: "hidden",
204
- onChange: (e) => void G(e),
204
+ onChange: (e) => void U(e),
205
205
  tabIndex: -1,
206
- "aria-label": T("auth.profile.avatarUpload", "Upload avatar image")
206
+ "aria-label": C("auth.profile.avatarUpload", "Upload avatar image")
207
207
  })
208
208
  ]
209
209
  }), /* @__PURE__ */ y("div", {
@@ -211,20 +211,20 @@ function T() {
211
211
  children: [
212
212
  /* @__PURE__ */ v("h2", {
213
213
  className: "text-2xl font-semibold",
214
- children: k.name || `${k.firstName || ""} ${k.lastName || ""}`.trim() || k.username
214
+ children: D.name || `${D.firstName || ""} ${D.lastName || ""}`.trim() || D.username
215
215
  }),
216
216
  /* @__PURE__ */ y("p", {
217
217
  className: "text-text-secondary flex items-center gap-2",
218
- children: [/* @__PURE__ */ v(a, { className: "size-4" }), k.email]
218
+ children: [/* @__PURE__ */ v(a, { className: "size-4" }), D.email]
219
219
  }),
220
220
  /* @__PURE__ */ y("div", {
221
221
  className: "flex items-center gap-2 mt-2",
222
222
  children: [/* @__PURE__ */ v("span", {
223
223
  className: "px-2.5 py-1 rounded-full text-xs font-medium bg-bg-surface/60 text-text-secondary backdrop-blur-sm",
224
- children: k.role?.replace("_", " ") || T("auth.profile.member", "Member")
225
- }), k.emailVerified && /* @__PURE__ */ y("span", {
224
+ children: D.role?.replace("_", " ") || C("auth.profile.member", "Member")
225
+ }), D.emailVerified && /* @__PURE__ */ y("span", {
226
226
  className: "px-2.5 py-1 rounded-full text-xs font-medium bg-status-success-bg-subtle text-status-success-text flex items-center gap-1",
227
- children: [/* @__PURE__ */ v(i, { className: "size-3" }), T("auth.profile.verified", "Verified")]
227
+ children: [/* @__PURE__ */ v(i, { className: "size-3" }), C("auth.profile.verified", "Verified")]
228
228
  })]
229
229
  })
230
230
  ]
@@ -232,24 +232,28 @@ function T() {
232
232
  })
233
233
  }), /* @__PURE__ */ v("div", {
234
234
  className: "p-6",
235
- children: K ? /* @__PURE__ */ y("form", {
235
+ children: W ? /* @__PURE__ */ y("form", {
236
236
  onSubmit: async (e) => {
237
- e.preventDefault(), Z(null), $(null);
238
- let t = d(J, { requireAll: !1 });
237
+ if (e.preventDefault(), Y(null), Z(null), $(null), !u(K.phoneNumber).valid) {
238
+ let e = C("auth.profile.phoneNumber_invalid", "Invalid phone number");
239
+ Z(e), Y(e);
240
+ return;
241
+ }
242
+ let t = d(K, { requireAll: !1 });
239
243
  if (!t.valid) {
240
- Z(t.errors.map((e) => T(`auth.profile.${e.field}_${e.code}`, e.message)).join(" · "));
244
+ Y(t.errors.map((e) => C(`auth.profile.${e.field}_${e.code}`, e.message)).join(" · "));
241
245
  return;
242
246
  }
243
247
  try {
244
- await j({
248
+ await k({
245
249
  username: t.values.username || void 0,
246
250
  firstName: t.values.firstName || void 0,
247
251
  lastName: t.values.lastName || void 0,
248
- name: J.name || void 0,
249
- phoneNumber: J.phoneNumber || void 0
250
- }), $(T("auth.profile.updateSuccess", "Profile updated successfully!")), q(!1);
252
+ name: K.name || void 0,
253
+ phoneNumber: K.phoneNumber || void 0
254
+ }), $(C("auth.profile.updateSuccess", "Profile updated successfully!")), G(!1);
251
255
  } catch (e) {
252
- Z(e instanceof Error ? e.message : T("auth.profile.updateFailed", "Failed to update profile"));
256
+ Y(e instanceof Error ? e.message : C("auth.profile.updateFailed", "Failed to update profile"));
253
257
  }
254
258
  },
255
259
  className: "space-y-6",
@@ -257,9 +261,9 @@ function T() {
257
261
  className: "grid grid-cols-1 md:grid-cols-2 gap-6",
258
262
  children: [
259
263
  /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
260
- htmlFor: N,
264
+ htmlFor: j,
261
265
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
262
- children: T("auth.profile.username", "Username")
266
+ children: C("auth.profile.username", "Username")
263
267
  }), /* @__PURE__ */ y("div", {
264
268
  className: "relative",
265
269
  children: [/* @__PURE__ */ v("div", {
@@ -269,108 +273,121 @@ function T() {
269
273
  "aria-hidden": "true"
270
274
  })
271
275
  }), /* @__PURE__ */ v("input", {
272
- id: N,
276
+ id: j,
273
277
  type: "text",
274
- "aria-label": T("auth.profile.username", "Username"),
275
- value: J.username,
276
- onChange: (e) => Y({
277
- ...J,
278
+ "aria-label": C("auth.profile.username", "Username"),
279
+ value: K.username,
280
+ onChange: (e) => q({
281
+ ...K,
278
282
  username: e.target.value
279
283
  }),
280
284
  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",
281
- placeholder: T("auth.profile.usernamePlaceholder", "Enter username")
285
+ placeholder: C("auth.profile.usernamePlaceholder", "Enter username")
282
286
  })]
283
287
  })] }),
284
288
  /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
285
- htmlFor: P,
289
+ htmlFor: M,
286
290
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
287
- children: T("auth.profile.displayName", "Display Name")
291
+ children: C("auth.profile.displayName", "Display Name")
288
292
  }), /* @__PURE__ */ v("input", {
289
- id: P,
293
+ id: M,
290
294
  type: "text",
291
- "aria-label": T("auth.profile.displayName", "Display Name"),
292
- value: J.name,
293
- onChange: (e) => Y({
294
- ...J,
295
+ "aria-label": C("auth.profile.displayName", "Display Name"),
296
+ value: K.name,
297
+ onChange: (e) => q({
298
+ ...K,
295
299
  name: e.target.value
296
300
  }),
297
301
  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",
298
- placeholder: T("auth.profile.displayNamePlaceholder", "Enter display name")
302
+ placeholder: C("auth.profile.displayNamePlaceholder", "Enter display name")
299
303
  })] }),
300
304
  /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
301
- htmlFor: F,
305
+ htmlFor: N,
302
306
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
303
- children: T("auth.profile.firstName", "First Name")
307
+ children: C("auth.profile.firstName", "First Name")
304
308
  }), /* @__PURE__ */ v("input", {
305
- id: F,
309
+ id: N,
306
310
  type: "text",
307
- "aria-label": T("auth.profile.firstName", "First Name"),
308
- value: J.firstName,
309
- onChange: (e) => Y({
310
- ...J,
311
+ "aria-label": C("auth.profile.firstName", "First Name"),
312
+ value: K.firstName,
313
+ onChange: (e) => q({
314
+ ...K,
311
315
  firstName: e.target.value
312
316
  }),
313
317
  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",
314
- placeholder: T("auth.profile.firstNamePlaceholder", "Enter first name")
318
+ placeholder: C("auth.profile.firstNamePlaceholder", "Enter first name")
315
319
  })] }),
316
320
  /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
317
- htmlFor: I,
321
+ htmlFor: P,
318
322
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
319
- children: T("auth.profile.lastName", "Last Name")
323
+ children: C("auth.profile.lastName", "Last Name")
320
324
  }), /* @__PURE__ */ v("input", {
321
- id: I,
325
+ id: P,
322
326
  type: "text",
323
- "aria-label": T("auth.profile.lastName", "Last Name"),
324
- value: J.lastName,
325
- onChange: (e) => Y({
326
- ...J,
327
+ "aria-label": C("auth.profile.lastName", "Last Name"),
328
+ value: K.lastName,
329
+ onChange: (e) => q({
330
+ ...K,
327
331
  lastName: e.target.value
328
332
  }),
329
333
  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",
330
- placeholder: T("auth.profile.lastNamePlaceholder", "Enter last name")
334
+ placeholder: C("auth.profile.lastNamePlaceholder", "Enter last name")
331
335
  })] }),
332
336
  /* @__PURE__ */ y("div", {
333
337
  className: "md:col-span-2",
334
- children: [/* @__PURE__ */ v("label", {
335
- htmlFor: L,
336
- className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
337
- children: T("auth.profile.phoneNumber", "Phone Number")
338
- }), /* @__PURE__ */ v("input", {
339
- id: L,
340
- type: "tel",
341
- "aria-label": T("auth.profile.phoneNumber", "Phone Number"),
342
- value: J.phoneNumber,
343
- onChange: (e) => Y({
344
- ...J,
345
- phoneNumber: e.target.value
338
+ children: [
339
+ /* @__PURE__ */ v("label", {
340
+ htmlFor: F,
341
+ className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
342
+ children: C("auth.profile.phoneNumber", "Phone Number")
346
343
  }),
347
- 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",
348
- placeholder: T("auth.profile.phonePlaceholder", "Enter phone number")
349
- })]
344
+ /* @__PURE__ */ v("input", {
345
+ id: F,
346
+ type: "tel",
347
+ "aria-label": C("auth.profile.phoneNumber", "Phone Number"),
348
+ "aria-invalid": X ? !0 : void 0,
349
+ "aria-describedby": X ? `${F}-error` : void 0,
350
+ value: K.phoneNumber,
351
+ onChange: (e) => {
352
+ q({
353
+ ...K,
354
+ phoneNumber: e.target.value
355
+ }), X && (Z(null), Y(null));
356
+ },
357
+ 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",
358
+ placeholder: C("auth.profile.phonePlaceholder", "Enter phone number")
359
+ }),
360
+ X && /* @__PURE__ */ v("p", {
361
+ id: `${F}-error`,
362
+ role: "alert",
363
+ className: "mt-2 text-sm text-[var(--color-status-error-text)]",
364
+ children: X
365
+ })
366
+ ]
350
367
  })
351
368
  ]
352
369
  }), /* @__PURE__ */ y("div", {
353
- className: "flex gap-3 pt-4 border-t border-[var(--color-border-default)]",
370
+ className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
354
371
  children: [/* @__PURE__ */ v(b, {
355
372
  type: "submit",
356
- disabled: M,
373
+ disabled: A,
357
374
  variant: "default",
358
375
  size: "lg",
359
376
  className: "font-semibold",
360
- children: M ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(o, { className: "size-4 animate-spin" }), T("auth.profile.saving", "Saving...")] }) : T("auth.profile.saveChanges", "Save Changes")
377
+ children: A ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(o, { className: "size-4 animate-spin" }), C("auth.profile.saving", "Saving...")] }) : C("auth.profile.saveChanges", "Save Changes")
361
378
  }), /* @__PURE__ */ v("button", {
362
379
  type: "button",
363
380
  onClick: () => {
364
- k && Y({
365
- username: k.username || "",
366
- firstName: k.firstName || "",
367
- lastName: k.lastName || "",
368
- name: k.name || "",
369
- phoneNumber: k.phoneNumber || ""
370
- }), q(!1), Z(null);
381
+ D && q({
382
+ username: D.username || "",
383
+ firstName: D.firstName || "",
384
+ lastName: D.lastName || "",
385
+ name: D.name || "",
386
+ phoneNumber: D.phoneNumber || ""
387
+ }), G(!1), Y(null), Z(null);
371
388
  },
372
- 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",
373
- children: T("auth.profile.cancel", "Cancel")
389
+ className: "inline-flex items-center h-10 px-8 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",
390
+ children: C("auth.profile.cancel", "Cancel")
374
391
  })]
375
392
  })]
376
393
  }) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ y("div", {
@@ -380,52 +397,52 @@ function T() {
380
397
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
381
398
  children: [/* @__PURE__ */ v("label", {
382
399
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
383
- children: T("auth.profile.username", "Username")
400
+ children: C("auth.profile.username", "Username")
384
401
  }), /* @__PURE__ */ v("p", {
385
402
  className: "text-[var(--color-text-primary)] font-medium",
386
- children: k.username || "-"
403
+ children: D.username || "-"
387
404
  })]
388
405
  }),
389
406
  /* @__PURE__ */ y("div", {
390
407
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
391
408
  children: [/* @__PURE__ */ v("label", {
392
409
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
393
- children: T("auth.profile.displayName", "Display Name")
410
+ children: C("auth.profile.displayName", "Display Name")
394
411
  }), /* @__PURE__ */ v("p", {
395
412
  className: "text-[var(--color-text-primary)] font-medium",
396
- children: k.name || "-"
413
+ children: D.name || "-"
397
414
  })]
398
415
  }),
399
416
  /* @__PURE__ */ y("div", {
400
417
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
401
418
  children: [/* @__PURE__ */ v("label", {
402
419
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
403
- children: T("auth.profile.firstName", "First Name")
420
+ children: C("auth.profile.firstName", "First Name")
404
421
  }), /* @__PURE__ */ v("p", {
405
422
  className: "text-[var(--color-text-primary)] font-medium",
406
- children: k.firstName || "-"
423
+ children: D.firstName || "-"
407
424
  })]
408
425
  }),
409
426
  /* @__PURE__ */ y("div", {
410
427
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
411
428
  children: [/* @__PURE__ */ v("label", {
412
429
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
413
- children: T("auth.profile.lastName", "Last Name")
430
+ children: C("auth.profile.lastName", "Last Name")
414
431
  }), /* @__PURE__ */ v("p", {
415
432
  className: "text-[var(--color-text-primary)] font-medium",
416
- children: k.lastName || "-"
433
+ children: D.lastName || "-"
417
434
  })]
418
435
  }),
419
436
  /* @__PURE__ */ y("div", {
420
437
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
421
438
  children: [/* @__PURE__ */ v("label", {
422
439
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
423
- children: T("auth.profile.email", "Email")
440
+ children: C("auth.profile.email", "Email")
424
441
  }), /* @__PURE__ */ y("p", {
425
442
  className: "text-[var(--color-text-primary)] font-medium flex items-center gap-2",
426
- children: [k.email, k.emailVerified && /* @__PURE__ */ y("span", {
443
+ children: [D.email, D.emailVerified && /* @__PURE__ */ y("span", {
427
444
  className: "inline-flex items-center gap-1 text-[var(--color-status-success-text)] text-xs",
428
- children: [/* @__PURE__ */ v(i, { className: "size-3" }), T("auth.profile.verified", "Verified")]
445
+ children: [/* @__PURE__ */ v(i, { className: "size-3" }), C("auth.profile.verified", "Verified")]
429
446
  })]
430
447
  })]
431
448
  }),
@@ -433,35 +450,35 @@ function T() {
433
450
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
434
451
  children: [/* @__PURE__ */ v("label", {
435
452
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
436
- children: T("auth.profile.phoneNumber", "Phone Number")
453
+ children: C("auth.profile.phoneNumber", "Phone Number")
437
454
  }), /* @__PURE__ */ v("p", {
438
455
  className: "text-[var(--color-text-primary)] font-medium",
439
- children: k.phoneNumber || "-"
456
+ children: D.phoneNumber || "-"
440
457
  })]
441
458
  }),
442
459
  /* @__PURE__ */ y("div", {
443
460
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
444
461
  children: [/* @__PURE__ */ v("label", {
445
462
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
446
- children: T("auth.profile.role", "Role")
463
+ children: C("auth.profile.role", "Role")
447
464
  }), /* @__PURE__ */ v("p", {
448
465
  className: "text-[var(--color-text-primary)] font-medium",
449
- children: k.role?.replace("_", " ") || T("auth.profile.member", "Member")
466
+ children: D.role?.replace("_", " ") || C("auth.profile.member", "Member")
450
467
  })]
451
468
  }),
452
469
  /* @__PURE__ */ y("div", {
453
470
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
454
471
  children: [/* @__PURE__ */ v("label", {
455
472
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
456
- children: T("auth.profile.mfaStatus", "MFA Status")
473
+ children: C("auth.profile.mfaStatus", "MFA Status")
457
474
  }), /* @__PURE__ */ v("p", {
458
475
  className: "text-[var(--color-text-primary)] font-medium",
459
- children: k.mfaEnabled ? /* @__PURE__ */ y("span", {
476
+ children: D.mfaEnabled ? /* @__PURE__ */ y("span", {
460
477
  className: "text-[var(--color-status-success-text)] flex items-center gap-1",
461
- children: [/* @__PURE__ */ v(i, { className: "size-4" }), T("auth.profile.enabled", "Enabled")]
478
+ children: [/* @__PURE__ */ v(i, { className: "size-4" }), C("auth.profile.enabled", "Enabled")]
462
479
  }) : /* @__PURE__ */ v("span", {
463
480
  className: "text-[var(--color-status-warning-text)]",
464
- children: T("auth.profile.notEnabled", "Not Enabled")
481
+ children: C("auth.profile.notEnabled", "Not Enabled")
465
482
  })
466
483
  })]
467
484
  }),
@@ -469,20 +486,20 @@ function T() {
469
486
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
470
487
  children: [/* @__PURE__ */ v("label", {
471
488
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
472
- children: T("auth.profile.lastLogin", "Last Login")
489
+ children: C("auth.profile.lastLogin", "Last Login")
473
490
  }), /* @__PURE__ */ v("p", {
474
491
  className: "text-[var(--color-text-primary)] font-medium",
475
- children: k.lastLoginAt ? new Date(k.lastLoginAt).toLocaleString() : T("auth.profile.never", "Never")
492
+ children: D.lastLoginAt ? new Date(D.lastLoginAt).toLocaleString() : C("auth.profile.never", "Never")
476
493
  })]
477
494
  }),
478
495
  /* @__PURE__ */ y("div", {
479
496
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
480
497
  children: [/* @__PURE__ */ v("label", {
481
498
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
482
- children: T("auth.profile.accountCreated", "Account Created")
499
+ children: C("auth.profile.accountCreated", "Account Created")
483
500
  }), /* @__PURE__ */ v("p", {
484
501
  className: "text-[var(--color-text-primary)] font-medium",
485
- children: k.createdAt ? new Date(k.createdAt).toLocaleString() : "-"
502
+ children: D.createdAt ? new Date(D.createdAt).toLocaleString() : "-"
486
503
  })]
487
504
  })
488
505
  ]
@@ -490,16 +507,16 @@ function T() {
490
507
  className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
491
508
  children: [/* @__PURE__ */ v(b, {
492
509
  type: "button",
493
- onClick: () => q(!0),
510
+ onClick: () => G(!0),
494
511
  variant: "default",
495
512
  size: "lg",
496
513
  className: "font-semibold",
497
- children: T("auth.profile.editProfile", "Edit Profile")
514
+ children: C("auth.profile.editProfile", "Edit Profile")
498
515
  }), /* @__PURE__ */ v("button", {
499
516
  type: "button",
500
- onClick: () => E("/auth/security"),
501
- 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",
502
- children: T("auth.profile.securitySettings", "Security Settings")
517
+ onClick: () => w("/auth/security"),
518
+ className: "inline-flex items-center h-10 px-8 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",
519
+ children: C("auth.profile.securitySettings", "Security Settings")
503
520
  })]
504
521
  })] })
505
522
  })]
@@ -510,23 +527,23 @@ function T() {
510
527
  steps: [
511
528
  {
512
529
  id: "edit-profile",
513
- label: T("auth.profile.nextEdit", "Complete your profile"),
514
- description: T("auth.profile.nextEditDesc", "Add your display name and photo so teammates recognise you."),
515
- onClick: () => q(!0),
516
- done: !!(k.name && k.avatar)
530
+ label: C("auth.profile.nextEdit", "Complete your profile"),
531
+ description: C("auth.profile.nextEditDesc", "Add your display name and photo so teammates recognise you."),
532
+ onClick: () => G(!0),
533
+ done: !!(D.name && D.avatar)
517
534
  },
518
535
  {
519
536
  id: "enable-mfa",
520
- label: T("auth.profile.nextMfa", "Secure your account with 2FA"),
521
- description: T("auth.profile.nextMfaDesc", "Turn on two-factor authentication for stronger protection."),
522
- onClick: () => E("/auth/mfa"),
523
- done: !!k.mfaEnabled
537
+ label: C("auth.profile.nextMfa", "Secure your account with 2FA"),
538
+ description: C("auth.profile.nextMfaDesc", "Turn on two-factor authentication for stronger protection."),
539
+ onClick: () => w("/auth/mfa"),
540
+ done: !!D.mfaEnabled
524
541
  },
525
542
  {
526
543
  id: "security-center",
527
- label: T("auth.profile.nextSecurity", "Visit the Security Center"),
528
- description: T("auth.profile.nextSecurityDesc", "Review sessions, password, and account options."),
529
- onClick: () => E("/auth/security")
544
+ label: C("auth.profile.nextSecurity", "Visit the Security Center"),
545
+ description: C("auth.profile.nextSecurityDesc", "Review sessions, password, and account options."),
546
+ onClick: () => w("/auth/security")
530
547
  }
531
548
  ]
532
549
  }),
@@ -534,7 +551,7 @@ function T() {
534
551
  className: "mt-8 grid grid-cols-1 md:grid-cols-3 gap-4",
535
552
  children: [/* @__PURE__ */ y("button", {
536
553
  type: "button",
537
- onClick: () => E("/auth/mfa"),
554
+ onClick: () => w("/auth/mfa"),
538
555
  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",
539
556
  children: [
540
557
  /* @__PURE__ */ v("div", {
@@ -554,16 +571,16 @@ function T() {
554
571
  }),
555
572
  /* @__PURE__ */ v("h3", {
556
573
  className: "font-medium text-[var(--color-text-primary)]",
557
- children: T("auth.profile.twoFactorAuth", "Two-Factor Auth")
574
+ children: C("auth.profile.twoFactorAuth", "Two-Factor Auth")
558
575
  }),
559
576
  /* @__PURE__ */ v("p", {
560
577
  className: "text-sm text-[var(--color-text-tertiary)] mt-1",
561
- children: k.mfaEnabled ? T("auth.profile.manageMfa", "Manage MFA settings") : T("auth.profile.enableMfa", "Enable MFA for extra security")
578
+ children: D.mfaEnabled ? C("auth.profile.manageMfa", "Manage MFA settings") : C("auth.profile.enableMfa", "Enable MFA for extra security")
562
579
  })
563
580
  ]
564
581
  }), /* @__PURE__ */ y("button", {
565
582
  type: "button",
566
- onClick: () => E("/devportal/api-keys"),
583
+ onClick: () => w("/devportal/api-keys"),
567
584
  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",
568
585
  children: [
569
586
  /* @__PURE__ */ v("div", {
@@ -583,11 +600,11 @@ function T() {
583
600
  }),
584
601
  /* @__PURE__ */ v("h3", {
585
602
  className: "font-medium text-[var(--color-text-primary)]",
586
- children: T("auth.profile.apiKeys", "API Keys")
603
+ children: C("auth.profile.apiKeys", "API Keys")
587
604
  }),
588
605
  /* @__PURE__ */ v("p", {
589
606
  className: "text-sm text-[var(--color-text-tertiary)] mt-1",
590
- children: T("auth.profile.manageApiKeys", "Manage your API access credentials")
607
+ children: C("auth.profile.manageApiKeys", "Manage your API access credentials")
591
608
  })
592
609
  ]
593
610
  })]
@@ -596,6 +613,6 @@ function T() {
596
613
  });
597
614
  }
598
615
  //#endregion
599
- export { T as UserProfilePage };
616
+ export { C as UserProfilePage };
600
617
 
601
618
  //# sourceMappingURL=UserProfilePage.js.map