Modal header additions. Close and back button.

pull/1665/head
Warrick Corfe-Tan 4 years ago
parent 7285866e5e
commit 72d31bf158

@ -134,6 +134,11 @@ export class EditProfileDialog extends React.Component<Props, State> {
<div className="edit-profile-dialog"> <div className="edit-profile-dialog">
<SessionWrapperModal <SessionWrapperModal
title={i18n('editProfileModalTitle')}
onClose={this.closeDialog}
headerIconButtons={backButton}
showExitIcon={true}
theme={this.props.theme}
> >
<div className="spacer-md" /> <div className="spacer-md" />
@ -219,12 +224,13 @@ export class EditProfileDialog extends React.Component<Props, State> {
} }
private renderDefaultView() { private renderDefaultView() {
const name = this.state.setProfileName ? this.state.setProfileName : this.state.profileName;
return ( return (
<> <>
{this.renderProfileHeader()} {this.renderProfileHeader()}
<div className="profile-name-uneditable"> <div className="profile-name-uneditable">
<p>{this.state.setProfileName}</p> <p>{name}</p>
<SessionIconButton <SessionIconButton
iconType={SessionIconType.Pencil} iconType={SessionIconType.Pencil}
iconSize={SessionIconSize.Medium} iconSize={SessionIconSize.Medium}

@ -135,6 +135,7 @@ export const OnionPathModal = (props: OnionPathModalType) => {
cancelText={props.cancelText || window.i18n('cancel')} cancelText={props.cancelText || window.i18n('cancel')}
onConfirm={onConfirm} onConfirm={onConfirm}
onClose={props.onClose} onClose={props.onClose}
showExitIcon={true}
> >
<OnionPathModalInner {...props}></OnionPathModalInner> <OnionPathModalInner {...props}></OnionPathModalInner>
</SessionWrapperModal> </SessionWrapperModal>

@ -39,6 +39,7 @@ export type SessionWrapperModalType = {
theme?: any; theme?: any;
headerIconButtons?: any[]; headerIconButtons?: any[];
children: any; children: any;
headerReverse?: boolean;
}; };
export const SessionWrapperModal = (props: SessionWrapperModalType) => { export const SessionWrapperModal = (props: SessionWrapperModalType) => {
@ -52,6 +53,7 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
showExitIcon, showExitIcon,
theme, theme,
headerIconButtons, headerIconButtons,
headerReverse
} = props; } = props;
useEffect(() => { useEffect(() => {
@ -75,7 +77,7 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
<div className="loki-dialog session-confirm-wrapper modal"> <div className="loki-dialog session-confirm-wrapper modal">
<div className="session-confirm-wrapper"> <div className="session-confirm-wrapper">
<div className="session-modal"> <div className="session-modal">
<div className="session-modal__header"> <div className={classNames('session-modal__header', headerReverse && 'reverse')}>
<div className="session-modal__header__close"> <div className="session-modal__header__close">
{showExitIcon ? ( {showExitIcon ? (
<SessionIconButton <SessionIconButton

Loading…
Cancel
Save