Skip to content
Permalink
Browse files

[DDW-1053] Merge latest v2-integration

  • Loading branch information...
nikolaglumac committed Nov 8, 2019
2 parents 08a337a + 3dde29b commit 20f4786d098a63e609c70b4d69d85b422137931d
Showing with 767 additions and 3 deletions.
  1. +1 −0 CHANGELOG.md
  2. +1 −0 source/renderer/app/actions/network-status-actions.js
  3. +102 −0 source/renderer/app/assets/images/splash-network-bg-faded.inline.svg
  4. +10 −2 source/renderer/app/components/sidebar/Sidebar.js
  5. +101 −0 source/renderer/app/components/splash/Network.js
  6. +169 −0 source/renderer/app/components/splash/Network.scss
  7. +1 −0 source/renderer/app/containers/MainLayout.js
  8. +10 −1 source/renderer/app/containers/Root.js
  9. +47 −0 source/renderer/app/containers/splash/NetworkPage.js
  10. +7 −0 source/renderer/app/i18n/locales/de-DE.json
  11. +108 −0 source/renderer/app/i18n/locales/defaultMessages.json
  12. +7 −0 source/renderer/app/i18n/locales/en-US.json
  13. +7 −0 source/renderer/app/i18n/locales/hr-HR.json
  14. +7 −0 source/renderer/app/i18n/locales/ja-JP.json
  15. +7 −0 source/renderer/app/i18n/locales/ko-KR.json
  16. +7 −0 source/renderer/app/i18n/locales/zh-CN.json
  17. +8 −0 source/renderer/app/stores/NetworkStatusStore.js
  18. +18 −0 source/renderer/app/themes/daedalus/cardano.js
  19. +18 −0 source/renderer/app/themes/daedalus/dark-blue.js
  20. +18 −0 source/renderer/app/themes/daedalus/dark-cardano.js
  21. +19 −0 source/renderer/app/themes/daedalus/incentivized-testnet.js
  22. +18 −0 source/renderer/app/themes/daedalus/light-blue.js
  23. +19 −0 source/renderer/app/themes/daedalus/white.js
  24. +18 −0 source/renderer/app/themes/daedalus/yellow.js
  25. +14 −0 source/renderer/app/themes/utils/createTheme.js
  26. +13 −0 storybook/stories/Splash-Network.stories.js
  27. +9 −0 storybook/stories/Splash.stories.js
  28. +3 −0 storybook/stories/index.js
@@ -6,6 +6,7 @@ Changelog
### Features

