Skip to content

Commit

Permalink
Refactor acceptNFTOffer messaging
Browse files Browse the repository at this point in the history
  • Loading branch information
@ThibautBremand
ThibautBremand committed Oct 18, 2023
1 parent abc5e85 commit ee1e291
Show file tree
Hide file tree
Showing 4 changed files with 96 additions and 47 deletions.
4 changes: 0 additions & 4 deletions packages/api/src/helpers/extensionMessaging.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,10 +100,6 @@ const serializeMessage = (msg: APIMessages): any => {
modifiedMsg.payload.takerPays = JSON.stringify(modifiedMsg.payload.takerPays);
}

if (typeof modifiedMsg.payload?.NFTokenBrokerFee === 'object') {
modifiedMsg.payload.NFTokenBrokerFee = JSON.stringify(modifiedMsg.payload.NFTokenBrokerFee);
}

if (modifiedMsg.payload?.NFTokenOffers) {
modifiedMsg.payload.NFTokenOffers = JSON.stringify(modifiedMsg.payload.NFTokenOffers);
}
Expand Down
77 changes: 58 additions & 19 deletions packages/extension/cypress/e2e/NFT.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ import { navigate } from '../utils/navigation';

// deepcode ignore NoHardcodedPasswords: password used for testing purposes
const PASSWORD = 'SECRET_PASSWORD';
const STORAGE_KEY = '1693425372955.3833';

