@@ -73,7 +76,7 @@ function SafeNFTs({ web3, address }) {
sender={address}
initialState={{
assetType: ASSET_TYPES.NFT,
- selectedNFT: token,
+ selectedNFT: { ...token, collectionName: collectionId },
transactionType: TRANSACTION_TYPE.SEND,
}}
/>
@@ -105,14 +108,15 @@ function SafeNFTs({ web3, address }) {
);
} else {
nftsToDisplay.forEach((collection) => {
+ const { collectionName, tokens } = collection;
assetComponents.push(
- {signersAmount} of{Math.max(safeOwners.length, 1)} owner(s)
+ {signersAmount} of {Math.max(safeOwners.length, 1)} owner(s)
{
const modalContext = useModalContext();
diff --git a/packages/client/src/modals/ApprovalRequired.js b/packages/client/src/modals/ApprovalRequired.js
new file mode 100644
index 0000000..e214ea6
--- /dev/null
+++ b/packages/client/src/modals/ApprovalRequired.js
@@ -0,0 +1,99 @@
+import ProposedDateView from 'components/Actions/components/ProposedDateView';
+import SentFromToView from 'components/Actions/components/SentFromToView';
+import Signatures from 'components/Signatures';
+import { useContacts } from 'hooks';
+import { ACTION_TYPES } from 'constants/enums';
+import BannerInfo from './Transaction/BannerInfo';
+
+const ApprovalRequired = ({
+ safeData,
+ actionView,
+ confirmations,
+ onReject,
+ onApprove,
+}) => {
+ const { type: actionType, newThreshold } = actionView;
+ const { contacts } = useContacts(safeData.address);
+
+ let title;
+ switch (actionType) {
+ case ACTION_TYPES.TRANSFER_TOKEN:
+ title = 'Amount';
+ break;
+
+ case ACTION_TYPES.ADD_SIGNER_UPDATE_THRESHOLD:
+ title = 'New Owner';
+ break;
+ case ACTION_TYPES.REMOVE_SIGNER_UPDATE_THRESHOLD:
+ title = 'Remove Owner';
+ break;
+ case ACTION_TYPES.UPDATE_THRESHOLD:
+ title = 'Signature Threshold';
+ break;
+ case ACTION_TYPES.TRANSFER_NFT:
+ default:
+ break;
+ }
+
+ return (
+
+
+
{title}
+
+
+ {actionType === ACTION_TYPES.TRANSFER_NFT ||
+ (actionType === ACTION_TYPES.TRANSFER_TOKEN && (
+
+ ))}
+ {actionType === ACTION_TYPES.ADD_SIGNER_UPDATE_THRESHOLD ||
+ (actionType === ACTION_TYPES.REMOVE_SIGNER_UPDATE_THRESHOLD && (
+
+
+ Signature Threshold
+
+
+
+ {newThreshold} of {safeData.safeOwners.length} owner(s)
+
+
+
+ ))}
+
+
+
+
+ To complete this action, you will have to confirm it with your
+ connected wallet on the next step.
+
+
+
+
+
+
+
+ );
+};
+export default ApprovalRequired;
diff --git a/packages/client/src/modals/Transaction/BannerInfo.js b/packages/client/src/modals/Transaction/BannerInfo.js
index 15e84e4..5bc6087 100644
--- a/packages/client/src/modals/Transaction/BannerInfo.js
+++ b/packages/client/src/modals/Transaction/BannerInfo.js
@@ -15,10 +15,19 @@ const BannerInfo = ({
contacts = {},
signers = [],
}) => {
- const { getAccountNFTReference } = useContext(Web3Context);
+ const { getAccountNFTReference, getTreasuryNFTReference } =
+ useContext(Web3Context);
const [nftMeta, setNFTMeta] = useState();
- const { recipient, nftId, collectionId, vaultId, tokenAmount, signerAddr } =
- actionData;
+ const {
+ recipient,
+ nftId,
+ collectionId,
+ vaultId,
+ tokenAmount,
+ signerAddr,
+ newThreshold,
+ txID,
+ } = actionData;
const { displayName, tokenType } = getTokenMeta(vaultId);
const { contractName: NFTName, contractAddress: NFTAddress } =
parseIdentifier(collectionId);
@@ -29,12 +38,27 @@ const BannerInfo = ({
useEffect(() => {
if (actionType === ACTION_TYPES.TRANSFER_NFT) {
const getNFTMeta = async () => {
- const result = await getAccountNFTReference(
- NFTName,
- formatAddress(NFTAddress),
- recipient,
- nftId
- );
+ let result;
+
+ // When the action needs to be approved or rejected, the NFT is in the treasury
+ // When transaction is done (txID is defined), the NFT will be located on the account
+ if (txID) {
+ result = await getAccountNFTReference(
+ NFTName,
+ formatAddress(NFTAddress),
+ recipient,
+ nftId
+ );
+ } else {
+ result = await getTreasuryNFTReference(
+ NFTName,
+ formatAddress(NFTAddress),
+ collectionId,
+ recipient,
+ nftId
+ );
+ }
+
setNFTMeta(result ?? {});
};
getNFTMeta().catch(console.error);
@@ -45,7 +69,7 @@ const BannerInfo = ({
NFTAddress,
nftId,
recipient,
- getAccountNFTReference,
+ getTreasuryNFTReference,
]);
const contactName = getNameByAddress(contacts, signerAddr);
@@ -58,7 +82,7 @@ const BannerInfo = ({
)}
@@ -71,7 +95,7 @@ const BannerInfo = ({
)}
{actionType === ACTION_TYPES.TRANSFER_TOKEN && (
<>
-
+
{Number(tokenAmount).toLocaleString()}
@@ -96,7 +120,7 @@ const BannerInfo = ({
{actionType === ACTION_TYPES.UPDATE_THRESHOLD && (
- {signers.length} of{newThreshold} owners
+ {signers.length} of {newThreshold} owners
)}
diff --git a/packages/client/src/modals/Transaction/Details.js b/packages/client/src/modals/Transaction/Details.js
index 57acab1..79e64b6 100644
--- a/packages/client/src/modals/Transaction/Details.js
+++ b/packages/client/src/modals/Transaction/Details.js
@@ -96,7 +96,7 @@ const TransactionDetails = ({ onClose, safeData = {}, transaction = {} }) => {
Signature Threshold
- {Object.keys(signers).length} of{threshold} owners
+ {threshold} of {Object.keys(signers).length} owners
)}
diff --git a/packages/client/src/pages/LoadSafe.js b/packages/client/src/pages/LoadSafe.js
index ca0a201..ece244c 100644
--- a/packages/client/src/pages/LoadSafe.js
+++ b/packages/client/src/pages/LoadSafe.js
@@ -241,7 +241,7 @@ function LoadSafe({ web3 }) {
- {threshold} of{safeOwners.length} owner(s)
+ {threshold} of {safeOwners.length} owner(s)