diff --git a/Client-Registration/src/auth/AuthProvider.jsx b/Client-Registration/src/auth/AuthProvider.jsx index ca7c2df..5fafacc 100644 --- a/Client-Registration/src/auth/AuthProvider.jsx +++ b/Client-Registration/src/auth/AuthProvider.jsx @@ -41,12 +41,17 @@ export function useAuth() { // ── Map ID token claims → user object ───────────────────────────────────── function claimsToUser(claims, provider) { + const firstName = claims.given_name ?? null; + const surname = claims.family_name ?? null; + const displayName = claims.name + ?? [firstName, surname].filter(Boolean).join(' ') + ?? null; return { entraSubjectId: claims.oid ?? claims.sub ?? null, email: claims.email ?? claims.preferred_username ?? null, - displayName: claims.name ?? null, - firstName: claims.given_name ?? null, - surname: claims.family_name ?? null, + displayName, + firstName, + surname, provider: provider ?? 'unknown', }; } diff --git a/Client-Registration/src/components/steps/ContactStep.jsx b/Client-Registration/src/components/steps/ContactStep.jsx index 46a4e8f..b78494b 100644 --- a/Client-Registration/src/components/steps/ContactStep.jsx +++ b/Client-Registration/src/components/steps/ContactStep.jsx @@ -6,12 +6,13 @@ export default function ContactStep() { const { user } = useAuth(); const { contactData, setContactData, saveContact, goBack, loading, error } = useRegistration(); - // Pre-fill from auth claims on mount + // Pre-fill from CIAM claims on mount useEffect(() => { if (user) { setContactData(prev => ({ - contactName: prev.contactName || user.displayName || '', - contactEmail: prev.contactEmail || user.email || '', + firstName: prev.firstName || user.firstName || '', + lastName: prev.lastName || user.surname || '', + contactEmail: prev.contactEmail || user.email || '', contactPhone: prev.contactPhone || '', })); } @@ -39,7 +40,9 @@ export default function ContactStep() { {user && (
-
{user.displayName}
+
+ {[user.firstName, user.surname].filter(Boolean).join(' ') || user.displayName || user.email} +
{user.email}
)} @@ -47,17 +50,32 @@ export default function ContactStep() { {error &&
{error}
}
-
- - +
+
+ + +
+ +
+ + +
@@ -66,7 +84,7 @@ export default function ContactStep() { type="email" id="contactEmail" name="contactEmail" - value={contactData.contactEmail} + value={contactData.contactEmail || ''} onChange={handleChange} placeholder="jane@example.com" required @@ -79,7 +97,7 @@ export default function ContactStep() { type="tel" id="contactPhone" name="contactPhone" - value={contactData.contactPhone} + value={contactData.contactPhone || ''} onChange={handleChange} placeholder="(555) 123-4567" /> diff --git a/Client-Registration/src/context/RegistrationContext.jsx b/Client-Registration/src/context/RegistrationContext.jsx index aa63774..68a2edc 100644 --- a/Client-Registration/src/context/RegistrationContext.jsx +++ b/Client-Registration/src/context/RegistrationContext.jsx @@ -53,7 +53,8 @@ export function RegistrationProvider({ children }) { // Form data — maps to RegisterRequest model fields (minus entraSubjectId) const [contactData, setContactData] = useState({ - contactName: '', + firstName: '', + lastName: '', contactEmail: '', contactPhone: '', }); @@ -83,8 +84,9 @@ export function RegistrationProvider({ children }) { // ─── Validation ───────────────────────────────────────────────────── const validateContact = useCallback(() => { - if (!contactData.contactName.trim()) return 'Contact name is required'; - if (!contactData.contactEmail.trim()) return 'Email is required'; + if (!contactData.firstName?.trim()) return 'First name is required'; + if (!contactData.lastName?.trim()) return 'Last name is required'; + if (!contactData.contactEmail?.trim()) return 'Email is required'; return null; }, [contactData]); @@ -132,6 +134,8 @@ export function RegistrationProvider({ children }) { const request = { ...contactData, ...businessData, + // Combine for server-side contactName field + contactName: [contactData.firstName, contactData.lastName].filter(Boolean).join(' '), }; // Pre-fill email from auth if the user left it blank diff --git a/Client-Registration/src/styles/app.css b/Client-Registration/src/styles/app.css index 92f4d0c..1ccc5d8 100644 --- a/Client-Registration/src/styles/app.css +++ b/Client-Registration/src/styles/app.css @@ -326,6 +326,16 @@ body { Forms ============================================================ */ +.form-row { + display: flex; + gap: 12px; +} + +.form-row .form-group { + flex: 1; + margin-bottom: 0; +} + .form-group { margin-bottom: 16px; }