Add info icon, notifications wip

This commit is contained in:
mmv 2019-11-11 17:43:13 +04:00
parent 9d0549fc59
commit c2e70136ba
4 changed files with 41 additions and 33 deletions

View File

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<g fill="none" fill-rule="evenodd">
<rect width="2" height="8" x="9" y="8" fill="#B2B5B2" rx="1"/>
<rect width="2" height="2" x="9" y="4" fill="#B2B5B2" stroke="#B2B5B2" stroke-width=".5" rx="1"/>
<circle cx="10" cy="10" r="9" stroke="#B2B5B2" stroke-width="2"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 391 B

View File

@ -6,9 +6,10 @@ import SidebarProvider from '~/components/Sidebar'
import Header from '~/components/Header'
import Img from '~/components/layout/Img'
import Notifier from '~/components/Notifier'
import AlertLogo from './assets/alert.svg'
import CheckLogo from './assets/check.svg'
import ErrorLogo from './assets/error.svg'
import AlertIcon from './assets/alert.svg'
import CheckIcon from './assets/check.svg'
import ErrorIcon from './assets/error.svg'
import InfoIcon from './assets/info.svg'
import styles from './index.scss'
const notificationStyles = {
@ -67,10 +68,10 @@ const PageFrame = ({ children, classes }: Props) => (
variantInfo: classes.info,
}}
iconVariant={{
success: <Img src={CheckLogo} alt="Success" />,
error: <Img src={ErrorLogo} alt="Error" />,
warning: <Img src={AlertLogo} alt="Warning" />,
info: '',
success: <Img src={CheckIcon} alt="Success" />,
error: <Img src={ErrorIcon} alt="Error" />,
warning: <Img src={AlertIcon} alt="Warning" />,
info: <Img src={InfoIcon} alt="Info" />,
}}
>
<Notifier />

View File

@ -9,23 +9,23 @@ import { type Notification, NOTIFICATIONS } from './notificationTypes'
export type NotificationsQueue = {
beforeExecution: Notification,
pendingExecution: {
pendingExecution: Notification,
afterExecution: {
noMoreConfirmationsNeeded: Notification,
moreConfirmationsNeeded: Notification,
},
afterExecution: Notification,
afterExecutionError: Notification,
afterRejection: Notification,
}
const standardTxNotificationsQueue: NotificationsQueue = {
beforeExecution: NOTIFICATIONS.SIGN_TX_MSG,
pendingExecution: {
noMoreConfirmationsNeeded: NOTIFICATIONS.TX_PENDING_MSG,
moreConfirmationsNeeded: NOTIFICATIONS.TX_PENDING_MORE_CONFIRMATIONS_MSG,
},
pendingExecution: NOTIFICATIONS.TX_PENDING_MSG,
afterRejection: NOTIFICATIONS.TX_REJECTED_MSG,
afterExecution: NOTIFICATIONS.TX_EXECUTED_MSG,
afterExecution: {
noMoreConfirmationsNeeded: NOTIFICATIONS.TX_EXECUTED_MSG,
moreConfirmationsNeeded: NOTIFICATIONS.TX_EXECUTED_MORE_CONFIRMATIONS_MSG,
},
afterExecutionError: NOTIFICATIONS.TX_FAILED_MSG,
}

View File

@ -34,9 +34,9 @@ export type Notifications = {
// Regular/Custom Transactions
SIGN_TX_MSG: Notification,
TX_PENDING_MSG: Notification,
TX_PENDING_MORE_CONFIRMATIONS_MSG: Notification,
TX_REJECTED_MSG: Notification,
TX_EXECUTED_MSG: Notification,
TX_EXECUTED_MORE_CONFIRMATIONS_MSG: Notification,
TX_FAILED_MSG: Notification,
// Approval Transactions
@ -113,11 +113,7 @@ export const NOTIFICATIONS: Notifications = {
},
TX_PENDING_MSG: {
message: 'Transaction pending',
options: { variant: SUCCESS, persist: true },
},
TX_PENDING_MORE_CONFIRMATIONS_MSG: {
message: 'Transaction pending: More confirmations required to execute',
options: { variant: SUCCESS, persist: true },
options: { variant: INFO, persist: true },
},
TX_REJECTED_MSG: {
message: 'Transaction rejected',
@ -127,6 +123,10 @@ export const NOTIFICATIONS: Notifications = {
message: 'Transaction successfully executed',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
TX_EXECUTED_MORE_CONFIRMATIONS_MSG: {
message: 'Transaction successfully created. More confirmations needed to execute',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
TX_FAILED_MSG: {
message: 'Transaction failed',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
@ -158,28 +158,28 @@ export const NOTIFICATIONS: Notifications = {
options: { variant: SUCCESS, persist: false, autoHideDuration: shortDuration },
},
// Owners
SIGN_OWNER_CHANGE_MSG: {
message: 'Please sign the owner change',
// Settings
SETTINGS_CHANGE_MSG: {
message: 'Please sign settings change',
options: { variant: SUCCESS, persist: true },
},
OWNER_CHANGE_PENDING_MSG: {
message: 'Owner change pending',
options: { variant: SUCCESS, persist: true },
SETTINGS_CHANGE_PENDING_MSG: {
message: 'Settings change pending',
options: { variant: INFO, persist: true },
},
OWNER_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: {
SETTINGS_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: {
message: 'Owner change pending: More confirmations required to execute',
options: { variant: SUCCESS, persist: true },
options: { variant: INFO, persist: true },
},
OWNER_CHANGE_REJECTED_MSG: {
SETTINGS_CHANGE_REJECTED_MSG: {
message: 'Owner change rejected',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},
OWNER_CHANGE_EXECUTED_MSG: {
SETTINGS_CHANGE_EXECUTED_MSG: {
message: 'Owner change successfully executed',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
OWNER_CHANGE_FAILED_MSG: {
SETTINGS_CHANGE_FAILED_MSG: {
message: 'Owner change failed',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},
@ -191,11 +191,11 @@ export const NOTIFICATIONS: Notifications = {
},
THRESHOLD_CHANGE_PENDING_MSG: {
message: 'Required confirmations change pending',
options: { variant: SUCCESS, persist: true },
options: { variant: INFO, persist: true },
},
THRESHOLD_CHANGE_PENDING_MORE_CONFIRMATIONS_MSG: {
message: 'Required confirmations change pending: More confirmations required to execute',
options: { variant: SUCCESS, persist: true },
options: { variant: INFO, persist: true },
},
THRESHOLD_CHANGE_REJECTED_MSG: {
message: 'Required confirmations change rejected',