@adonis-agora/authkit-react/build/src/components/user_profile.js

Frontend ergonomics over AuthKit for AdonisJS + Inertia + React apps: a typed useAuth() hook, role-gating hooks and gating components.

import { jsx as _jsx } from "react/jsx-runtime";
import { createElement, useState } from 'react';
import { useAuthkitConfig } from '../config.js';
import { useProfile } from '../hooks/use_profile.js';
import { useAuth } from '../use_auth.js';
import { Avatar } from './avatar.js';
function UserProfileInner({ className }) {
    const { user, isAuthenticated } = useAuth();
    const { actions, loading, error } = useProfile();
    const [name, setName] = useState(user?.name ?? '');
    if (!isAuthenticated || !user)
        return null;
    const onSubmit = (e) => {
        e.preventDefault();
        void actions.update({ name });
    };
    return createElement('div', { className: ['authkit-card', 'authkit-profile', className].filter(Boolean).join(' ') }, createElement('div', { className: 'authkit-profile__header' }, createElement(Avatar, { user, size: 56 }), createElement('div', null, createElement('div', { className: 'authkit-profile__name' }, user.name ?? user.email), createElement('div', { className: 'authkit-profile__email' }, user.email))), createElement('form', { className: 'authkit-profile__form', onSubmit }, createElement('label', { className: 'authkit-label', htmlFor: 'authkit-profile-name' }, 'Nome'), createElement('input', {
        id: 'authkit-profile-name',
        className: 'authkit-input',
        value: name,
        onChange: (e) => setName(e.target.value),
    }), error
        ? createElement('p', { className: 'authkit-error', role: 'alert' }, error.message)
        : null, createElement('button', {
        type: 'submit',
        className: 'authkit-button authkit-button--primary',
        disabled: loading,
    }, loading ? 'Salvando…' : 'Salvar')));
}
export function UserProfile(props) {
    const { idp } = useAuthkitConfig();
    if (idp === 'external')
        return null;
    return _jsx(UserProfileInner, { ...props });
}