diff --git a/package.json b/package.json index 7569e34..95fa2d0 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,6 @@ "auto-changelog": "^1.16.1", "babel-eslint": "^10.0.3", "babel-loader": "^8.0.6", - "classnames": "^2.2.6", "copy-webpack-plugin": "^5.0.4", "cross-env": "^5.2.1", "css-loader": "^3.2.0", diff --git a/src/renderer/components/Balance.jsx b/src/renderer/components/Balance.jsx index fff8df0..0335a40 100644 --- a/src/renderer/components/Balance.jsx +++ b/src/renderer/components/Balance.jsx @@ -9,7 +9,7 @@ import styles from './Balance.module.css' const Animation = posed.h1(fadeIn) -const Balance = ({ balance, label, large }) => { +const Balance = ({ balance, label, labelOnClick, large }) => { const { currency } = useContext(AppContext) return ( @@ -22,7 +22,7 @@ const Balance = ({ balance, label, large }) => { {cryptoFormatter(balance[currency], currency)} - {label && } + {label && } ) } @@ -30,6 +30,7 @@ const Balance = ({ balance, label, large }) => { Balance.propTypes = { balance: PropTypes.object.isRequired, label: PropTypes.string, + labelOnClick: PropTypes.func, large: PropTypes.bool } diff --git a/src/renderer/components/Label.jsx b/src/renderer/components/Label.jsx index 2681aa3..dc68f70 100644 --- a/src/renderer/components/Label.jsx +++ b/src/renderer/components/Label.jsx @@ -2,13 +2,14 @@ import React from 'react' import PropTypes from 'prop-types' import styles from './Label.module.css' -const Label = ({ children, ...props }) => ( - +const Label = ({ children, labelOnClick, ...props }) => ( + {children} ) Label.propTypes = { + labelOnClick: PropTypes.func, children: PropTypes.any.isRequired } diff --git a/src/renderer/screens/Home/Account.jsx b/src/renderer/screens/Home/Account.jsx deleted file mode 100644 index f8ba8a6..0000000 --- a/src/renderer/screens/Home/Account.jsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' -import { openUrl } from '../../../utils' -import Balance from '../../components/Balance' - -const Account = ({ account }) => { - const { balance, address } = account - - return ( - - openUrl(`https://etherscan.io/address/${address}#tokentxns`) - } - /> - ) -} - -Account.propTypes = { - account: PropTypes.shape({ - address: PropTypes.string.isRequired, - balance: PropTypes.object.isRequired - }) -} - -export default Account diff --git a/src/renderer/screens/Home/Accounts.jsx b/src/renderer/screens/Home/Accounts.jsx new file mode 100644 index 0000000..d0ebc14 --- /dev/null +++ b/src/renderer/screens/Home/Accounts.jsx @@ -0,0 +1,26 @@ +import React, { useContext } from 'react' +import { openUrl } from '../../../utils' +import Balance from '../../components/Balance' +import { AppContext } from '../../store/createContext' +import styles from './Accounts.module.css' + +const Accounts = () => { + const { accounts } = useContext(AppContext) + + return ( +
+ {accounts.map((account, i) => ( + + openUrl(`https://etherscan.io/address/${account.address}#tokentxns`) + } + /> + ))} +
+ ) +} + +export default Accounts diff --git a/src/renderer/screens/Home/Accounts.module.css b/src/renderer/screens/Home/Accounts.module.css new file mode 100644 index 0000000..295138a --- /dev/null +++ b/src/renderer/screens/Home/Accounts.module.css @@ -0,0 +1,5 @@ +.accounts { + composes: balanceWrap from './index.module.css'; + min-height: 55px; + padding-top: 2rem; +} diff --git a/src/renderer/screens/Home/index.jsx b/src/renderer/screens/Home/index.jsx index b23298c..5bd4259 100644 --- a/src/renderer/screens/Home/index.jsx +++ b/src/renderer/screens/Home/index.jsx @@ -1,35 +1,21 @@ import React, { useContext } from 'react' import { Link } from '@reach/router' -import classnames from 'classnames' import { AppContext } from '../../store/createContext' import Welcome from '../../components/Welcome' import Spinner from '../../components/Spinner' import Divider from '../../components/Divider' import Total from './Total' -import Account from './Account' import Ticker from './Ticker' +import Accounts from './Accounts' import IconCog from '../../images/cog.svg' -import stylesBox from '../../components/Box.module.css' import styles from './index.module.css' -const Accounts = () => { - const { accounts } = useContext(AppContext) - - return ( -
- {accounts.map((account, i) => ( - - ))} -
- ) -} - const Home = () => { const { isLoading, needsConfig } = useContext(AppContext) return ( <> -
+
diff --git a/src/renderer/screens/Home/index.module.css b/src/renderer/screens/Home/index.module.css index 15e7d90..1c6a3ee 100644 --- a/src/renderer/screens/Home/index.module.css +++ b/src/renderer/screens/Home/index.module.css @@ -1,4 +1,5 @@ .main { + composes: box from '../../components/Box.module.css'; min-height: 222px; display: flex; align-items: center; @@ -31,9 +32,3 @@ justify-items: start; width: 100%; } - -.balanceWrapAccounts { - composes: balanceWrap; - min-height: 55px; - padding-top: 2rem; -}