describe('Mint', () => {
const MINT_NFT_URL =
'http://localhost:3000?mint-nft&storageKey=1693425372955.3833&id=210401976&requestMessage=undefined&transaction=mintNFT';
const MINT_NFT_URL = `http://localhost:3000?mint-nft&storageKey=${STORAGE_KEY}&id=210401976&requestMessage=undefined&transaction=mintNFT`;

const params = {
fee: '199',
Expand Down Expand Up @@ -47,7 +47,7 @@ describe('Mint', () => {
});

it('Mint NFT', () => {
navigate(MINT_NFT_URL, PASSWORD, '1693425372955.3833', params);
navigate(MINT_NFT_URL, PASSWORD, STORAGE_KEY, params);

cy.get('h1[data-testid="page-title"]').should('have.text', 'Mint NFT');

Expand Down Expand Up @@ -229,9 +229,22 @@ describe('Mint', () => {
});

it('Accept NFT Offer', function () {
const url = `http://localhost:3000?NFTokenSellOffer=${this.OfferID}&fee=199&memos=%5B%7B%22memo%22%3A%7B%22memoType%22%3A%224465736372697074696f6e%22%2C%22memoData%22%3A%2254657374206d656d6f%22%7D%7D%5D&id=210325959&requestMessage=undefined&transaction=acceptNFTOffer`;
const url = `http://localhost:3000?accept-nft-offer&storageKey=${STORAGE_KEY}&id=210402654&requestMessage=undefined&transaction=acceptNFTOffer`;

const params = {
NFTokenSellOffer: this.OfferID,
fee: '199',
memos: [
{
memo: {
memoType: '4465736372697074696f6e',
memoData: '54657374206d656d6f'
}
}
]
};

navigate(url, PASSWORD);
navigate(url, PASSWORD, STORAGE_KEY, params);

// Confirm
cy.get('h1[data-testid="page-title"]').should('have.text', 'Accept NFT Offer');
Expand All @@ -255,14 +268,27 @@ describe('Mint', () => {
});

it('Accept NFT Offer (Brokered, SOLO non hex)', function () {
const amount = JSON.stringify({
currency: 'SOLO',
issuer: 'rHZwvHEs56GCmHupwjA4RY7oPA3EoAJWuN',
value: '0.1'
});
const url = `http://localhost:3000?NFTokenBrokerFee=${amount}&NFTokenSellOffer=${this.OfferID}&fee=199&memos=%5B%7B%22memo%22%3A%7B%22memoType%22%3A%224465736372697074696f6e%22%2C%22memoData%22%3A%2254657374206d656d6f%22%7D%7D%5D&id=210325959&requestMessage=undefined&transaction=acceptNFTOffer`;
const url = `http://localhost:3000?accept-nft-offer&storageKey=${STORAGE_KEY}&id=210402654&requestMessage=undefined&transaction=acceptNFTOffer`;

const params = {
NFTokenSellOffer: this.OfferID,
fee: '199',
memos: [
{
memo: {
memoType: '4465736372697074696f6e',
memoData: '54657374206d656d6f'
}
}
],
NFTokenBrokerFee: {
currency: 'SOLO',
issuer: 'rHZwvHEs56GCmHupwjA4RY7oPA3EoAJWuN',
value: '0.1'
}
};

navigate(url, PASSWORD);
navigate(url, PASSWORD, STORAGE_KEY, params);

// Confirm
cy.get('h1[data-testid="page-title"]').should('have.text', 'Accept NFT Offer');
Expand All @@ -283,14 +309,27 @@ describe('Mint', () => {
});

it('Accept NFT Offer (Brokered, SOLO hex)', function () {
const amount = JSON.stringify({
currency: '534F4C4F00000000000000000000000000000000',
issuer: 'rHZwvHEs56GCmHupwjA4RY7oPA3EoAJWuN',
value: '0.1'
});
const url = `http://localhost:3000?NFTokenBrokerFee=${amount}&NFTokenSellOffer=${this.OfferID}&fee=199&memos=%5B%7B%22memo%22%3A%7B%22memoType%22%3A%224465736372697074696f6e%22%2C%22memoData%22%3A%2254657374206d656d6f%22%7D%7D%5D&id=210325959&requestMessage=undefined&transaction=acceptNFTOffer`;
const url = `http://localhost:3000?accept-nft-offer&storageKey=${STORAGE_KEY}&id=210402654&requestMessage=undefined&transaction=acceptNFTOffer`;

const params = {
NFTokenSellOffer: this.OfferID,
fee: '199',
memos: [
{
memo: {
memoType: '4465736372697074696f6e',
memoData: '54657374206d656d6f'
}
}
],
NFTokenBrokerFee: {
currency: '534F4C4F00000000000000000000000000000000',
issuer: 'rHZwvHEs56GCmHupwjA4RY7oPA3EoAJWuN',
value: '0.1'
}
};

navigate(url, PASSWORD);
navigate(url, PASSWORD, STORAGE_KEY, params);

// Confirm
cy.get('h1[data-testid="page-title"]').should('have.text', 'Accept NFT Offer');
Expand Down
19 changes: 9 additions & 10 deletions packages/extension/src/chromeServices/background/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -324,16 +324,15 @@ chrome.runtime.onMessage.addListener(
}
});
} else if (type === 'REQUEST_ACCEPT_NFT_OFFER/V3') {
handleTransactionRequest({
payload: message.payload,
sender,
parameter: PARAMETER_TRANSACTION_ACCEPT_NFT_OFFER,
receivingMessage: 'RECEIVE_ACCEPT_NFT_OFFER/V3',
errorPayload: {
type: ResponseType.Reject,
result: undefined
}
});
const { payload } = message;
try {
sendInMemoryMessage({
payload,
parameter: PARAMETER_TRANSACTION_ACCEPT_NFT_OFFER,
receivingMessage: 'RECEIVE_ACCEPT_NFT_OFFER/V3',
sender
});
} catch (e) {}
} else if (type === 'REQUEST_BURN_NFT/V3') {
handleTransactionRequest({
payload: message.payload,
Expand Down
43 changes: 29 additions & 14 deletions packages/extension/src/components/pages/AcceptNFTOffer/AcceptNFTOffer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,14 @@ import { FC, useCallback, useEffect, useState } from 'react';
import { NFTokenAcceptOffer } from 'xrpl';

import {
AcceptNFTOfferRequest,
API_ERROR_BAD_REQUEST,
GEM_WALLET,
ReceiveAcceptNFTOfferBackgroundMessage,
ResponseType
} from '@gemwallet/constants';

import { STORAGE_MESSAGING_KEY } from '../../../constants';
import {
TransactionProgressStatus,
useLedger,
Expand All @@ -17,10 +19,9 @@ import {
useWallet
} from '../../../contexts';
import { buildNFTokenAcceptOffer } from '../../../contexts';
import { useFees, useTransactionStatus } from '../../../hooks';
import { useFees, useFetchFromSessionStorage, useTransactionStatus } from '../../../hooks';
import { TransactionStatus } from '../../../types';
import { parseAmount } from '../../../utils';
import { parseBaseParamsFromURLParamsNew } from '../../../utils/baseParams';
import { parseBaseParamsFromStoredData } from '../../../utils/baseParams';
import { serializeError } from '../../../utils/errors';
import { TransactionDetails } from '../../organisms';
import { TransactionPage } from '../../templates';
Expand Down Expand Up @@ -59,6 +60,14 @@ export const AcceptNFTOffer: FC = () => {
params.transaction?.Fee
);

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const { fetchedData } = useFetchFromSessionStorage(
urlParams.get(STORAGE_MESSAGING_KEY) ?? undefined
) as {
fetchedData: AcceptNFTOfferRequest | undefined;
};

const sendMessageToBackground = useCallback(
(message: ReceiveAcceptNFTOfferBackgroundMessage) => {
chrome.runtime.sendMessage(message);
Expand Down Expand Up @@ -115,26 +124,32 @@ export const AcceptNFTOffer: FC = () => {
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const id = Number(urlParams.get('id')) || 0;

// AcceptNFTOffer fields
const NFTokenSellOffer = urlParams.get('NFTokenSellOffer');
const NFTokenBuyOffer = urlParams.get('NFTokenBuyOffer');
const NFTokenBrokerFee = parseAmount(urlParams.get('NFTokenBrokerFee'), null, null, '');
const wallet = getCurrentWallet();

if (!NFTokenSellOffer && !NFTokenBuyOffer && !NFTokenBrokerFee) {
// At least one of the fields must be present
if (!wallet) {
setIsParamsMissing(true);
return;
}

if (!wallet) {
setIsParamsMissing(true);
if (!fetchedData) {
return;
}

const NFTokenSellOffer =
'NFTokenSellOffer' in fetchedData ? fetchedData.NFTokenSellOffer : undefined;
const NFTokenBuyOffer =
'NFTokenBuyOffer' in fetchedData ? fetchedData.NFTokenBuyOffer : undefined;
const NFTokenBrokerFee =
'NFTokenBrokerFee' in fetchedData ? fetchedData.NFTokenBrokerFee : undefined;

if (!NFTokenSellOffer && !NFTokenBuyOffer && !NFTokenBrokerFee) {
// At least one of the fields must be present
setIsParamsMissing(true);
}

const transaction = buildNFTokenAcceptOffer(
{
...parseBaseParamsFromURLParamsNew(urlParams),
...parseBaseParamsFromStoredData(fetchedData),
...(NFTokenSellOffer && { NFTokenSellOffer }),
...(NFTokenBuyOffer && { NFTokenBuyOffer }),
...(NFTokenBrokerFee && { NFTokenBrokerFee })
Expand All @@ -146,7 +161,7 @@ export const AcceptNFTOffer: FC = () => {
id,
transaction
});
}, [getCurrentWallet]);
}, [fetchedData, getCurrentWallet]);

const handleReject = useCallback(() => {
setTransaction(TransactionStatus.Rejected);
Expand Down

0 comments on commit ee1e291

Please sign in to comment.