Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'develop' into chore/ddw-656-log-daedalus-state-snapshot
- Loading branch information
Showing
21 changed files
with
14,220 additions
and
652 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
69 changes: 45 additions & 24 deletions
69
source/renderer/app/components/loading/syncing-connecting/LogosDisplay.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Original file line | Diff line number | Diff line change |
|---|---|---|---|
| @@ -1,37 +1,58 @@ | |||
| // @flow | // @flow | ||
| import React from 'react'; | import React, { Component } from 'react'; | ||
| import SVGInline from 'react-svg-inline'; | import SVGInline from 'react-svg-inline'; | ||
| import classNames from 'classnames'; | import classNames from 'classnames'; | ||
| import Lottie from 'react-lottie'; | |||
| import styles from './LogosDisplay.scss'; | import styles from './LogosDisplay.scss'; | ||
| import adaLogo from '../../../assets/images/ada-logo.inline.svg'; | import adaLogo from '../../../assets/images/ada-logo.inline.svg'; | ||
| import daedalusLogo from '../../../assets/images/daedalus-logo-loading-grey.inline.svg'; | |||
| import cardanoLogo from '../../../assets/images/cardano-logo.inline.svg'; | import cardanoLogo from '../../../assets/images/cardano-logo.inline.svg'; | ||
| import animationData from './logo-animation-data.json'; | |||
|
|
|
||
| type Props = { | type Props = { | ||
| isConnected: boolean, | isConnected: boolean, | ||
| }; | }; | ||
|
|
|
||
| const LogosDisplay = ({ isConnected }: Props) => { | const logoAnimationOptionsLottie = { | ||
| const currencyLogoStyles = classNames([ | loop: true, | ||
| styles['ada-logo'], | autoplay: true, | ||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | animationData, | ||
| ]); | rendererSettings: { | ||
| const daedalusLogoStyles = classNames([ | preserveAspectRatio: 'xMidYMid slice', | ||
| styles.daedalusLogo, | }, | ||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | |||
| ]); | |||
| const apiLogoStyles = classNames([ | |||
| styles['ada-apiLogo'], | |||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | |||
| ]); | |||
|
|
|||
| return ( | |||
| <div className={styles.component}> | |||
| <SVGInline svg={adaLogo} className={currencyLogoStyles} /> | |||
| <SVGInline svg={daedalusLogo} className={daedalusLogoStyles} /> | |||
| <SVGInline svg={cardanoLogo} className={apiLogoStyles} /> | |||
| </div> | |||
| ); | |||
| }; | }; | ||
|
|
|
||
| export default LogosDisplay; | export default class LogosDisplay extends Component<Props> { | ||
| componentDidMount() { | |||
| // Manual adjustment due to `logo-animation-data.json` canvas size | |||
| const svg: Object = document.querySelector( | |||
| '.LogosDisplay_daedalusLogo svg' | |||
| ); | |||
| svg.setAttribute('viewBox', '534 250 212 220'); | |||
| } | |||
|
|
|||
| render() { | |||
| const { isConnected } = this.props; | |||
| const currencyLogoStyles = classNames([ | |||
| styles['ada-logo'], | |||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | |||
| ]); | |||
| const daedalusLogoStyles = classNames([ | |||
| styles.daedalusLogo, | |||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | |||
| ]); | |||
| const apiLogoStyles = classNames([ | |||
| styles['ada-apiLogo'], | |||
| !isConnected ? styles.connectingLogo : styles.syncingLogo, | |||
| ]); | |||
|
|
|||
| return ( | |||
| <div className={styles.component}> | |||
| <SVGInline svg={adaLogo} className={currencyLogoStyles} /> | |||
| <div className={daedalusLogoStyles}> | |||
| <Lottie options={logoAnimationOptionsLottie} /> | |||
| </div> | |||
| <SVGInline svg={cardanoLogo} className={apiLogoStyles} /> | |||
| </div> | |||
| ); | |||
| } | |||
| } | |||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.