add Legal links to sidebar, rename Block layout component prop

This commit is contained in:
Mikhail Mikheev 2019-10-01 16:12:45 +04:00
parent e8271d2b02
commit 969a389836
23 changed files with 76 additions and 33 deletions

View File

@ -118,7 +118,7 @@ const UserDetails = ({
<CircleDot keySize={30} circleSize={75} dotSize={25} dotTop={50} dotRight={25} mode="warning" hideDot />
)}
</Row>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph className={classes.address} size="xs" noMargin>
{address}
</Paragraph>

View File

@ -0,0 +1,37 @@
// @flow
import React from 'react'
import { makeStyles } from '@material-ui/core/styles'
import Block from '~/components/layout/Block'
import Link from '~/components/layout/Link'
import { sm, primary } from '~/theme/variables'
const useStyles = makeStyles({
container: {
padding: `${sm} 0`,
},
link: {
color: primary,
},
})
const LegalLinks = () => {
const classes = useStyles()
return (
<Block className={classes.container} justify="space-around">
<Link className={classes.link} to="https://safe.gnosis.io/terms-of-use-072018.html" target="_blank">
Terms
</Link>
<Link className={classes.link} to="https://safe.gnosis.io/privacy-policy-052019.html" target="_blank">
Privacy
</Link>
<Link className={classes.link} to="https://safe.gnosis.io/licenses-092019.html" target="_blank">
Licenses
</Link>
<Link className={classes.link} to="https://safe.gnosis.io/imprint.html" target="_blank">
Imprint
</Link>
</Block>
)
}
export default LegalLinks

View File

