Skip to content
Permalink
Browse files

[DEVOPS-1195] z-index issue

  • Loading branch information...
daniloprates committed Mar 13, 2019
1 parent b0281c8 commit 08d1116cc527d6405755b779e87a73663a1b968b
@@ -5,17 +5,16 @@ import { intlShape } from 'react-intl';
import Action from '../../actions/lib/Action';
import NotificationMessage from '../widgets/NotificationMessage';
import successIcon from '../../assets/images/success-small.inline.svg';
import type { Props as NotificationMessagePreps } from '../widgets/NotificationMessage';

type Props = {
...$Exact<NotificationMessagePreps>,
id: string,
message: string,
icon?: string,
duration: number,
show: boolean,
actionToListen?: Action<any>,
openNotification: Action<any>,
closeNotification: Action<any>,
icon?: string,
hasCloseButton?: boolean
};

@observer
@@ -27,24 +26,21 @@ export default class GenericNotification extends Component<Props> {

static defaultProps = {
hasCloseButton: true,
icon: successIcon,
};

constructor(props: Props) {
super(props);
const { actionToListen } = this.props;
if (actionToListen) this.registerNotificationListener(actionToListen);
if (actionToListen && actionToListen.listen) actionToListen.listen(this.openNotification);
}

componentWillUnmount() {
const { actionToListen } = this.props;
if (actionToListen) actionToListen.remove(this.openNotification);
if (actionToListen && actionToListen.remove) actionToListen.remove(this.openNotification);
this.closeNotification();
}

registerNotificationListener = (actionToListen: Action<any>) => {
actionToListen.listen(this.openNotification);
};

openNotification = () => {
const { openNotification, id, duration } = this.props;
openNotification.trigger({ id, duration });
@@ -56,17 +52,18 @@ export default class GenericNotification extends Component<Props> {
}

render() {
const { message, show, icon, hasCloseButton } = this.props;
const { children, show, icon, hasCloseButton, clickToClose, order } = this.props;

return (
<NotificationMessage
icon={icon || successIcon}
icon={icon}
show={show}
onClose={this.closeNotification}
hasCloseButton={hasCloseButton}
clickToClose
clickToClose={clickToClose}
order={order}
>
{message}
{children}
</NotificationMessage>
);
}
@@ -6,21 +6,26 @@ import classNames from 'classnames';
import styles from './NotificationMessage.scss';
import closeCross from '../../assets/images/close-cross.inline.svg';

type Props = {
export type Props = {
icon: string,
show: boolean,
children?: Node,
clickToClose?: boolean,
hasCloseButton?: boolean,
onClose?: Function,
order?: 'auto' | number | 'initial' | 'inherit'
};

export default class NotificationMessage extends Component<Props> {

static defaultProps = {
order: 'auto',
};

render() {
const {
icon, show, children, clickToClose,
hasCloseButton, onClose,
hasCloseButton, onClose, order
} = this.props;

const notificationMessageStyles = classNames([
@@ -35,6 +40,9 @@ export default class NotificationMessage extends Component<Props> {
onClick={() => clickToClose && onClose && onClose()}
role="link"
aria-hidden
style={{
zIndex: order,
}}
>

{icon && <SVGInline svg={icon} className={styles.icon} />}
@@ -83,6 +83,7 @@ export default class WalletImporterPage extends Component<Props> {

return (
<Layout>

{isRestoreActive && restoringWallet ? (
<RestoreNotification
currentLocale={currentLocale}
@@ -93,13 +94,16 @@ export default class WalletImporterPage extends Component<Props> {

<GenericNotification
id={WALLET_IMPORTER_PASSWORD_MATCHING_IS_DONE_ID}
message={intl.formatMessage(messages.passwordMatchingIsDone)}
duration={WALLET_IMPORTER_PASSWORD_MATCHING_IS_DONE}
show={uiNotifications.isOpen(WALLET_IMPORTER_PASSWORD_MATCHING_IS_DONE_ID)}
actionToListen={walletImporterActions.matchPasswordsEnd}
openNotification={notifications.open}
closeNotification={notifications.closeActiveNotification}
/>
order={10}
>
{ intl.formatMessage(messages.passwordMatchingIsDone) }
</GenericNotification>


<WalletImporter
keyFile={keyFile}

0 comments on commit 08d1116

Please sign in to comment.
You can’t perform that action at this time.