- Implemented the necessary UI changes for the Incentivized Testnet network ([PR 1657](https://github.com/input-output-hk/daedalus/pull/1657))
- Implemented "Network info" overlay ([PR 1655](https://github.com/input-output-hk/daedalus/pull/1655))
- Disable "Manual update" notification for Incentivized Testnet version of Daedalus ([PR 1652](https://github.com/input-output-hk/daedalus/pull/1652))
- Update rewards screen for incentivized testnet ([PR 1643](https://github.com/input-output-hk/daedalus/pull/1643))
- Implement restoration of both 12 and 15 mnemonic words phrases in Wallet Restore dialog ([PR 1629](https://github.com/input-output-hk/daedalus/pull/1629))
@@ -8,4 +8,5 @@ export default class NetworkStatusActions {
tlsConfigIsReady: Action<any> = new Action();
restartNode: Action<any> = new Action();
nodeImplementationUpdate: Action<any> = new Action();
toggleSplash: Action<any> = new Action();
}

Large diffs are not rendered by default.

@@ -24,6 +24,7 @@ type Props = {
onActivateCategory: Function,
onOpenDialog: Function,
onAddWallet: Function,
onOpenSplashNetwork?: Function,
isIncentivizedTestnet: boolean,
};

@@ -41,6 +42,7 @@ export type SidebarMenus = ?{
export default class Sidebar extends Component<Props> {
static defaultProps = {
isShowingSubMenus: false,
onOpenSplashNetwork: () => null,
};

render() {
@@ -118,11 +120,17 @@ export default class Sidebar extends Component<Props> {
};

handleClick = (categoryRoute: string) => {
const { onActivateCategory, onOpenDialog } = this.props;
const {
onActivateCategory,
onOpenDialog,
onOpenSplashNetwork,
} = this.props;
if (categoryRoute === ROUTES.PAPER_WALLET_CREATE_CERTIFICATE) {
onOpenDialog(InstructionsDialog);
} else if (categoryRoute === ROUTES.NETWORK_INFO) {
// TODO: waiting for the Network Info screen to be done
if (onOpenSplashNetwork) {
onOpenSplashNetwork();
}
} else {
onActivateCategory(categoryRoute);
}
@@ -0,0 +1,101 @@
// @flow
import React, { Component } from 'react';
import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
import SVGInline from 'react-svg-inline';
import { Button } from 'react-polymorph/lib/components/Button';
import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
import backgroundImage from '../../assets/images/splash-network-bg-faded.inline.svg';
import daedalusIcon from '../../assets/images/daedalus-logo-loading-grey.inline.svg';
import externalLinkIcon from '../../assets/images/link-ic.inline.svg';
import styles from './Network.scss';

const messages = defineMessages({
title: {
id: 'static.splash.network.title',
defaultMessage: '!!!Daedalus',
description: 'Daedalus',
},
incentivizedTestnet: {
id: 'static.splash.network.incentivizedTestnet',
defaultMessage: '!!!Incentivized Testnet',
description: 'Incentivized Testnet',
},
balanceCheck: {
id: 'static.splash.network.balanceCheck',
defaultMessage: '!!!Balance Check',
description: 'Balance Check',
},
incentivizedTestnetDescription: {
id: 'static.splash.network.incentivizedTestnetDescription',
defaultMessage:
'!!!This version of Daedalus has been created specifically for the balance check, the first stage in the roll-out of the Incentivized Testnet. It is not compatible with the Cardano mainnet. The balance check is a practice run for the official balance snapshot that is currently planned for later in November. This initial test will allow us to test core functionality, while enabling users to validate that the value of their mainnet ada balances is accurately captured ahead of the Incentivized Testnet.',
description:
'This version of Daedalus has been created specifically for the balance check, the first stage in the roll-out of the Incentivized Testnet. It is not compatible with the Cardano mainnet. The balance check is a practice run for the official balance snapshot that is currently planned for later in November. This initial test will allow us to test core functionality, while enabling users to validate that the value of their mainnet ada balances is accurately captured ahead of the Incentivized Testnet.',
},
actionLabel: {
id: 'static.splash.network.actionLabel',
defaultMessage: '!!!I understand',
description: 'I understand',
},
learnMore: {
id: 'static.splash.network.learnMore',
defaultMessage: '!!!Learn more',
description: 'Learn more',
},
});

type Props = {
isIncentivizedTestnet: boolean,
onClose: Function,
onLearnMoreClick: Function,
};

export default class SplashNetwork extends Component<Props> {
static contextTypes = {
intl: intlShape.isRequired,
};

render() {
const { intl } = this.context;
const { isIncentivizedTestnet, onClose, onLearnMoreClick } = this.props;
const title = intl.formatMessage(messages.title);
const subTitle1 = intl.formatMessage(messages.incentivizedTestnet);
const subTitle2 = intl.formatMessage(messages.balanceCheck);
const description = (
<FormattedHTMLMessage {...messages.incentivizedTestnetDescription} />
);
const actionLabel = intl.formatMessage(messages.actionLabel);

return (
<div className={styles.component}>
<div className={styles.backgroundContainer}>
{isIncentivizedTestnet && (
<>
<div className={styles.backgroundOverlay} />
<SVGInline
svg={backgroundImage}
className={styles.backgroundImage}
/>
</>
)}
</div>
<div className={styles.content}>
<SVGInline svg={daedalusIcon} className={styles.daedalusIcon} />
<div className={styles.title}>{title}</div>
<div className={styles.subTitle1}>{subTitle1}</div>
<div className={styles.subTitle2}>{subTitle2}</div>
<div className={styles.description}>{description}</div>
<div className={styles.action}>
<Button label={actionLabel} onClick={onClose} skin={ButtonSkin} />
</div>
<div className={styles.learnMore}>
<button onClick={onLearnMoreClick}>
{intl.formatMessage(messages.learnMore)}
<SVGInline svg={externalLinkIcon} />
</button>
</div>
</div>
</div>
);
}
}
@@ -0,0 +1,169 @@
@import '../../themes/mixins/link';

.component {
height: 100%;
padding: 16px;
position: relative;
width: 100%;

.backgroundContainer {
background-color: var(--theme-splash-network-background-color);
height: 100%;
left: 0;
object-fit: contain;
overflow: hidden;
position: absolute;
top: 0;
width: 100%;
z-index: 1000;

.backgroundOverlay {
background-image: linear-gradient(
0deg,
var(--theme-splash-network-background-color1) 0%,
var(--theme-splash-network-background-color2) 10%,
var(--theme-splash-network-background-color3) 16%,
var(--theme-splash-network-background-color4) 20%,
var(--theme-splash-network-background-color5) 80%,
var(--theme-splash-network-background-color6) 84%,
var(--theme-splash-network-background-color7) 90%,
var(--theme-splash-network-background-color8) 100%
);
height: 100%;
position: absolute;
width: 100%;
z-index: 1500;
}

.backgroundImage {
display: block;
height: 100%;
opacity: 0.1;
position: relative;
width: 100%;

& > svg {
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 1186px;
}
}
}

.content {
align-items: center;
display: flex;
flex-direction: column;
font-family: var(--font-regular);
height: 100%;
justify-content: center;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 2000;

.daedalusIcon {
height: 135px;
object-fit: contain;
width: 173px;

svg {
path {
fill: var(--theme-splash-network-logo-fill-color);
}
}
}
.title {
color: var(--theme-splash-network-title-color);
font-size: 20px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 1px;
margin-bottom: 5px;
margin-top: 30px;
text-transform: uppercase;
}
.subTitle1 {
color: var(--theme-splash-network-subTitle1-color);
font-size: 20px;
font-weight: 600;
letter-spacing: 1px;
line-height: 1.2;
margin-bottom: 5px;
text-transform: uppercase;
}
.subTitle2 {
color: var(--theme-splash-network-subTitle2-color);
font-size: 16px;
font-weight: 600;
letter-spacing: 0.8px;
line-height: 1.38;
margin-bottom: 20px;
text-transform: uppercase;
}
.description {
background-color: var(
--theme-splash-network-description-background-color
);
border-radius: 4px;
color: var(--theme-splash-network-description-color);
font-size: 14px;
line-height: 1.43;
margin-bottom: 30px;
max-height: 190px;
max-width: 608px;
overflow-y: scroll;
padding: 12px 24px;

p {
margin-bottom: 12px;

&:last-child {
margin-bottom: 0;
}
}
}
.action {
button {
min-height: 50px;
}
}
.learnMore {
margin-top: 20px;

button {
align-items: center;
border-bottom: 1px solid var(--theme-splash-network-learn-more-color);
color: var(--theme-splash-network-learn-more-color);
cursor: pointer;
display: flex;
font-size: 14px;
line-height: 1.36;
opacity: 0.8;
padding-bottom: 1px;

:global {
.SVGInline {
height: 15px;
}
}

svg {
height: 13px;
margin-left: 2px;
object-fit: contain;
width: 13px;

& > g {
fill: transparent;
stroke: var(--theme-splash-network-learn-more-color);
}
}
}
}
}
}
@@ -60,6 +60,7 @@ export default class MainLayout extends Component<InjectedContainerProps> {
onSubmitSupportRequest={() =>
actions.router.goToRoute.trigger({ route: ROUTES.SETTINGS.SUPPORT })
}
onOpenSplashNetwork={() => actions.networkStatus.toggleSplash.trigger()}
pathname={this.props.stores.router.location.pathname}
currentTheme={currentTheme}
network={network}
@@ -3,6 +3,7 @@ import React, { Component } from 'react';
import { inject, observer } from 'mobx-react';
import WalletAddPage from './wallet/WalletAddPage';
import LoadingPage from './loading/LoadingPage';
import SplashNetworkPage from './splash/NetworkPage';
import type { InjectedContainerProps } from '../types/injectedPropsType';

type Props = InjectedContainerProps;
@@ -12,7 +13,7 @@ type Props = InjectedContainerProps;
export default class Root extends Component<Props> {
render() {
const { stores, actions, children } = this.props;
const { networkStatus, profile, wallets, staking } = stores;
const { app, networkStatus, profile, wallets, staking } = stores;
const { isStakingPage } = staking;
const { isProfilePage, isSettingsPage } = profile;
const { hasLoadedWallets } = wallets;
@@ -32,6 +33,14 @@ export default class Root extends Component<Props> {
// for all the screens except of the "Network status" screen.
const isNodeInStoppingSequence = isNodeStopping || isNodeStopped;

if (
!app.isSetupPage &&
!app.environment.isTest &&
networkStatus.isSplashShown
) {
return <SplashNetworkPage />;
}

// Just render any page that doesn't require wallets to be loaded or node to be connected
if (
(isPageThatDoesntNeedWallets && !isNodeInStoppingSequence) ||

0 comments on commit 20f4786

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