change notification prop type to variant

pull/543/head
slowbackspace 5 years ago
parent 01cf2992b6
commit 14fe1d82eb

@ -175,7 +175,7 @@ const begin = (device: TrezorDevice, networkName: string): AsyncAction => async
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Discovery error', title: 'Discovery error',
message: error.message, message: error.message,
cancelable: true, cancelable: true,
@ -263,7 +263,7 @@ const discoverAccount = (device: TrezorDevice, discoveryProcess: Discovery): Asy
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Account discovery error', title: 'Account discovery error',
message: error.message, message: error.message,
cancelable: true, cancelable: true,

@ -80,7 +80,7 @@ export const importAddress = (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'success', variant: 'success',
title: 'The account has been successfully imported', title: 'The account has been successfully imported',
cancelable: true, cancelable: true,
}, },
@ -132,7 +132,7 @@ export const importAddress = (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'success', variant: 'success',
title: 'The account has been successfully imported', title: 'The account has been successfully imported',
cancelable: true, cancelable: true,
}, },
@ -147,7 +147,7 @@ export const importAddress = (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Import account error', title: 'Import account error',
message: error.message, message: error.message,
cancelable: true, cancelable: true,

@ -9,7 +9,7 @@ export type NotificationAction =
| { | {
type: typeof NOTIFICATION.ADD, type: typeof NOTIFICATION.ADD,
payload: { payload: {
+type: string, +variant: string,
+title: React.Node | string, +title: React.Node | string,
+message?: ?(React.Node | string), +message?: ?(React.Node | string),
+cancelable: boolean, +cancelable: boolean,

@ -111,7 +111,7 @@ export const showAddress = (path: Array<number>): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Verifying address error', title: 'Verifying address error',
message: response.payload.error, message: response.payload.error,
cancelable: true, cancelable: true,

@ -139,6 +139,7 @@ const getAccountNotification = (
if (blockchain && !blockchain.connected) { if (blockchain && !blockchain.connected) {
return { return {
type: 'backend', type: 'backend',
variant: 'error',
title: `${network.name} backend is not connected`, title: `${network.name} backend is not connected`,
shouldRender: false, shouldRender: false,
}; };
@ -148,6 +149,7 @@ const getAccountNotification = (
if (account && discovery && !discovery.completed && !discovery.waitingForDevice) { if (account && discovery && !discovery.completed && !discovery.waitingForDevice) {
return { return {
type: 'info', type: 'info',
variant: 'info',
title: 'Loading other accounts...', title: 'Loading other accounts...',
shouldRender: true, shouldRender: true,
}; };
@ -157,6 +159,7 @@ const getAccountNotification = (
if (!device.connected) { if (!device.connected) {
return { return {
type: 'info', type: 'info',
variant: 'info',
title: `Device ${device.instanceLabel} is disconnected`, title: `Device ${device.instanceLabel} is disconnected`,
shouldRender: true, shouldRender: true,
}; };
@ -167,6 +170,7 @@ const getAccountNotification = (
if (!device.available) { if (!device.available) {
return { return {
type: 'info', type: 'info',
variant: 'info',
title: `Device ${device.instanceLabel} is unavailable`, title: `Device ${device.instanceLabel} is unavailable`,
message: 'Change passphrase settings to use this device', message: 'Change passphrase settings to use this device',
shouldRender: true, shouldRender: true,

@ -64,7 +64,7 @@ const sign = (path: Array<number>, message: string, hex: boolean = false): Async
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Sign error', title: 'Sign error',
message: response.payload.error, message: response.payload.error,
cancelable: true, cancelable: true,
@ -109,7 +109,7 @@ const verify = (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'success', variant: 'success',
title: 'Verify success', title: 'Verify success',
message: 'signature is valid', message: 'signature is valid',
cancelable: true, cancelable: true,
@ -119,7 +119,7 @@ const verify = (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Verify error', title: 'Verify error',
message: response.payload.error, message: response.payload.error,
cancelable: true, cancelable: true,

@ -263,7 +263,7 @@ export const authorizeDevice = (): AsyncAction => async (
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
devicePath: selected.path, devicePath: selected.path,
type: 'error', variant: 'error',
title: 'Authentication error', title: 'Authentication error',
message: response.payload.error, message: response.payload.error,
cancelable: false, cancelable: false,
@ -350,6 +350,7 @@ export function acquire(): AsyncAction {
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', type: 'error',
variant: 'error',
title: 'Acquire device error', title: 'Acquire device error',
message: response.payload.error, message: response.payload.error,
cancelable: true, cancelable: true,

@ -716,7 +716,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Transaction error', title: 'Transaction error',
message: signedTransaction.payload.error, message: signedTransaction.payload.error,
cancelable: true, cancelable: true,
@ -806,7 +806,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'success', variant: 'success',
title: 'Transaction success', title: 'Transaction success',
message: ( message: (
<Link href={`${network.explorer.tx}${txid}`} isGreen> <Link href={`${network.explorer.tx}${txid}`} isGreen>
@ -821,7 +821,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Transaction error', title: 'Transaction error',
message: error.message || error, message: error.message || error,
cancelable: true, cancelable: true,

@ -454,7 +454,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Transaction error', title: 'Transaction error',
message: signedTransaction.payload.error, message: signedTransaction.payload.error,
cancelable: true, cancelable: true,
@ -473,7 +473,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'error', variant: 'error',
title: 'Transaction error', title: 'Transaction error',
message: push.payload.error, message: push.payload.error,
cancelable: true, cancelable: true,
@ -496,7 +496,7 @@ export const onSend = (): AsyncAction => async (
dispatch({ dispatch({
type: NOTIFICATION.ADD, type: NOTIFICATION.ADD,
payload: { payload: {
type: 'success', variant: 'success',
title: 'Transaction success', title: 'Transaction success',
message: txid, message: txid,
cancelable: true, cancelable: true,

@ -13,7 +13,7 @@ export default (props: Props) => {
return ( return (
<Notification <Notification
key="no-backup" key="no-backup"
type="warning" variant="warning"
title={<FormattedMessage {...l10nCommonMessages.TR_YOUR_TREZOR_IS_NOT_BACKED_UP} />} title={<FormattedMessage {...l10nCommonMessages.TR_YOUR_TREZOR_IS_NOT_BACKED_UP} />}
message={<FormattedMessage {...l10nCommonMessages.TR_IF_YOUR_DEVICE_IS_EVER_LOST} />} message={<FormattedMessage {...l10nCommonMessages.TR_IF_YOUR_DEVICE_IS_EVER_LOST} />}
actions={[ actions={[

@ -11,7 +11,7 @@ export default (props: Props) => {
return ( return (
<Notification <Notification
key="wallet-offline" key="wallet-offline"
type="error" variant="error"
title={props.intl.formatMessage(l10nMessages.TR_YOU_WERE_DISCONNECTED_DOT)} title={props.intl.formatMessage(l10nMessages.TR_YOU_WERE_DISCONNECTED_DOT)}
message={props.intl.formatMessage(l10nMessages.TR_PLEASE_RELOAD_THE_PAGE_DOT)} message={props.intl.formatMessage(l10nMessages.TR_PLEASE_RELOAD_THE_PAGE_DOT)}
/> />

@ -11,7 +11,7 @@ export default (props: Props) => {
return ( return (
<Notification <Notification
key="update-bridge" key="update-bridge"
type="warning" variant="warning"
title={props.intl.formatMessage(l10nMessages.TR_NEW_TREZOR_BRIDGE_IS_AVAILABLE)} title={props.intl.formatMessage(l10nMessages.TR_NEW_TREZOR_BRIDGE_IS_AVAILABLE)}
message={props.intl.formatMessage( message={props.intl.formatMessage(
l10nCommonMessages.TR_UPGRADE_FOR_THE_NEWEST_FEATURES_DOT l10nCommonMessages.TR_UPGRADE_FOR_THE_NEWEST_FEATURES_DOT

@ -28,7 +28,7 @@ const UpdateFirmware = (props: {| ...Props, ...ContextRouter |}) => {
return ( return (
<Notification <Notification
key="update-firmware" key="update-firmware"
type="warning" variant="warning"
title={props.intl.formatMessage(l10nMessages.TR_NEW_TREZOR_FIRMWARE_IS_AVAILABLE_DOT)} title={props.intl.formatMessage(l10nMessages.TR_NEW_TREZOR_FIRMWARE_IS_AVAILABLE_DOT)}
message={props.intl.formatMessage( message={props.intl.formatMessage(
l10nCommonMessages.TR_UPGRADE_FOR_THE_NEWEST_FEATURES_DOT l10nCommonMessages.TR_UPGRADE_FOR_THE_NEWEST_FEATURES_DOT

@ -16,7 +16,7 @@ export default (props: Props) => {
// TODO: this is a different component with "auto resolve" button // TODO: this is a different component with "auto resolve" button
return ( return (
<Notification <Notification
type="error" variant="error"
title={notification.title} title={notification.title}
message={notification.message} message={notification.message}
isActionInProgress={blockchain && blockchain.connecting} isActionInProgress={blockchain && blockchain.connecting}
@ -33,7 +33,7 @@ export default (props: Props) => {
} }
return ( return (
<Notification <Notification
type={notification.type} variant={notification.variant}
title={notification.title} title={notification.title}
message={notification.message} message={notification.message}
/> />

@ -65,17 +65,17 @@ class Group extends PureComponent {
}; };
render() { render() {
const { type, groupNotifications, close } = this.props; const { variant, groupNotifications, close } = this.props;
const color = getPrimaryColor(type); const color = getPrimaryColor(variant);
return ( return (
<Wrapper> <Wrapper>
{groupNotifications.length > 1 && ( {groupNotifications.length > 1 && (
<Header onClick={this.toggle}> <Header onClick={this.toggle}>
<Left> <Left>
<StyledIcon color={color} size={16} icon={getIcon(type)} /> <StyledIcon color={color} size={16} icon={getIcon(variant)} />
<Title color={color}> <Title color={color}>
{groupNotifications.length}{' '} {groupNotifications.length}{' '}
{groupNotifications.length > 1 ? `${type}s` : type} {groupNotifications.length > 1 ? `${variant}s` : variant}
</Title> </Title>
</Left> </Left>
<Right> <Right>
@ -93,7 +93,7 @@ class Group extends PureComponent {
{groupNotifications.slice(0, this.state.visibleCount).map(notification => ( {groupNotifications.slice(0, this.state.visibleCount).map(notification => (
<StyledNotification <StyledNotification
key={notification.key} key={notification.key}
type={notification.type} variant={notification.variant}
title={notification.title} title={notification.title}
message={notification.message} message={notification.message}
cancelable={notification.cancelable} cancelable={notification.cancelable}
@ -108,7 +108,7 @@ class Group extends PureComponent {
} }
Group.propTypes = { Group.propTypes = {
type: PropTypes.string, variant: PropTypes.string,
close: PropTypes.func.isRequired, close: PropTypes.func.isRequired,
groupNotifications: PropTypes.arrayOf( groupNotifications: PropTypes.arrayOf(
PropTypes.shape({ PropTypes.shape({

@ -11,7 +11,7 @@ const Wrapper = styled.div`
class NotificationsGroup extends PureComponent { class NotificationsGroup extends PureComponent {
groupNotifications = notifications => groupNotifications = notifications =>
notifications.reduce((acc, obj) => { notifications.reduce((acc, obj) => {
const key = obj.type; const key = obj.variant;
if (!acc[key]) { if (!acc[key]) {
acc[key] = []; acc[key] = [];
} }
@ -20,6 +20,7 @@ class NotificationsGroup extends PureComponent {
}, {}); }, {});
sortByPriority(notifications) { sortByPriority(notifications) {
//TODO
return notifications; return notifications;
} }
@ -29,51 +30,53 @@ class NotificationsGroup extends PureComponent {
// { // {
// key: 1, // key: 1,
// title: 'this is a title of error notification', // title: 'this is a title of error notification',
// type: 'error', // variant: 'error',
// message: 'this is a message of error notification', // message: 'this is a message of error notification',
// }, // },
// { // {
// key: 2, // key: 2,
// title: 'this is a title of warning notification', // title: 'this is a title of warning notification',
// type: 'warning', // variant: 'warning',
// message: 'this is a message of warning notification', // message: 'this is a message of warning notification',
// }, // },
// { // {
// key: 3, // key: 3,
// title: 'this is a title of warning notification', // title: 'this is a title of warning notification',
// type: 'warning', // variant: 'warning',
// message: 'this is a message of warning notification', // message: 'this is a message of warning notification',
// }, // },
// { // {
// key: 4, // key: 4,
// title: 'this is a title of warning notification sds d', // title: 'this is a title of warning notification sds d',
// type: 'warning', // variant: 'warning',
// message: 'this is a message of warning notification', // message: 'this is a message of warning notification',
// }, // },
// { // {
// key: 5, // key: 5,
// title: 'this is a title of warning notification as', // title: 'this is a title of warning notification as',
// type: 'success', // variant: 'success',
// }, // },
// { // {
// key: 6, // key: 6,
// title: 'this is a title of warning notification as', // title: 'this is a title of warning notification as',
// type: 'info', // variant: 'info',
// message: 'this is a message of warning notification', // message: 'this is a message of warning notification',
// }, // },
// { // {
// key: 7, // key: 7,
// title: 'this is a title of info notification s ', // title: 'this is a title of info notification s ',
// type: 'info', // variant: 'info',
// message: 'this is a message of info notification', // message: 'this is a message of info notification',
// actions: // actions: [
// [{ // {
// label: 'Update', // label: 'Update',
// callback: 'props.routerActions.gotoBridgeUpdate', // callback: 'props.routerActions.gotoBridgeUpdate',
// }], // },
// ],
// }, // },
// ]; // ];
const notificationGroups = this.groupNotifications(notifications); const notificationGroups = this.groupNotifications(notifications);
console.log(notificationGroups);
const sortedNotifications = this.sortByPriority(notificationGroups); const sortedNotifications = this.sortByPriority(notificationGroups);
return ( return (
@ -82,7 +85,7 @@ class NotificationsGroup extends PureComponent {
<Group <Group
key={group} key={group}
groupNotifications={notificationGroups[group]} groupNotifications={notificationGroups[group]}
type={group} variant={group}
close={close} close={close}
/> />
))} ))}

@ -30,7 +30,7 @@ export default withRouter<Props>((props: {| ...Props, ...ContextRouter |}) => {
notifications.push( notifications.push(
<Notification <Notification
key="xrp-warning" key="xrp-warning"
type="warning" variant="warning"
title={ title={
<FormattedMessage {...l10nMessages.TR_MINIMUM_ACCOUNT_RESERVE_REQUIRED} /> <FormattedMessage {...l10nMessages.TR_MINIMUM_ACCOUNT_RESERVE_REQUIRED} />
} }
@ -61,7 +61,7 @@ export default withRouter<Props>((props: {| ...Props, ...ContextRouter |}) => {
notifications.push( notifications.push(
<Notification <Notification
key="import-warning" key="import-warning"
type="warning" variant="warning"
title="Use at your own risk" title="Use at your own risk"
message="This is an advanced interface intended for developer use only. Never use this process unless you really know what you are doing." message="This is an advanced interface intended for developer use only. Never use this process unless you really know what you are doing."
/> />
@ -72,7 +72,7 @@ export default withRouter<Props>((props: {| ...Props, ...ContextRouter |}) => {
notifications.push( notifications.push(
<Notification <Notification
key="watch-only-info" key="watch-only-info"
type="info" variant="info"
title="The account is watch-only" title="The account is watch-only"
message="A watch-only account is a public address youve imported into your wallet, allowing the wallet to watch for outputs but not spend them." message="A watch-only account is a public address youve imported into your wallet, allowing the wallet to watch for outputs but not spend them."
/> />

@ -16,7 +16,7 @@ export type NotificationEntry = {
+key: string, // React.Key +key: string, // React.Key
+id: ?string, +id: ?string,
+devicePath: ?string, +devicePath: ?string,
+type: string, +variant: string,
+title: React.Node | string, +title: React.Node | string,
+message: ?(React.Node | string), +message: ?(React.Node | string),
+cancelable: boolean, +cancelable: boolean,
@ -42,7 +42,7 @@ const addNotification = (state: State, payload: any): State => {
key: new Date().getTime().toString(), key: new Date().getTime().toString(),
id: payload.id, id: payload.id,
devicePath: payload.devicePath, devicePath: payload.devicePath,
type: payload.type, variant: payload.variant,
title: payload.title, title: payload.title,
message: payload.message, message: payload.message,
cancelable: payload.cancelable, cancelable: payload.cancelable,

@ -10,7 +10,7 @@ export type Loader = {
}; };
export type Notification = { export type Notification = {
type: string, variant: string,
title: string, title: string,
message?: string, message?: string,
}; };

@ -13,7 +13,7 @@ const InitializationError = (props: { error: string }) => (
<Notification <Notification
title="Initialization error" title="Initialization error"
message={props.error} message={props.error}
type="error" variant="error"
cancelable={false} cancelable={false}
/> />
</Wrapper> </Wrapper>

@ -37,7 +37,7 @@ const Acquire = (props: Props) => (
<Notification <Notification
title={props.intl.formatMessage(l10nMessages.TR_DEVICE_USED_IN_OTHER)} title={props.intl.formatMessage(l10nMessages.TR_DEVICE_USED_IN_OTHER)}
message={props.intl.formatMessage(l10nMessages.TR_USE_YOUR_DEVICE_IN_THIS_WINDOW)} message={props.intl.formatMessage(l10nMessages.TR_USE_YOUR_DEVICE_IN_THIS_WINDOW)}
type="info" variant="info"
cancelable={false} cancelable={false}
isActionInProgress={props.acquiring} isActionInProgress={props.acquiring}
actions={[ actions={[

@ -14,7 +14,7 @@ const UnreadableDevice = ({ intl }: { intl: IntlShape }) => (
<Notification <Notification
title={intl.formatMessage(l10nMessages.TR_UNREADABLE_DEVICE)} title={intl.formatMessage(l10nMessages.TR_UNREADABLE_DEVICE)}
message={intl.formatMessage(l10nMessages.TR_PLEASE_INSTALL_TREZOR_BRIDGE)} message={intl.formatMessage(l10nMessages.TR_PLEASE_INSTALL_TREZOR_BRIDGE)}
type="error" variant="error"
cancelable={false} cancelable={false}
/> />
</Wrapper> </Wrapper>

Loading…
Cancel
Save