ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

use trans macro instead of t wherever possible

Browse Source
This commit is contained in:
Moody Salem 2021-05-30 14:05:37 -05:00
parent 499ef27722
commit 1104bdcefc
No known key found for this signature in database
GPG Key ID: 8CB5CD10385138DB
24 changed files with 106 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Badge/RangeBadge.tsx
View File

@ -4,7 +4,7 @@ import Badge, { BadgeVariant } from 'components/Badge'
import styled from 'styled-components/macro'
import { MouseoverTooltip } from '../../components/Tooltip'
import { Trans, t } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import { AlertCircle } from 'react-feather'
const BadgeWrapper = styled.div`
@ -43,7 +43,7 @@ export default function RangeBadge({
return (
<BadgeWrapper>
{removed ? (
<MouseoverTooltip text={t`Your position has 0 liquidity, and is not earning fees.`}>
<MouseoverTooltip text={<Trans>Your position has 0 liquidity, and is not earning fees.</Trans>}>
<Badge variant={BadgeVariant.DEFAULT}>
<AlertCircle width={14} height={14} />
&nbsp;
@ -54,7 +54,11 @@ export default function RangeBadge({
</MouseoverTooltip>
) : inRange ? (
<MouseoverTooltip
text={t`The price of this pool is within your selected range. Your position is currently earning fees.`}
text={
<Trans>
The price of this pool is within your selected range. Your position is currently earning fees.
</Trans>
}
>
<Badge variant={BadgeVariant.DEFAULT}>
<ActiveDot /> &nbsp;
@ -65,7 +69,11 @@ export default function RangeBadge({
</MouseoverTooltip>
) : (
<MouseoverTooltip
text={t`The price of this pool is outside of your selected range. Your position is not currently earning fees.`}
text={
<Trans>
The price of this pool is outside of your selected range. Your position is not currently earning fees.
</Trans>
}
>
<Badge variant={BadgeVariant.WARNING}>
<AlertCircle width={14} height={14} />

2
src/components/CurrencyInputPanel/index.tsx
View File

@ -149,7 +149,7 @@ interface CurrencyInputPanelProps {
onUserInput: (value: string) => void
onMax?: () => void
showMaxButton: boolean
label?: string
label?: ReactNode
onCurrencySelect?: (currency: Currency) => void
currency?: Currency | null
hideBalance?: boolean

26
src/components/FeeSelector/index.tsx
View File

@ -1,6 +1,6 @@
import React from 'react'
import { FeeAmount } from '@uniswap/v3-sdk'
import { t } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import { AutoColumn } from 'components/Column'
import { DynamicSection } from 'pages/AddLiquidity/styled'
import { TYPE } from 'theme'
@ -26,9 +26,11 @@ export default function FeeSelector({
return (
<AutoColumn gap="16px">
<DynamicSection gap="md" disabled={disabled}>
<TYPE.label>{t`Select Pool`}</TYPE.label>
<TYPE.label>
<Trans>Select Pool</Trans>
</TYPE.label>
<TYPE.main fontSize={14} fontWeight={400} style={{ marginBottom: '.5rem', lineHeight: '125%' }}>
{t`Select a pool type based on your preferred liquidity provider fee.`}
<Trans>Select a pool type based on your preferred liquidity provider fee.</Trans>
</TYPE.main>
<RowBetween>
<ButtonRadioChecked
@ -37,9 +39,11 @@ export default function FeeSelector({
onClick={() => handleFeePoolSelect(FeeAmount.LOW)}
>
<AutoColumn gap="sm" justify="flex-start">
<ResponsiveText>{t`0.05% fee`}</ResponsiveText>
<ResponsiveText>
<Trans>0.05% fee</Trans>
</ResponsiveText>
<TYPE.main fontWeight={400} fontSize="12px" textAlign="left">
{t`Best for stable pairs.`}
<Trans>Best for stable pairs.</Trans>
</TYPE.main>
</AutoColumn>
</ButtonRadioChecked>
@ -49,9 +53,11 @@ export default function FeeSelector({
onClick={() => handleFeePoolSelect(FeeAmount.MEDIUM)}
>
<AutoColumn gap="sm" justify="flex-start">
<ResponsiveText>{t`0.3% fee`}</ResponsiveText>
<ResponsiveText>
<Trans>0.3% fee</Trans>
</ResponsiveText>
<TYPE.main fontWeight={400} fontSize="12px" textAlign="left">
{t`Best for most pairs.`}
<Trans>Best for most pairs.</Trans>
</TYPE.main>
</AutoColumn>
</ButtonRadioChecked>
@ -61,9 +67,11 @@ export default function FeeSelector({
onClick={() => handleFeePoolSelect(FeeAmount.HIGH)}
>
<AutoColumn gap="sm" justify="flex-start">
<ResponsiveText>{t`1% fee`}</ResponsiveText>
<ResponsiveText>
<Trans>1% fee</Trans>
</ResponsiveText>
<TYPE.main fontWeight={400} fontSize="12px" textAlign="left">
{t`Best for exotic pairs.`}
<Trans>Best for exotic pairs.</Trans>
</TYPE.main>
</AutoColumn>
</ButtonRadioChecked>

4
src/components/PositionPreview/index.tsx
View File

@ -1,4 +1,4 @@
import React, { useState, useCallback, useContext } from 'react'
import React, { useState, useCallback, useContext, ReactNode } from 'react'
import { Position } from '@uniswap/v3-sdk'
import { LightCard } from 'components/Card'
import { AutoColumn } from 'components/Column'
@ -22,7 +22,7 @@ export const PositionPreview = ({
baseCurrencyDefault,
}: {
position: Position
title?: string
title?: ReactNode
inRange: boolean
baseCurrencyDefault?: Currency | undefined
}) => {

42
src/components/QuestionHelper/index.tsx
View File

@ -1,4 +1,4 @@
import React, { useCallback, useState } from 'react'
import React, { ReactNode, useCallback, useState } from 'react'
import styled from 'styled-components/macro'
import Tooltip from '../Tooltip'
@ -24,32 +24,11 @@ const QuestionWrapper = styled.div`
}
`
const LightQuestionWrapper = styled.div`
display: flex;
align-items: center;
justify-content: center;
padding: 0.2rem;
border: none;
background: none;
outline: none;
cursor: default;
border-radius: 36px;
width: 24px;
height: 24px;
background-color: rgba(255, 255, 255, 0.1);
color: ${({ theme }) => theme.white};
:hover,
:focus {
opacity: 0.7;
}
`
const QuestionMark = styled.span`
font-size: 14px;
`
export default function QuestionHelper({ text }: { text: string; size?: number }) {
export default function QuestionHelper({ text }: { text: ReactNode; size?: number }) {
const [show, setShow] = useState<boolean>(false)
const open = useCallback(() => setShow(true), [setShow])
@ -65,20 +44,3 @@ export default function QuestionHelper({ text }: { text: string; size?: number }
</span>
)
}
export function LightQuestionHelper({ text }: { text: string }) {
const [show, setShow] = useState<boolean>(false)
const open = useCallback(() => setShow(true), [setShow])
const close = useCallback(() => setShow(false), [setShow])
return (
<span style={{ marginLeft: 4 }}>
<Tooltip text={text} show={show}>
<LightQuestionWrapper onClick={open} onMouseEnter={open} onMouseLeave={close}>
<QuestionMark>?</QuestionMark>
</LightQuestionWrapper>
</Tooltip>
</span>
)
}

4
src/components/SearchModal/CommonBases.tsx
View File

@ -1,4 +1,4 @@
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import React from 'react'
import { Text } from 'rebass'
import { Currency } from '@uniswap/sdk-core'
@ -44,7 +44,7 @@ export default function CommonBases({
<Text fontWeight={500} fontSize={14}>
<Trans>Common bases</Trans>
</Text>
<QuestionHelper text={t`These tokens are commonly paired with other tokens.`} />
<QuestionHelper text={<Trans>These tokens are commonly paired with other tokens.</Trans>} />
</AutoRow>
<AutoRow gap="4px">
{bases.map((currency: Currency) => {

14
src/components/SearchModal/CurrencyList.tsx
View File

@ -1,4 +1,4 @@
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
import React, { CSSProperties, MutableRefObject, useCallback, useMemo } from 'react'
import { FixedSizeList } from 'react-window'
@ -133,7 +133,11 @@ function CurrencyRow({
{currency.symbol}
</Text>
<TYPE.darkGray ml="0px" fontSize={'12px'} fontWeight={300}>
{currency.name} {!currency.isNative && !isOnSelectedList && customAdded && '• ' + t`Added by user`}
{!currency.isNative && !isOnSelectedList && customAdded ? (
<Trans>{currency.name} • Added by user</Trans>
) : (
currency.name
)}
</TYPE.darkGray>
</Column>
<TokenTags currency={currency} />
@ -163,7 +167,11 @@ function BreakLineComponent({ style }: { style: CSSProperties }) {
</TYPE.main>
</RowFixed>
<QuestionHelper
text={t`Tokens from inactive lists. Import specific tokens below or click 'Manage' to activate more lists.`}
text={
<Trans>
Tokens from inactive lists. Import specific tokens below or click Manage to activate more lists.
</Trans>
}
/>
</RowBetween>
</LightGreyCard>

6
src/components/Settings/index.tsx
View File

@ -199,7 +199,9 @@ export default function SettingsTab({ placeholderSlippage }: { placeholderSlippa
<Trans>Toggle Expert Mode</Trans>
</TYPE.black>
<QuestionHelper
text={t`Allow high price impact trades and skip the confirm screen. Use at your own risk.`}
text={
<Trans>Allow high price impact trades and skip the confirm screen. Use at your own risk.</Trans>
}
/>
</RowFixed>
<Toggle
@ -223,7 +225,7 @@ export default function SettingsTab({ placeholderSlippage }: { placeholderSlippa
<TYPE.black fontWeight={400} fontSize={14} color={theme.text2}>
<Trans>Disable Multihops</Trans>
</TYPE.black>
<QuestionHelper text={t`Restricts swaps to direct pairs only.`} />
<QuestionHelper text={<Trans>Restricts swaps to direct pairs only.</Trans>} />
</RowFixed>
<Toggle
id="toggle-disable-multihop-button"

6
src/components/Tooltip/index.tsx
View File

@ -1,4 +1,4 @@
import React, { useCallback, useState } from 'react'
import React, { ReactNode, useCallback, useState } from 'react'
import styled from 'styled-components/macro'
import Popover, { PopoverProps } from '../Popover'
@ -10,11 +10,11 @@ const TooltipContainer = styled.div`
`
interface TooltipProps extends Omit<PopoverProps, 'content'> {
text: string
text: ReactNode
}
interface TooltipContentProps extends Omit<PopoverProps, 'content'> {
content: React.ReactNode
content: ReactNode
}
export default function Tooltip({ text, ...rest }: TooltipProps) {

12
src/components/TransactionConfirmationModal/index.tsx
View File

@ -1,5 +1,5 @@
import { Currency } from '@uniswap/sdk-core'
import React, { useContext } from 'react'
import React, { ReactNode, useContext } from 'react'
import styled, { ThemeContext } from 'styled-components'
import { getExplorerLink, ExplorerDataType } from '../../utils/getExplorerLink'
import Modal from '../Modal'
@ -45,7 +45,7 @@ export function ConfirmationPendingContent({
inline,
}: {
onDismiss: () => void
pendingText: string
pendingText: ReactNode
inline?: boolean // not in modal
}) {
return (
@ -153,10 +153,10 @@ export function ConfirmationModalContent({
onDismiss,
topContent,
}: {
title: string
title: ReactNode
onDismiss: () => void
topContent: () => React.ReactNode
bottomContent?: () => React.ReactNode | undefined
topContent: () => ReactNode
bottomContent?: () => ReactNode | undefined
}) {
return (
<Wrapper>
@ -212,7 +212,7 @@ interface ConfirmationModalProps {
hash: string | undefined
content: () => React.ReactNode
attemptingTxn: boolean
pendingText: string
pendingText: React.ReactNode
currencyToAdd?: Currency | undefined
}

16
src/components/TransactionSettings/index.tsx
View File

@ -159,7 +159,9 @@ export default function TransactionSettings({ placeholderSlippage }: Transaction
<Trans>Slippage tolerance</Trans>
</TYPE.black>
<QuestionHelper
text={t`Your transaction will revert if the price changes unfavorably by more than this percentage.`}
text={
<Trans>Your transaction will revert if the price changes unfavorably by more than this percentage.</Trans>
}
/>
</RowFixed>
<RowBetween>
@ -208,11 +210,13 @@ export default function TransactionSettings({ placeholderSlippage }: Transaction
color: slippageError ? 'red' : '#F3841E',
}}
>
{slippageError
? t`Enter a valid slippage percentage`
: tooLow
? t`Your transaction may fail`
: t`Your transaction may be frontrun`}
{slippageError ? (
<Trans>Enter a valid slippage percentage</Trans>
) : tooLow ? (
<Trans>Your transaction may fail</Trans>
) : (
<Trans>Your transaction may be frontrun</Trans>
)}
</RowBetween>
) : null}
</AutoColumn>

4
src/components/WalletModal/index.tsx
View File

@ -16,7 +16,7 @@ import { ApplicationModal } from '../../state/application/actions'
import { useModalOpen, useWalletModalToggle } from '../../state/application/hooks'
import { ExternalLink, TYPE } from '../../theme'
import AccountDetails from '../AccountDetails'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import Modal from '../Modal'
import Option from './Option'
@ -240,7 +240,7 @@ export default function WalletModal({
id={`connect-${key}`}
key={key}
color={'#E8831D'}
header={t`Install Metamask`}
header={<Trans>Install Metamask</Trans>}
subheader={null}
link={'https://metamask.io/'}
icon={MetamaskIcon}

2
src/components/Web3Status/index.tsx
View File

@ -204,7 +204,7 @@ function Web3StatusInner() {
return (
<Web3StatusError onClick={toggleWalletModal}>
<NetworkIcon />
<Text>{error instanceof UnsupportedChainIdError ? t`Wrong Network` : t`Error`}</Text>
<Text>{error instanceof UnsupportedChainIdError ? <Trans>Wrong Network</Trans> : <Trans>Error</Trans>}</Text>
</Web3StatusError>
)
} else {

4
src/components/vote/DelegateModal.tsx
View File

@ -1,4 +1,4 @@
import React, { useState } from 'react'
import React, { ReactNode, useState } from 'react'
import { UNI } from '../../constants/tokens'
import Modal from '../Modal'
@ -38,7 +38,7 @@ const TextButton = styled.div`
interface VoteModalProps {
isOpen: boolean
onDismiss: () => void
title: string
title: ReactNode
}
export default function DelegateModal({ isOpen, onDismiss, title }: VoteModalProps) {

6
src/pages/AddLiquidity/index.tsx
View File

@ -473,7 +473,11 @@ export default function AddLiquidity({
)}
{hasExistingPosition && existingPosition ? (
<PositionPreview position={existingPosition} title={t`Selected Range`} inRange={!outOfRange} />
<PositionPreview
position={existingPosition}
title={<Trans>Selected Range</Trans>}
inRange={!outOfRange}
/>
) : (
<>
<FeeSelector

2
src/pages/AddLiquidityV2/index.tsx
View File

@ -320,7 +320,7 @@ export default function AddLiquidity({
hash={txHash}
content={() => (
<ConfirmationModalContent
title={noLiquidity ? t`You are creating a pool` : t`You will receive`}
title={noLiquidity ? <Trans>You are creating a pool</Trans> : <Trans>You will receive</Trans>}
onDismiss={handleDismissConfirmation}
topContent={modalHeader}
bottomContent={modalBottom}

8
src/pages/MigrateV2/MigrateV2Pair.tsx
View File

@ -1,5 +1,5 @@
import JSBI from 'jsbi'
import React, { useCallback, useMemo, useState, useEffect } from 'react'
import React, { useCallback, useMemo, useState, useEffect, ReactNode } from 'react'
import { Fraction, Percent, Price, Token, CurrencyAmount, WETH9 } from '@uniswap/sdk-core'
import { FACTORY_ADDRESS } from '@uniswap/v2-sdk'
import { Redirect, RouteComponentProps } from 'react-router'
@ -34,7 +34,7 @@ import { TransactionResponse } from '@ethersproject/providers'
import { useIsTransactionPending, useTransactionAdder } from 'state/transactions/hooks'
import { useV3DerivedMintInfo, useRangeHopCallbacks, useV3MintActionHandlers } from 'state/mint/v3/hooks'
import { Bound, resetMintState } from 'state/mint/v3/actions'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import { AlertCircle, AlertTriangle, ArrowDown } from 'react-feather'
import FeeSelector from 'components/FeeSelector'
import RangeSelector from 'components/RangeSelector'
@ -54,7 +54,7 @@ const ZERO = JSBI.BigInt(0)
const DEFAULT_MIGRATE_SLIPPAGE_TOLERANCE = new Percent(75, 10_000)
function EmptyState({ message }: { message: string }) {
function EmptyState({ message }: { message: ReactNode }) {
return (
<AutoColumn style={{ minHeight: 200, justifyContent: 'center', alignItems: 'center' }}>
<TYPE.body>{message}</TYPE.body>
@ -750,7 +750,7 @@ export default function MigrateV2Pair({
token1={token1}
/>
) : (
<EmptyState message={t`Loading`} />
<EmptyState message={<Trans>Loading</Trans>} />
)}
</AutoColumn>
</BodyWrapper>

4
src/pages/MigrateV2/index.tsx
View File

@ -18,7 +18,7 @@ import MigrateSushiPositionCard from 'components/PositionCard/Sushi'
import { PairState, useV2Pairs } from 'hooks/useV2Pairs'
import { getCreate2Address } from '@ethersproject/address'
import { pack, keccak256 } from '@ethersproject/solidity'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
function EmptyState({ message }: { message: ReactNode }) {
return (
@ -115,7 +115,7 @@ export default function MigrateV2() {
<Trans>Migrate V2 Liquidity</Trans>
</TYPE.mediumHeader>
<div>
<QuestionHelper text={t`Migrate your liquidity tokens from Uniswap V2 to Uniswap V3.`} />
<QuestionHelper text={<Trans>Migrate your liquidity tokens from Uniswap V2 to Uniswap V3.</Trans>} />
</div>
</AutoRow>

6
src/pages/Pool/PositionPage.tsx
View File

@ -19,7 +19,7 @@ import Badge from 'components/Badge'
import { ButtonConfirmed, ButtonPrimary, ButtonGray } from 'components/Button'
import { DarkCard, LightCard } from 'components/Card'
import CurrencyLogo from 'components/CurrencyLogo'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
import { currencyId } from 'utils/currencyId'
import { formatCurrencyAmount } from 'utils/formatCurrencyAmount'
import { useV3PositionFees } from 'hooks/useV3PositionFees'
@ -503,12 +503,12 @@ export function PositionPage({
hash={collectMigrationHash ?? ''}
content={() => (
<ConfirmationModalContent
title={t`Claim fees`}
title={<Trans>Claim fees</Trans>}
onDismiss={() => setShowConfirm(false)}
topContent={modalHeader}
/>
)}
pendingText={t`Collecting fees`}
pendingText={<Trans>Collecting fees</Trans>}
/>
<AutoColumn gap="md">
<AutoColumn gap="sm">

2
src/pages/RemoveLiquidity/V3.tsx
View File

@ -261,7 +261,7 @@ function Remove({ tokenId }: { tokenId: BigNumber }) {
hash={txnHash ?? ''}
content={() => (
<ConfirmationModalContent
title={t`Remove Liquidity`}
title={<Trans>Remove Liquidity</Trans>}
onDismiss={handleDismissConfirmation}
topContent={modalHeader}
/>

2
src/pages/RemoveLiquidity/index.tsx
View File

@ -432,7 +432,7 @@ export default function RemoveLiquidity({
hash={txHash ? txHash : ''}
content={() => (
<ConfirmationModalContent
title={t`You will receive`}
title={<Trans>You will receive</Trans>}
onDismiss={handleDismissConfirmation}
topContent={modalHeader}
bottomContent={modalBottom}

17
src/pages/Swap/index.tsx
View File

@ -55,7 +55,7 @@ import { isTradeBetter } from '../../utils/isTradeBetter'
import { maxAmountSpend } from '../../utils/maxAmountSpend'
import { warningSeverity } from '../../utils/prices'
import AppBody from '../AppBody'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
const StyledInfo = styled(Info)`
opacity: 0.4;
@ -377,7 +377,9 @@ export default function Swap({ history }: RouteComponentProps) {
<AutoColumn gap={'md'}>
<div style={{ display: 'relative' }}>
<CurrencyInputPanel
label={independentField === Field.OUTPUT && !showWrap ? t`From (at most)` : t`From`}
label={
independentField === Field.OUTPUT && !showWrap ? <Trans>From (at most)</Trans> : <Trans>From</Trans>
}
value={formattedAmounts[Field.INPUT]}
showMaxButton={showMaxButton}
currency={currencies[Field.INPUT]}
@ -402,7 +404,7 @@ export default function Swap({ history }: RouteComponentProps) {
<CurrencyInputPanel
value={formattedAmounts[Field.OUTPUT]}
onUserInput={handleTypeOutput}
label={independentField === Field.INPUT && !showWrap ? t`To (at least)` : t`To`}
label={independentField === Field.INPUT && !showWrap ? <Trans>To (at least)</Trans> : <Trans>To</Trans>}
showMaxButton={false}
hideBalance={false}
fiatValue={fiatValueOutput ?? undefined}
@ -572,9 +574,12 @@ export default function Swap({ history }: RouteComponentProps) {
<CheckCircle size="20" color={theme.green1} />
) : (
<MouseoverTooltip
text={t`You must give the Uniswap smart contracts permission to use your ${
currencies[Field.INPUT]?.symbol
}. You only have to do this once per token.`}
text={
<Trans>
You must give the Uniswap smart contracts permission to use your{' '}
{currencies[Field.INPUT]?.symbol}. You only have to do this once per token.
</Trans>
}
>
<HelpCircle size="20" color={'white'} style={{ marginLeft: '8px' }} />
</MouseoverTooltip>

2
src/pages/Vote/VotePage.tsx
View File

@ -201,7 +201,7 @@ export default function VotePage({
return (
<PageWrapper gap="lg" justify="center">
<VoteModal isOpen={showVoteModal} onDismiss={toggleVoteModal} proposalId={proposalData?.id} support={support} />
<DelegateModal isOpen={showDelegateModal} onDismiss={toggleDelegateModal} title={t`Unlock Votes`} />
<DelegateModal isOpen={showDelegateModal} onDismiss={toggleDelegateModal} title={<Trans>Unlock Votes</Trans>} />
<ProposalInfo gap="lg" justify="start">
<RowBetween style={{ width: '100%' }}>
<ArrowWrapper to="/vote">

4
src/pages/Vote/index.tsx
View File

@ -29,7 +29,7 @@ import Loader from '../../components/Loader'
import FormattedCurrencyAmount from '../../components/FormattedCurrencyAmount'
import { useModalOpen, useToggleDelegateModal } from '../../state/application/hooks'
import { ApplicationModal } from '../../state/application/actions'
import { t, Trans } from '@lingui/macro'
import { Trans } from '@lingui/macro'
const PageWrapper = styled(AutoColumn)``
@ -139,7 +139,7 @@ export default function Vote() {
<DelegateModal
isOpen={showDelegateModal}
onDismiss={toggleDelegateModal}
title={showUnlockVoting ? t`Unlock Votes` : t`Update Delegation`}
title={showUnlockVoting ? <Trans>Unlock Votes</Trans> : <Trans>Update Delegation</Trans>}
/>
<TopSection gap="md">
<VoteCard>