feat: APP-886 Add buy credits button to Terrasos project pages, if sell orders exist.

[alexander-astrand]

Description

https://regennetwork.atlassian.net/browse/APP-886

---

Author Checklist

All items are required. Please add a note to the item if the item is not applicable and
please add links to any relevant follow up issues.

I have...

• provided a link to the relevant issue or specification
• provided instructions on how to test
• reviewed "Files changed" and left comments if necessary
• confirmed all CI checks have passed

How to test

1. Go to a Terrasos project page and the buy credits button shows up if sell orders exist.

Reviewers Checklist

All items are required. Please add a note if the item is not applicable and please add
your handle next to the items reviewed if you only reviewed selected items.

I have...

• confirmed all author checklist items have been addressed
• reviewed code correctness and readability
• verified React components follow DRY principles
• reviewed documentation is accurate
• reviewed tests
• manually tested (if applicable)

[netlify]

✅ Deploy Preview for terrasos ready!

Name	Link
🔨 Latest commit	93bbc45
🔍 Latest deploy log	https://app.netlify.com/projects/terrasos/deploys/69b95125a9a2a80008b17024
😎 Deploy Preview	https://deploy-preview-2813--terrasos.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Copilot]

Pull request overview

This PR adds a "Buy Credits" button to Terrasos project pages when sell orders exist, replacing the "Book Call" button in that scenario. For Terrasos projects without sell orders, the existing "Book Call" button continues to be shown.

Changes:

• Added hasSellOrders prop to SellOrdersActionsBar (and its legacy variant) to conditionally show/hide the "Book Call" and "Buy Credits" buttons for Terrasos projects based on whether sell orders exist.
• Modified the onBuyButtonClick handler in ProjectDetails to open the buy page in a new tab (window.open) for Terrasos projects, bypassing the standard wallet-connection flow used by useOnBuyButtonClick.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

File	Description
web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.tsx	Extracts sellOrders from the project hook, computes hasSellOrders, passes it as a prop, and adds Terrasos-specific buy button click handler using window.open.
web-marketplace/src/components/organisms/SellOrdersActionsBar/SellOrdersActionsBar.tsx	Adds hasSellOrders prop; conditionally shows "Book Call" only when Terrasos has no sell orders; conditionally shows "Buy Credits" when Terrasos has sell orders.
web-marketplace/src/components/organisms/SellOrdersActionsBar/SellOrdersActionsBar.legacy.tsx	Same logic changes as the non-legacy SellOrdersActionsBar for consistency.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 264f53ee13

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request enhances the user experience on Terrasos project pages by dynamically displaying a 'Buy Credits' button when sell orders are available. This change streamlines the credit purchasing process for Terrasos projects, allowing users to directly access a dedicated buying interface, while also adjusting the visibility of the 'Book a Call' button based on credit availability.

Highlights

• Conditional Buy Button Display: A 'Buy Credits' button is now displayed on Terrasos project pages only if there are existing sell orders for that project, improving clarity and user experience.
• Conditional Book a Call Button Display: The 'Book a Call' button is now hidden on Terrasos project pages if sell orders exist, preventing redundant options when direct purchasing is available.
• Terrasos Buy Flow Enhancement: Clicking the 'Buy Credits' button on a Terrasos project page now navigates the user to a dedicated buy page for that project in a new tab, streamlining the purchasing process.
• Component Prop Updates: The SellOrdersActionsBar component was updated to accept a new hasSellOrders prop, and the ProjectDetails template was updated to determine and pass this prop based on available sell orders.

Changelog

• web-marketplace/src/components/organisms/SellOrdersActionsBar/SellOrdersActionsBar.legacy.tsx
  • Added hasSellOrders prop to component parameters.
  • Updated conditional logic for displaying the 'Book a Call' button.
  • Updated conditional logic for displaying the 'Buy Credits' button.
• web-marketplace/src/components/organisms/SellOrdersActionsBar/SellOrdersActionsBar.tsx
  • Added hasSellOrders prop to component parameters.
  • Updated conditional logic for displaying the 'Book a Call' button.
  • Updated conditional logic for displaying the 'Buy Credits' button.
• web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.tsx
  • Passed sellOrders data to the component.
  • Calculated hasSellOrders based on the presence of sell orders.
  • Modified the onBuyButtonClick function to open a new tab for Terrasos projects.
  • Passed the new hasSellOrders prop to the SellOrdersActionsBar component.

Activity

• The pull request was created by alexander-astrand to address APP-886.
• Author provided a description, checklist, and testing instructions.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

The pull request successfully adds the 'Buy Credits' button to Terrasos project pages when sell orders are available. The implementation is mostly correct and follows the existing structure. I've added a few comments: one to improve security when opening a new tab, and a couple of suggestions to refactor complex conditional logic for better readability in the SellOrdersActionsBar components.

[alexander-astrand]

@erikalogie @S4mmyb See testing instrcutions.

[erikalogie]

How can I test this? Which project has credits for sale? @alexander-astrand

[blushi]

@erikalogie you will be able to test this on /project/el-globo using the terrasos deploy preview

@erikalogie @S4mmyb one thing that hasn't been considered here: if the project doesn't have any fiat sell orders and the user is not logged in with a wallet addr then the buy page shouldn't be accessible. From the regen app, we show a popup to connect in this case before navigating to the buy page. But we can't really detect the user status from the terrasos app, so what should we do?

[blushi]

@erikalogie @S4mmyb one thing that hasn't been considered here: if the project doesn't have any fiat sell orders and the user is not logged in with a wallet addr then the buy page shouldn't be accessible. From the regen app, we show a popup to connect in this case before navigating to the buy page. But we can't really detect the user status from the terrasos app, so what should we do?

@S4mmyb and I discussed this during our 1-1: he suggests to use the modal that we show on the project page in that case, but on the project buy page.