[carbonmark] Pool purchase success - align Modal to figma design

[ladytrekker]

Description

Comment from this PR #1191
=> Replacing the Success Modal when "buying from pool" with actual static NEXTJS page (URL to be discussed)

Relevant subgraph:
https://thegraph.com/hosted-service/subgraph/klimadao/polygon-bridged-carbon

• Example query
• => missing: total price, project

Success Modal when "buying from pool"

Compare with Receipt PAGE when "Buying from Seller Listing"

• FIGMA

Temporary success screen while the transactions are finalizing...

Full receipt when "Buying from Seller Listing"**

Problem

When "Buying from a Seller Listing" the flow is as such:

The first screenshot above shows these checks on the server:

• is the transaction hash in the URL valid?
• If so, check if the Carbonmark API already has data for this purchase?
• NO ? => render page with placeholder

The second screenshot above shows these checks on the server:

• is the transaction hash in the URL valid?
• If so, check if the Carbonmark API already has data for this purchase?
• YES ? => render page with all data from Carbonmark API for this specific purchase ID

Because when buying from a seller listing, the transaction is an interaction with the carbonmark contract.
The purchase is saved on the Carbonmark API side and we can render a new static page late at any time (just pass the hash to the URL):

• GET purchase data from HASH => api.carbonmark.com/api/purchases/<TXN_HASH> See an example page with data from Carbonmark API
• The carbonmark API provides all relevant data for this page including the purchase price and the quantity

Instead, when "Buying from a Pool " the flow is as such:

The redeem transaction is an interaction with the retirement aggregator contract.
There is no API for "give me all data from a pool purchase with transaction hash XYZ".
Also the RA does not provide any method for that.
In this case, we would need to query the subgraph to create new static page for every transaction.
The query should give back: total price including fees, poolToken, quantity, project.

TODO

• find out how to get all relevant data from a pool purchase
• Depending on the needed inputs for this queries the final receipt page URL is constructed
• => carbonmark.com/purchases/pools/<TOKEN_ADDRESS>/<HASH> ?
• => or carbonmark.com/purchases/pools/<USER_ADDRESS>/<HASH> ?
• create a new purchase page for nextJS (depending on URL structure above)
• Render the same receipt component as for "Buy from Seller Listing"

[Atmosfearful]

OK so in summary this is a research item: lets ice box this for now until we finish migrating all flows and resolving bigger QA issues.

• ask cujo how we can get RA retirement and redeem pricing info in the same way that Najada does for CM purchases
• figure out how to integrate this into the REST api
• this probably ties into the merged subgraph work [carbonmark-api] Migrate to new merged subgraph #1168

[jabby09]

this will be covered off by #2290