add Legal links to sidebar, rename Block layout component prop
This commit is contained in:
parent
e8271d2b02
commit
969a389836
|
@ -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>
|
||||
|
|
|
@ -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
|
|
@ -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
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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>
|
||||
)
|
||||
|
|
|
@ -52,6 +52,12 @@
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.space-around {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -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)
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
) : (
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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={() => {
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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>
|
||||
)}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in New Issue