status-im/safe-react
2
0
Fork 0
mirror of https://github.com/status-im/safe-react.git synced 2025-02-18 12:36:34 +00:00
Code Issues Projects Releases Wiki Activity

Spending limit UI corrections (#2210)

Browse Source 
* show the complete hash

* remove cut address (beneficiary)
This commit is contained in:
Agustín Longoni 2021-05-03 06:58:18 -03:00 committed by GitHub
parent 6dd3a781a6
commit 84755f9098
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 38 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/logic/notifications/notificationTypes.ts
View File

@ -141,45 +141,45 @@ export const NOTIFICATIONS: Record<NotificationId, Notification> = {
options: { variant: ERROR, persist: false, autoHideDuration: shortDuration },
},
// Spending Limit
// Spending limit
SIGN_NEW_SPENDING_LIMIT_MSG: {
message: 'Please sign the new Spending Limit',
message: 'Please sign the new spending limit',
options: { variant: INFO, persist: true },
},
NEW_SPENDING_LIMIT_REJECTED_MSG: {
message: 'New Spending Limit rejected',
message: 'New spending limit rejected',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},
NEW_SPENDING_LIMIT_EXECUTED_MSG: {
message: 'New Spending Limit successfully executed',
message: 'New spending limit successfully executed',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
NEW_SPENDING_LIMIT_EXECUTED_MORE_CONFIRMATIONS_MSG: {
message: 'New Spending Limit successfully created. More confirmations needed to execute',
message: 'New spending limit successfully created. More confirmations needed to execute',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
NEW_SPENDING_LIMIT_FAILED_MSG: {
message: 'New Spending Limit failed',
message: 'New spending limit failed',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},
SIGN_REMOVE_SPENDING_LIMIT_MSG: {
message: 'Please sign the remove Spending Limit',
message: 'Please sign the remove Spending limit',
options: { variant: INFO, persist: true },
},
REMOVE_SPENDING_LIMIT_REJECTED_MSG: {
message: 'Remove Spending Limit rejected',
message: 'Remove spending limit rejected',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},
REMOVE_SPENDING_LIMIT_EXECUTED_MSG: {
message: 'Remove Spending Limit successfully executed',
message: 'Remove spending limit successfully executed',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
REMOVE_SPENDING_LIMIT_EXECUTED_MORE_CONFIRMATIONS_MSG: {
message: 'Remove Spending Limit successfully created. More confirmations needed to execute',
message: 'Remove spending limit successfully created. More confirmations needed to execute',
options: { variant: SUCCESS, persist: false, autoHideDuration: longDuration },
},
REMOVE_SPENDING_LIMIT_FAILED_MSG: {
message: 'Remove Spending Limit failed',
message: 'Remove spending limit failed',
options: { variant: ERROR, persist: false, autoHideDuration: longDuration },
},

4
src/routes/safe/components/Balances/SendModal/screens/SendFunds/SpendingLimitRow.tsx
View File

@ -43,9 +43,9 @@ export const SpendingLimitRow = ({ tokenSpendingLimit, selectedToken }: Spending
value={value || 'multiSig'}
onRadioChange={mutators.setTxType}
options={[
{ label: 'Multisig Transaction', value: 'multiSig' },
{ label: 'Multisig transaction', value: 'multiSig' },
{
label: `Spending Limit Transaction (${availableAmount} ${selectedToken.symbol})`,
label: `Spending limit transaction (${availableAmount} ${selectedToken.symbol})`,
value: 'spendingLimit',
},
]}

1
src/routes/safe/components/Settings/SpendingLimit/FormFields/Beneficiary.tsx
View File

@ -83,7 +83,6 @@ const Beneficiary = (): ReactElement => {
showCopyBtn
showAvatar
textSize="lg"
shortenHash={4}
explorerUrl={getExplorerInfo(selectedEntry.address)}
/>
</BeneficiaryInput>

4
src/routes/safe/components/Settings/SpendingLimit/InfoDisplay/AddressInfo.tsx
View File

@ -10,11 +10,10 @@ import DataDisplay from './DataDisplay'
interface AddressInfoProps {
address: string
cut?: number
title?: string
}
const AddressInfo = ({ address, cut = 4, title }: AddressInfoProps): ReactElement => {
const AddressInfo = ({ address, title }: AddressInfoProps): ReactElement => {
const name = useSelector((state) => getNameFromAddressBookSelector(state, address))
const explorerUrl = getExplorerInfo(address)
@ -27,7 +26,6 @@ const AddressInfo = ({ address, cut = 4, title }: AddressInfoProps): ReactElemen
showAvatar
textSize="lg"
explorerUrl={explorerUrl}
shortenHash={cut}
/>
</DataDisplay>
)

2
src/routes/safe/components/Settings/SpendingLimit/LimitsTable/index.tsx
View File

@ -53,7 +53,7 @@ export const LimitsTable = ({ data }: SpendingLimitTableProps): ReactElement =>
defaultFixed
defaultOrderBy={SPENDING_LIMIT_TABLE_BENEFICIARY_ID}
defaultRowsPerPage={5}
label="Spending Limits"
label="Spending limits"
noBorder
size={data?.length}
>

2
src/routes/safe/components/Settings/SpendingLimit/NewLimitModal/Create.tsx
View File

@ -49,7 +49,7 @@ const Create = ({ initialValues, onCancel, onReview }: NewSpendingLimitProps): R
<Modal.Header onClose={onCancel}>
<Modal.Header.Title size="xs" withoutMargin>
<>
New Spending Limit
New spending limit
<Text size="lg" color="secondaryLight" as="span">
1 of 2
</Text>

2
src/routes/safe/components/Settings/SpendingLimit/NewLimitModal/Review.tsx
View File

@ -249,7 +249,7 @@ export const ReviewSpendingLimits = ({ onBack, onClose, txToken, values }: Revie
<>
<Modal.Header onClose={onClose}>
<Modal.Header.Title size="xs" withoutMargin>
New Spending Limit
New spending limit
<Text size="lg" color="secondaryLight" as="span">
2 of 2
</Text>

2
src/routes/safe/components/Settings/SpendingLimit/NewLimitModal/index.tsx
View File

@ -94,7 +94,7 @@ export const NewLimitModal = ({ close, open }: SpendingLimitModalProps): ReactEl
<Modal
handleClose={close}
open={open}
title="New Spending Limit"
title="New spending limit"
description="set rules for specific beneficiaries to access funds from this Safe without having to collect all signatures"
>
{step === CREATE && <Create initialValues={values} onCancel={close} onReview={handleReview} />}

6
src/routes/safe/components/Settings/SpendingLimit/RemoveLimitModal.tsx
View File

@ -116,8 +116,8 @@ export const RemoveLimitModal = ({ onClose, spendingLimit, open }: RemoveSpendin
<Modal
handleClose={onClose}
open={open}
title="Remove Spending Limit"
description="Remove the selected Spending Limit"
title="Remove spending limit"
description="Remove the selected spending limit"
>
<EditableTxParameters
isOffChainSignature={isOffChainSignature}
@ -132,7 +132,7 @@ export const RemoveLimitModal = ({ onClose, spendingLimit, open }: RemoveSpendin
<>
<Modal.Header onClose={onClose}>
<Modal.Header.Title size="xs" withoutMargin>
Remove Spending Limit
Remove spending limit
</Modal.Header.Title>
</Modal.Header>

2
src/routes/safe/components/Settings/SpendingLimit/index.tsx
View File

@ -37,7 +37,7 @@ export const SpendingLimitSettings = (): ReactElement => {
<>
<Block className={classes.container} grow="grow">
<Title size="xs" withoutMargin>
Spending Limit
Spending limit
</Title>
<InfoText size="lg">
You can set rules for specific beneficiaries to access funds from this Safe without having to collect all

2
src/routes/safe/components/Settings/index.tsx
View File

@ -125,7 +125,7 @@ const Settings: React.FC = () => {
iconSize="sm"
textSize="xl"
iconType="fuelIndicator"
text="Spending Limit"
text="Spending limit"
color={menuOptionIndex === 4 ? 'primary' : 'secondary'}
/>
</Row>

22
src/routes/safe/components/Transactions/TxList/SpendingLimitDetails.tsx
View File

@ -12,9 +12,17 @@ import { AddressInfo, ResetTimeInfo, TokenInfo } from 'src/routes/safe/component
const SET_ALLOWANCE = 'setAllowance'
const DELETE_ALLOWANCE = 'deleteAllowance'
export const isSetAllowance = (method?: string) => sameString(method, SET_ALLOWANCE)
export const isDeleteAllowance = (method?: string) => sameString(method, DELETE_ALLOWANCE)
export const isSpendingLimitMethod = (method?: string) => isSetAllowance(method) || isDeleteAllowance(method)
export const isSetAllowance = (method?: string): boolean => {
return sameString(method, SET_ALLOWANCE)
}
export const isDeleteAllowance = (method?: string): boolean => {
return sameString(method, DELETE_ALLOWANCE)
}
export const isSpendingLimitMethod = (method?: string): boolean => {
return isSetAllowance(method) || isDeleteAllowance(method)
}
const SpendingLimitRow = styled.div`
margin-bottom: 16px;
@ -37,11 +45,11 @@ export const ModifySpendingLimitDetails = ({ data }: { data: DataDecoded }): Rea
<>
<SpendingLimitRow>
<Text size="xl" strong>
Modify Spending Limit:
Modify spending limit:
</Text>
</SpendingLimitRow>
<SpendingLimitRow>
<AddressInfo title="Beneficiary" address={beneficiary} cut={0} />
<AddressInfo title="Beneficiary" address={beneficiary} />
</SpendingLimitRow>
<SpendingLimitRow>
{tokenInfo && <TokenInfo amount={fromTokenUnit(amount, tokenInfo.decimals)} title="Amount" token={tokenInfo} />}
@ -63,11 +71,11 @@ export const DeleteSpendingLimitDetails = ({ data }: { data: DataDecoded }): Rea
<>
<SpendingLimitRow>
<Text size="xl" strong>
Delete Spending Limit:
Delete spending limit:
</Text>
</SpendingLimitRow>
<SpendingLimitRow>
<AddressInfo title="Beneficiary" address={beneficiary} cut={0} />
<AddressInfo title="Beneficiary" address={beneficiary} />
</SpendingLimitRow>
<SpendingLimitRow>{tokenInfo && <TokenInfo amount="" title="Token" token={tokenInfo} />}</SpendingLimitRow>
</>