import React , { useState , useEffect , useMemo } from 'react' ; import { useValues } from 'kea' ; import type { AuthenticatedUser } from '../../../../../../security/public' ; import { KibanaLogic } from '../../../shared/kibana/kibana_logic' ; import { PersonalDashboardLayout } from '../../components/layout' ; import { ACCOUNT_SETTINGS_TITLE } from '../../constants' ; export const AccountSettings = ( ) => { const { security } = useValues ( KibanaLogic ) ; const [ currentUser , setCurrentUser ] = useState < AuthenticatedUser | null > ( null ) ; useEffect ( ( ) => { security . authc . getCurrentUser ( ) . then ( setCurrentUser ) . catch ( ( ) => { setCurrentUser ( null ) ; } ) ; } , [ security . authc ] ) ; const PersonalInfo = useMemo ( ( ) => security . uiApi . components . getPersonalInfo , [ security . uiApi ] ) ; const ChangePassword = useMemo ( ( ) => security . uiApi . components . getChangePassword , [ security . uiApi ] ) ; if ( ! currentUser ) { return null ; } return ( < PersonalDashboardLayout pageChrome = { [ ACCOUNT_SETTINGS_TITLE ] } > < PersonalInfo user = { currentUser } /> < ChangePassword user = { currentUser } / > < /PersonalDashboardLayout>); } ;