Skip to content
Permalink
Browse files

Merge latest v2-integration

  • Loading branch information...
nikolaglumac committed Nov 8, 2019
2 parents 6e1ca1d + 3dde29b commit d8913db72a492ab2a0c68e95906bed73af667e10
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
@@ -5,6 +5,7 @@ Changelog

### Features

- 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 d8913db

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