@burdenoff/microfe-auth 2026.514.3 → 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.
@@ -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 { useEffect as c, useState as l } from "react";
7
- import { useNavigate as u } from "react-router-dom";
8
- import { useI18n as d } from "@burdenoff/fe-libs/shared/providers/shell";
9
- import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
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 h() {
12
- let { t: h } = d(), g = (e, t) => {
13
- let n = h(e);
12
+ function v() {
13
+ let { t: v } = m(), y = (e, t) => {
14
+ let n = v(e);
14
15
  return n === e ? t : n;
15
- }, _ = u(), v = e((e) => e.isAuthenticated), y = e((e) => e.user), { updateCurrentUserProfile: b, isLoading: x } = t(), [S, C] = l(!1), [w, T] = l({
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
- }), [E, D] = l(null), [O, k] = l(null);
22
- return c(() => {
23
- y && T({
24
- username: y.username || "",
25
- firstName: y.firstName || "",
26
- lastName: y.lastName || "",
27
- name: y.name || "",
28
- phoneNumber: y.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
- }, [y]), !v || !y ? /* @__PURE__ */ p(n, {
31
- title: g("auth.profile.title", "Profile"),
32
- subtitle: g("auth.profile.subtitle", "View and manage your profile"),
33
- children: /* @__PURE__ */ m("div", {
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__ */ p("div", {
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__ */ p(r, { className: "w-8 h-8 text-[var(--color-status-warning-text)]" })
68
+ children: /* @__PURE__ */ g(r, { className: "w-8 h-8 text-[var(--color-status-warning-text)]" })
39
69
  }),
40
- /* @__PURE__ */ p("h2", {
70
+ /* @__PURE__ */ g("h2", {
41
71
  className: "text-xl font-semibold text-[var(--color-text-primary)] mb-2",
42
- children: g("auth.profile.authRequired", "Authentication Required")
72
+ children: y("auth.profile.authRequired", "Authentication Required")
43
73
  }),
44
- /* @__PURE__ */ p("p", {
74
+ /* @__PURE__ */ g("p", {
45
75
  className: "text-[var(--color-text-secondary)] mb-6",
46
- children: g("auth.profile.signInToView", "Please sign in to view your profile")
76
+ children: y("auth.profile.signInToView", "Please sign in to view your profile")
47
77
  }),
48
- /* @__PURE__ */ p("button", {
49
- onClick: () => _("/auth/login"),
78
+ /* @__PURE__ */ g("button", {
79
+ onClick: () => b("/auth/login"),
50
80
  className: "auth-primary-button px-6 py-3 font-semibold",
51
- children: g("auth.profile.signIn", "Sign In")
81
+ children: y("auth.profile.signIn", "Sign In")
52
82
  })
53
83
  ]
54
84
  })
55
- }) : /* @__PURE__ */ m("div", {
85
+ }) : /* @__PURE__ */ _("div", {
56
86
  className: "max-w-4xl mx-auto p-6",
57
87
  children: [
58
- /* @__PURE__ */ m("div", {
88
+ /* @__PURE__ */ _("div", {
59
89
  className: "mb-8",
60
- children: [/* @__PURE__ */ p("h1", {
90
+ children: [/* @__PURE__ */ g("h1", {
61
91
  className: "text-3xl font-semibold text-[var(--color-text-primary)]",
62
- children: g("auth.profile.myProfile", "My Profile")
63
- }), /* @__PURE__ */ p("p", {
92
+ children: y("auth.profile.myProfile", "My Profile")
93
+ }), /* @__PURE__ */ g("p", {
64
94
  className: "text-[var(--color-text-secondary)] mt-2",
65
- children: g("auth.profile.viewAndManage", "View and manage your account information")
95
+ children: y("auth.profile.viewAndManage", "View and manage your account information")
66
96
  })]
67
97
  }),
68
- O && /* @__PURE__ */ m("div", {
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__ */ p(i, { className: "w-5 h-5 text-[var(--color-status-success-text)] flex-shrink-0" }),
72
- /* @__PURE__ */ p("p", {
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: O
104
+ children: L
75
105
  }),
76
- /* @__PURE__ */ p("button", {
77
- onClick: () => k(null),
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: g("auth.profile.dismiss", "Dismiss")
109
+ children: y("auth.profile.dismiss", "Dismiss")
80
110
  })
81
111
  ]
82
112
  }),
83
- E && /* @__PURE__ */ m("div", {
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__ */ p(r, { className: "w-5 h-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }),
87
- /* @__PURE__ */ p("div", {
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__ */ p("p", {
119
+ children: /* @__PURE__ */ g("p", {
90
120
  className: "text-sm text-[var(--color-status-error-text)]",
91
- children: E
121
+ children: F
92
122
  })
93
123
  }),
94
- /* @__PURE__ */ p("button", {
95
- onClick: () => D(null),
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: g("auth.profile.dismiss", "Dismiss")
127
+ children: y("auth.profile.dismiss", "Dismiss")
98
128
  })
99
129
  ]
100
130
  }),
101
- /* @__PURE__ */ m("div", {
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__ */ p("div", {
133
+ children: [/* @__PURE__ */ g("div", {
104
134
  className: "auth-hero-card p-6",
105
- children: /* @__PURE__ */ m("div", {
135
+ children: /* @__PURE__ */ _("div", {
106
136
  className: "flex items-center gap-4",
107
- children: [/* @__PURE__ */ p("div", {
108
- 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",
109
- children: (y.name || y.username || y.email).charAt(0).toUpperCase()
110
- }), /* @__PURE__ */ m("div", {
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__ */ p("h2", {
184
+ /* @__PURE__ */ g("h2", {
114
185
  className: "text-2xl font-semibold",
115
- children: y.name || `${y.firstName || ""} ${y.lastName || ""}`.trim() || y.username
186
+ children: S.name || `${S.firstName || ""} ${S.lastName || ""}`.trim() || S.username
116
187
  }),
117
- /* @__PURE__ */ m("p", {
188
+ /* @__PURE__ */ _("p", {
118
189
  className: "text-blue-100 flex items-center gap-2",
119
- children: [/* @__PURE__ */ p(a, { className: "w-4 h-4" }), y.email]
190
+ children: [/* @__PURE__ */ g(a, { className: "w-4 h-4" }), S.email]
120
191
  }),
121
- /* @__PURE__ */ m("div", {
192
+ /* @__PURE__ */ _("div", {
122
193
  className: "flex items-center gap-2 mt-2",
123
- children: [/* @__PURE__ */ p("span", {
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: y.role?.replace("_", " ") || g("auth.profile.member", "Member")
126
- }), y.emailVerified && /* @__PURE__ */ m("span", {
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__ */ p(i, { className: "w-3 h-3" }), g("auth.profile.verified", "Verified")]
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__ */ p("div", {
205
+ }), /* @__PURE__ */ g("div", {
135
206
  className: "p-6",
136
- children: S ? /* @__PURE__ */ m("form", {
207
+ children: j ? /* @__PURE__ */ _("form", {
137
208
  onSubmit: async (e) => {
138
- e.preventDefault(), D(null), k(null);
209
+ e.preventDefault(), I(null), R(null);
139
210
  try {
140
- await b({
141
- username: w.username || void 0,
142
- firstName: w.firstName || void 0,
143
- lastName: w.lastName || void 0,
144
- name: w.name || void 0,
145
- phoneNumber: w.phoneNumber || void 0
146
- }), k(g("auth.profile.updateSuccess", "Profile updated successfully!")), C(!1);
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
- D(e instanceof Error ? e.message : g("auth.profile.updateFailed", "Failed to update profile"));
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__ */ m("div", {
223
+ children: [/* @__PURE__ */ _("div", {
153
224
  className: "grid grid-cols-1 md:grid-cols-2 gap-6",
154
225
  children: [
155
- /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
226
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
156
227
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
157
- children: g("auth.profile.username", "Username")
158
- }), /* @__PURE__ */ m("div", {
228
+ children: y("auth.profile.username", "Username")
229
+ }), /* @__PURE__ */ _("div", {
159
230
  className: "relative",
160
- children: [/* @__PURE__ */ p("div", {
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__ */ p(s, { className: "w-5 h-5 text-[var(--color-text-tertiary)]" })
163
- }), /* @__PURE__ */ p("input", {
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: w.username,
166
- onChange: (e) => T({
167
- ...w,
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: g("auth.profile.usernamePlaceholder", "Enter username")
242
+ placeholder: y("auth.profile.usernamePlaceholder", "Enter username")
172
243
  })]
173
244
  })] }),
174
- /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
245
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
175
246
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
176
- children: g("auth.profile.displayName", "Display Name")
177
- }), /* @__PURE__ */ p("input", {
247
+ children: y("auth.profile.displayName", "Display Name")
248
+ }), /* @__PURE__ */ g("input", {
178
249
  type: "text",
179
- value: w.name,
180
- onChange: (e) => T({
181
- ...w,
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: g("auth.profile.displayNamePlaceholder", "Enter display name")
256
+ placeholder: y("auth.profile.displayNamePlaceholder", "Enter display name")
186
257
  })] }),
187
- /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
258
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
188
259
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
189
- children: g("auth.profile.firstName", "First Name")
190
- }), /* @__PURE__ */ p("input", {
260
+ children: y("auth.profile.firstName", "First Name")
261
+ }), /* @__PURE__ */ g("input", {
191
262
  type: "text",
192
- value: w.firstName,
193
- onChange: (e) => T({
194
- ...w,
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: g("auth.profile.firstNamePlaceholder", "Enter first name")
269
+ placeholder: y("auth.profile.firstNamePlaceholder", "Enter first name")
199
270
  })] }),
200
- /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
271
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("label", {
201
272
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
202
- children: g("auth.profile.lastName", "Last Name")
203
- }), /* @__PURE__ */ p("input", {
273
+ children: y("auth.profile.lastName", "Last Name")
274
+ }), /* @__PURE__ */ g("input", {
204
275
  type: "text",
205
- value: w.lastName,
206
- onChange: (e) => T({
207
- ...w,
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: g("auth.profile.lastNamePlaceholder", "Enter last name")
282
+ placeholder: y("auth.profile.lastNamePlaceholder", "Enter last name")
212
283
  })] }),
213
- /* @__PURE__ */ m("div", {
284
+ /* @__PURE__ */ _("div", {
214
285
  className: "md:col-span-2",
215
- children: [/* @__PURE__ */ p("label", {
286
+ children: [/* @__PURE__ */ g("label", {
216
287
  className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
217
- children: g("auth.profile.phoneNumber", "Phone Number")
218
- }), /* @__PURE__ */ p("input", {
288
+ children: y("auth.profile.phoneNumber", "Phone Number")
289
+ }), /* @__PURE__ */ g("input", {
219
290
  type: "tel",
220
- value: w.phoneNumber,
221
- onChange: (e) => T({
222
- ...w,
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: g("auth.profile.phonePlaceholder", "Enter phone number")
297
+ placeholder: y("auth.profile.phonePlaceholder", "Enter phone number")
227
298
  })]
228
299
  })
229
300
  ]
230
- }), /* @__PURE__ */ m("div", {
301
+ }), /* @__PURE__ */ _("div", {
231
302
  className: "flex gap-3 pt-4 border-t border-[var(--color-border-default)]",
232
- children: [/* @__PURE__ */ p("button", {
303
+ children: [/* @__PURE__ */ g("button", {
233
304
  type: "submit",
234
- disabled: x,
305
+ disabled: w,
235
306
  className: "auth-primary-button flex items-center gap-2 px-6 py-3 font-medium",
236
- children: x ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(o, { className: "w-4 h-4 animate-spin" }), g("auth.profile.saving", "Saving...")] }) : g("auth.profile.saveChanges", "Save Changes")
237
- }), /* @__PURE__ */ p("button", {
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
- y && T({
241
- username: y.username || "",
242
- firstName: y.firstName || "",
243
- lastName: y.lastName || "",
244
- name: y.name || "",
245
- phoneNumber: y.phoneNumber || ""
246
- }), C(!1), D(null);
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: g("auth.profile.cancel", "Cancel")
320
+ children: y("auth.profile.cancel", "Cancel")
250
321
  })]
251
322
  })]
252
- }) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ m("div", {
323
+ }) : /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ _("div", {
253
324
  className: "grid grid-cols-1 md:grid-cols-2 gap-6",
254
325
  children: [
255
- /* @__PURE__ */ m("div", {
326
+ /* @__PURE__ */ _("div", {
256
327
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
257
- children: [/* @__PURE__ */ p("label", {
328
+ children: [/* @__PURE__ */ g("label", {
258
329
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
259
- children: g("auth.profile.username", "Username")
260
- }), /* @__PURE__ */ p("p", {
330
+ children: y("auth.profile.username", "Username")
331
+ }), /* @__PURE__ */ g("p", {
261
332
  className: "text-[var(--color-text-primary)] font-medium",
262
- children: y.username || "-"
333
+ children: S.username || "-"
263
334
  })]
264
335
  }),
265
- /* @__PURE__ */ m("div", {
336
+ /* @__PURE__ */ _("div", {
266
337
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
267
- children: [/* @__PURE__ */ p("label", {
338
+ children: [/* @__PURE__ */ g("label", {
268
339
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
269
- children: g("auth.profile.displayName", "Display Name")
270
- }), /* @__PURE__ */ p("p", {
340
+ children: y("auth.profile.displayName", "Display Name")
341
+ }), /* @__PURE__ */ g("p", {
271
342
  className: "text-[var(--color-text-primary)] font-medium",
272
- children: y.name || "-"
343
+ children: S.name || "-"
273
344
  })]
274
345
  }),
275
- /* @__PURE__ */ m("div", {
346
+ /* @__PURE__ */ _("div", {
276
347
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
277
- children: [/* @__PURE__ */ p("label", {
348
+ children: [/* @__PURE__ */ g("label", {
278
349
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
279
- children: g("auth.profile.firstName", "First Name")
280
- }), /* @__PURE__ */ p("p", {
350
+ children: y("auth.profile.firstName", "First Name")
351
+ }), /* @__PURE__ */ g("p", {
281
352
  className: "text-[var(--color-text-primary)] font-medium",
282
- children: y.firstName || "-"
353
+ children: S.firstName || "-"
283
354
  })]
284
355
  }),
285
- /* @__PURE__ */ m("div", {
356
+ /* @__PURE__ */ _("div", {
286
357
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
287
- children: [/* @__PURE__ */ p("label", {
358
+ children: [/* @__PURE__ */ g("label", {
288
359
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
289
- children: g("auth.profile.lastName", "Last Name")
290
- }), /* @__PURE__ */ p("p", {
360
+ children: y("auth.profile.lastName", "Last Name")
361
+ }), /* @__PURE__ */ g("p", {
291
362
  className: "text-[var(--color-text-primary)] font-medium",
292
- children: y.lastName || "-"
363
+ children: S.lastName || "-"
293
364
  })]
294
365
  }),
295
- /* @__PURE__ */ m("div", {
366
+ /* @__PURE__ */ _("div", {
296
367
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
297
- children: [/* @__PURE__ */ p("label", {
368
+ children: [/* @__PURE__ */ g("label", {
298
369
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
299
- children: g("auth.profile.email", "Email")
300
- }), /* @__PURE__ */ m("p", {
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: [y.email, y.emailVerified && /* @__PURE__ */ m("span", {
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__ */ p(i, { className: "w-3 h-3" }), g("auth.profile.verified", "Verified")]
375
+ children: [/* @__PURE__ */ g(i, { className: "w-3 h-3" }), y("auth.profile.verified", "Verified")]
305
376
  })]
306
377
  })]
307
378
  }),
308
- /* @__PURE__ */ m("div", {
379
+ /* @__PURE__ */ _("div", {
309
380
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
310
- children: [/* @__PURE__ */ p("label", {
381
+ children: [/* @__PURE__ */ g("label", {
311
382
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
312
- children: g("auth.profile.phoneNumber", "Phone Number")
313
- }), /* @__PURE__ */ p("p", {
383
+ children: y("auth.profile.phoneNumber", "Phone Number")
384
+ }), /* @__PURE__ */ g("p", {
314
385
  className: "text-[var(--color-text-primary)] font-medium",
315
- children: y.phoneNumber || "-"
386
+ children: S.phoneNumber || "-"
316
387
  })]
317
388
  }),
318
- /* @__PURE__ */ m("div", {
389
+ /* @__PURE__ */ _("div", {
319
390
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
320
- children: [/* @__PURE__ */ p("label", {
391
+ children: [/* @__PURE__ */ g("label", {
321
392
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
322
- children: g("auth.profile.role", "Role")
323
- }), /* @__PURE__ */ p("p", {
393
+ children: y("auth.profile.role", "Role")
394
+ }), /* @__PURE__ */ g("p", {
324
395
  className: "text-[var(--color-text-primary)] font-medium",
325
- children: y.role?.replace("_", " ") || g("auth.profile.member", "Member")
396
+ children: S.role?.replace("_", " ") || y("auth.profile.member", "Member")
326
397
  })]
327
398
  }),
328
- /* @__PURE__ */ m("div", {
399
+ /* @__PURE__ */ _("div", {
329
400
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
330
- children: [/* @__PURE__ */ p("label", {
401
+ children: [/* @__PURE__ */ g("label", {
331
402
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
332
- children: g("auth.profile.mfaStatus", "MFA Status")
333
- }), /* @__PURE__ */ p("p", {
403
+ children: y("auth.profile.mfaStatus", "MFA Status")
404
+ }), /* @__PURE__ */ g("p", {
334
405
  className: "text-[var(--color-text-primary)] font-medium",
335
- children: y.mfaEnabled ? /* @__PURE__ */ m("span", {
406
+ children: S.mfaEnabled ? /* @__PURE__ */ _("span", {
336
407
  className: "text-[var(--color-status-success-text)] flex items-center gap-1",
337
- children: [/* @__PURE__ */ p(i, { className: "w-4 h-4" }), g("auth.profile.enabled", "Enabled")]
338
- }) : /* @__PURE__ */ p("span", {
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: g("auth.profile.notEnabled", "Not Enabled")
411
+ children: y("auth.profile.notEnabled", "Not Enabled")
341
412
  })
342
413
  })]
343
414
  }),
344
- /* @__PURE__ */ m("div", {
415
+ /* @__PURE__ */ _("div", {
345
416
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
346
- children: [/* @__PURE__ */ p("label", {
417
+ children: [/* @__PURE__ */ g("label", {
347
418
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
348
- children: g("auth.profile.lastLogin", "Last Login")
349
- }), /* @__PURE__ */ p("p", {
419
+ children: y("auth.profile.lastLogin", "Last Login")
420
+ }), /* @__PURE__ */ g("p", {
350
421
  className: "text-[var(--color-text-primary)] font-medium",
351
- children: y.lastLoginAt ? new Date(y.lastLoginAt).toLocaleString() : g("auth.profile.never", "Never")
422
+ children: S.lastLoginAt ? new Date(S.lastLoginAt).toLocaleString() : y("auth.profile.never", "Never")
352
423
  })]
353
424
  }),
354
- /* @__PURE__ */ m("div", {
425
+ /* @__PURE__ */ _("div", {
355
426
  className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
356
- children: [/* @__PURE__ */ p("label", {
427
+ children: [/* @__PURE__ */ g("label", {
357
428
  className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
358
- children: g("auth.profile.accountCreated", "Account Created")
359
- }), /* @__PURE__ */ p("p", {
429
+ children: y("auth.profile.accountCreated", "Account Created")
430
+ }), /* @__PURE__ */ g("p", {
360
431
  className: "text-[var(--color-text-primary)] font-medium",
361
- children: y.createdAt ? new Date(y.createdAt).toLocaleString() : "-"
432
+ children: S.createdAt ? new Date(S.createdAt).toLocaleString() : "-"
362
433
  })]
363
434
  })
364
435
  ]
365
- }), /* @__PURE__ */ m("div", {
436
+ }), /* @__PURE__ */ _("div", {
366
437
  className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
367
- children: [/* @__PURE__ */ p("button", {
368
- onClick: () => C(!0),
438
+ children: [/* @__PURE__ */ g("button", {
439
+ onClick: () => M(!0),
369
440
  className: "auth-primary-button px-6 py-3 font-medium",
370
- children: g("auth.profile.editProfile", "Edit Profile")
371
- }), /* @__PURE__ */ p("button", {
372
- onClick: () => _("/auth/security"),
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: g("auth.profile.securitySettings", "Security Settings")
445
+ children: y("auth.profile.securitySettings", "Security Settings")
375
446
  })]
376
447
  })] })
377
448
  })]
378
449
  }),
379
- /* @__PURE__ */ m("div", {
450
+ /* @__PURE__ */ _("div", {
380
451
  className: "mt-8 grid grid-cols-1 md:grid-cols-3 gap-4",
381
- children: [/* @__PURE__ */ m("button", {
382
- onClick: () => _("/auth/mfa"),
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__ */ p("div", {
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__ */ p("svg", {
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__ */ p("path", {
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__ */ p("h3", {
471
+ /* @__PURE__ */ g("h3", {
401
472
  className: "font-medium text-[var(--color-text-primary)]",
402
- children: g("auth.profile.twoFactorAuth", "Two-Factor Auth")
473
+ children: y("auth.profile.twoFactorAuth", "Two-Factor Auth")
403
474
  }),
404
- /* @__PURE__ */ p("p", {
475
+ /* @__PURE__ */ g("p", {
405
476
  className: "text-sm text-[var(--color-text-tertiary)] mt-1",
406
- children: y.mfaEnabled ? g("auth.profile.manageMfa", "Manage MFA settings") : g("auth.profile.enableMfa", "Enable MFA for extra security")
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__ */ m("button", {
410
- onClick: () => _("/auth/api-keys"),
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__ */ p("div", {
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__ */ p("svg", {
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__ */ p("path", {
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__ */ p("h3", {
499
+ /* @__PURE__ */ g("h3", {
429
500
  className: "font-medium text-[var(--color-text-primary)]",
430
- children: g("auth.profile.apiKeys", "API Keys")
501
+ children: y("auth.profile.apiKeys", "API Keys")
431
502
  }),
432
- /* @__PURE__ */ p("p", {
503
+ /* @__PURE__ */ g("p", {
433
504
  className: "text-sm text-[var(--color-text-tertiary)] mt-1",
434
- children: g("auth.profile.manageApiKeys", "Manage your API access credentials")
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 { h as UserProfilePage };
514
+ export { v as UserProfilePage };
444
515
 
445
516
  //# sourceMappingURL=UserProfilePage.js.map