@ -24,7 +24,7 @@ const DefaultBadge = () => {
const classes = useStyles()
return (
<Block align="left" className={classes.container}>
<Block justify="left" className={classes.container}>
<Img src={StarIcon} alt="Star Icon" />
<Paragraph noMargin size="xs">
default

View File

@ -12,13 +12,15 @@ import Link from '~/components/layout/Link'
import Spacer from '~/components/Spacer'
import Hairline from '~/components/layout/Hairline'
import Row from '~/components/layout/Row'
import { WELCOME_ADDRESS } from '~/routes/routes'
import { type Safe } from '~/routes/safe/store/models/safe'
import { defaultSafeSelector } from '~/routes/safe/store/selectors'
import setDefaultSafe from '~/routes/safe/store/actions/setDefaultSafe'
import { sortedSafeListSelector } from './selectors'
import useSidebarStyles from './style'
import SafeList from './SafeList'
import { WELCOME_ADDRESS } from '~/routes/routes'
import LegalLinks from './LegalLinks'
import useSidebarStyles from './style'
const { useState, useEffect } = React
@ -128,6 +130,7 @@ const Sidebar = ({
setDefaultSafe={setDefaultSafeAction}
defaultSafe={defaultSafe}
/>
<LegalLinks />
</Drawer>
</ClickAwayListener>
{children}

View File

@ -12,7 +12,7 @@ const cx = classNames.bind(styles)
type Props = {
margin?: Size,
padding?: Size,
align?: 'center' | 'right' | 'left',
justify?: 'center' | 'right' | 'left' | 'space-around',
children: React.Node,
className?: string,
}
@ -20,12 +20,12 @@ type Props = {
class Block extends PureComponent<Props> {
render() {
const {
margin, padding, align, children, className, ...props
margin, padding, justify, children, className, ...props
} = this.props
const paddingStyle = padding ? capitalize(padding, 'padding') : undefined
return (
<div className={cx(className, 'block', margin, paddingStyle, align)} {...props}>
<div className={cx(className, 'block', margin, paddingStyle, justify)} {...props}>
{children}
</div>
)

View File

@ -52,6 +52,12 @@
align-items: center;
}
.space-around {
display: flex;
align-items: center;
justify-content: space-around;
}
.right {
display: flex;
align-items: center;

View File

@ -47,7 +47,7 @@ export const getEtherScanLink = (type: 'address' | 'tx', value: string) => {
let web3
export const getWeb3 = () => web3 || (window.web3 && new Web3(window.web3.currentProvider)) || (window.ethereum && new Web3(window.ethereum))
const getProviderName: Function = (web3Provider): boolean => {
const getProviderName: Function = (web3Provider): string => {
let name
switch (web3Provider.currentProvider.constructor.name) {
@ -58,7 +58,7 @@ const getProviderName: Function = (web3Provider): boolean => {
name = WALLET_PROVIDER.METAMASK
break
default:
name = 'UNKNOWN'
name = 'Wallet'
}
return name
@ -86,10 +86,7 @@ export const getProviderInfo: Function = async (): Promise<ProviderProps> => {
if (window.ethereum) {
web3Provider = window.ethereum
try {
const accounts = await web3Provider.enable()
if (!accounts) {
throw new Error()
}
await web3Provider.enable()
} catch (error) {
console.error('Error when enabling web3 provider', error)
}

View File

@ -164,7 +164,7 @@ class ReviewComponent extends React.PureComponent<Props, State> {
<Paragraph size="lg" noMargin>
{values[getOwnerNameBy(index)]}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{address}
</Paragraph>

View File

@ -144,7 +144,7 @@ const ReviewComponent = ({ values, classes, userAccount }: Props) => {
<Paragraph size="lg" noMargin>
{name}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{addresses[index]}
</Paragraph>

View File

@ -66,7 +66,7 @@ const ScanQRModal = ({
<Hairline />
<Col layout="column" middle="xs" className={classes.detailsContainer}>
{hasWebcam === null ? (
<Block align="center" className={classes.loaderContainer}>
<Block justify="center" className={classes.loaderContainer}>
<CircularProgress />
</Block>
) : (

View File

@ -16,7 +16,7 @@ const AssetTableCell = (props: Props) => {
const { asset } = props
return (
<Block align="left">
<Block justify="left">
<Img src={asset.logoUri} height={26} alt={asset.name} onError={setImageToPlaceholder} />
<Paragraph size="lg" style={{ marginLeft: 10 }} noMargin>{asset.name}</Paragraph>
</Block>

View File

@ -92,7 +92,7 @@ const Receive = ({
<Block className={classes.qrContainer}>
<QRCode value={safeAddress} size={135} />
</Block>
<Block align="center" className={classes.addressContainer}>
<Block justify="center" className={classes.addressContainer}>
<Identicon address={safeAddress} diameter={32} />
<Paragraph
onClick={() => {

View File

@ -174,7 +174,7 @@ const AddCustomToken = (props: Props) => {
className={classes.addressInput}
testId={ADD_CUSTOM_TOKEN_DECIMALS_INPUT_TEST_ID}
/>
<Block align="left">
<Block justify="left">
<Field name="showForAllSafes" component={Checkbox} type="checkbox" className={classes.checkbox} />
<Paragraph weight="bolder" size="md" className={classes.checkboxLabel}>
Activate token for all Safes

View File

@ -154,7 +154,7 @@ class Tokens extends React.Component<Props, State> {
</Block>
<MuiList className={classes.list}>
{!tokens.size && (
<Block align="center" className={classes.progressContainer}>
<Block justify="center" className={classes.progressContainer}>
<CircularProgress />
</Block>
)}

View File

@ -112,7 +112,7 @@ class Layout extends React.Component<Props, State> {
</Heading>
{!granted && <Block className={classes.readonly}>Read Only</Block>}
</Row>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" className={classes.address} onClick={this.copyAddress} title="Click to copy" noMargin>
{address}
</Paragraph>

View File

@ -106,7 +106,7 @@ const ReviewAddOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{owner.name}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{owner.address}
</Paragraph>
@ -135,7 +135,7 @@ const ReviewAddOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{values.ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{values.ownerAddress}
</Paragraph>

View File

@ -98,7 +98,7 @@ const EditOwnerComponent = ({
/>
</Row>
<Row>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Identicon address={ownerAddress} diameter={32} />
<Paragraph style={{ marginLeft: 10 }} size="md" color="disabled" noMargin>
{ownerAddress}

View File

@ -11,7 +11,7 @@ type Props = {
const OwnerAddressTableCell = (props: Props) => {
const { address } = props
return (
<Block align="left">
<Block justify="left">
<Identicon address={address} diameter={32} />
<Paragraph style={{ marginLeft: 10 }}>{address}</Paragraph>
</Block>

View File

@ -64,7 +64,7 @@ const CheckOwner = ({
<Paragraph size="lg" noMargin weight="bolder">
{ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{ownerAddress}
</Paragraph>

View File

@ -118,7 +118,7 @@ const ReviewRemoveOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{owner.name}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{owner.address}
</Paragraph>
@ -152,7 +152,7 @@ const ReviewRemoveOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{ownerAddress}
</Paragraph>

View File

@ -95,7 +95,7 @@ const OwnerForm = ({
<Paragraph size="lg" noMargin weight="bolder">
{ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{ownerAddress}
</Paragraph>

View File

@ -121,7 +121,7 @@ const ReviewRemoveOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{owner.name}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{owner.address}
</Paragraph>
@ -155,7 +155,7 @@ const ReviewRemoveOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{ownerAddress}
</Paragraph>
@ -181,7 +181,7 @@ const ReviewRemoveOwner = ({
<Paragraph weight="bolder" size="lg" noMargin>
{values.ownerName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{values.ownerAddress}
</Paragraph>

View File

@ -58,7 +58,7 @@ const RemoveSafeComponent = ({
<Paragraph size="lg" noMargin weight="bolder">
{safeName}
</Paragraph>
<Block align="center" className={classes.user}>
<Block justify="center" className={classes.user}>
<Paragraph size="md" color="disabled" noMargin>
{safeAddress}
</Paragraph>