Loaf market

[ponderingdemocritus]

User description

• style UX updates

---

PR Type

Enhancement

---

Description

• Enhanced the market resource sidebar by adding a Qty column and excluding Lords from filtered resources.
• Introduced a depth calculation for market resources to display the number of offers.
• Updated the MarketOrderPanel to include a depth property in the MarketResource component.
• Improved the styling and layout of market orders and order rows.
• Added logic to determine if an order can be accepted based on available balance.

---

Changes walkthrough 📝

Relevant files

Enhancement

MarketModal.tsx Enhance market resource sidebar with quantity and depth    client/src/ui/components/trading/MarketModal.tsx Added Qty column to the market resource sidebar. Excluded Lords from filtered resources. Introduced depth calculation for market resources. +30/-22  MarketOrderPanel.tsx Update market order panel with depth and acceptance logic client/src/ui/components/trading/MarketOrderPanel.tsx Added depth property to MarketResource component. Updated styling and layout for market orders and order rows. Added canAccept logic to determine if an order can be accepted. +68/-40

---

💡 PR-Agent usage: Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
eternum	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 24, 2024 0:36am

[github-actions[bot]]

PR Reviewer Guide 🔍

⏱️ Estimated effort to review [1-5]	3
🧪 Relevant tests	No
🔒 Security concerns	No
⚡ Key issues to review	Possible Bug: The logic for filtering out 'Lords' from the resources might not be correctly implemented. The condition resource.id !== ResourcesIds.Lords assumes that 'Lords' is a resource identified by an ID, which should be verified.
	Code Clarity: The use of perLords in the price calculations is unclear and potentially misleading. It's important to ensure that the variable names accurately reflect their purpose and the type of values they hold.
	Performance Concern: The repeated calculations and filters inside the map function for each resource could be optimized. Consider calculating values outside the map function or using memoization to avoid unnecessary recalculations.

[github-actions[bot]]

PR Code Suggestions ✨

Category	Suggestion	Score
Robustness	Add error handling for the cancel_order function ___ **Add error handling for the cancel_order function to manage potential failures gracefully. This could include displaying an error message to the user or retrying the operation.** [client/src/ui/components/trading/MarketOrderPanel.tsx [269-273]](https://github.com/BibliothecaDAO/eternum/pull/990/files#diff-00bad72a59745d3d904730035fcdeaddda30f53c9212d94f35f277ef202bd0bdR269-R273) ```diff -await cancel_order({ - signer: account, - trade_id: offer.tradeId, - return_resources: returnResources, -}); +try { + await cancel_order({ + signer: account, + trade_id: offer.tradeId, + return_resources: returnResources, + }); +} catch (error) { + console.error("Failed to cancel order:", error); + // Display error message to user or handle error appropriately +} ``` Suggestion importance[1-10]: 9 Why: Adding error handling significantly improves the robustness of the code by managing potential failures gracefully. This is crucial for a better user experience and debugging.	9
Maintainability	Refactor repeated filtering logic into a separate function ___ **Refactor the repeated filtering logic into a separate function to enhance code reusability and readability. This change will make the code cleaner and easier to maintain.** [client/src/ui/components/trading/MarketModal.tsx [150-156]](https://github.com/BibliothecaDAO/eternum/pull/990/files#diff-60c160393d9cf2b5da3291c081dd0d823b49d1cb1dcdda811544686c0ddd347eR150-R156) ```diff -const askPrice = resourceBidOffers - .filter((offer) => (resource.id ? offer.makerGets[0]?.resourceId === resource.id : true)) - .reduce((acc, offer) => (offer.perLords < acc ? offer.perLords : acc), Infinity); -const bidPrice = resourceAskOffers - .filter((offer) => offer.takerGets[0].resourceId === resource.id) - .reduce((acc, offer) => (offer.perLords < acc ? offer.perLords : acc), Infinity); +function getBestPrice(offers, resourceId) { + return offers + .filter((offer) => offer.takerGets[0].resourceId === resourceId) + .reduce((acc, offer) => (offer.perLords < acc ? offer.perLords : acc), Infinity); +} +const askPrice = getBestPrice(resourceBidOffers, resource.id); +const bidPrice = getBestPrice(resourceAskOffers, resource.id); ``` Suggestion importance[1-10]: 8 Why: This suggestion enhances code reusability and readability by refactoring repeated logic into a separate function. It is a good practice for maintainability and reduces code duplication.	8
	Improve variable naming for clarity ___ **Consider using a more descriptive variable name than perLords for clarity and maintainability. The name perLords does not clearly convey what the variable represents. A more descriptive name could be pricePerLord, which explicitly states that the variable holds the price per Lord unit.** [client/src/ui/components/trading/MarketModal.tsx [150-152]](https://github.com/BibliothecaDAO/eternum/pull/990/files#diff-60c160393d9cf2b5da3291c081dd0d823b49d1cb1dcdda811544686c0ddd347eR150-R152) ```diff const askPrice = resourceBidOffers .filter((offer) => (resource.id ? offer.makerGets[0]?.resourceId === resource.id : true)) - .reduce((acc, offer) => (offer.perLords < acc ? offer.perLords : acc), Infinity); + .reduce((acc, offer) => (offer.pricePerLord < acc ? offer.pricePerLord : acc), Infinity); ``` Suggestion importance[1-10]: 7 Why: The suggestion improves code readability and maintainability by using a more descriptive variable name. However, it is a minor change and does not address any critical issues.	7
Best practice	Use a constant for default BigInt value ___ **Consider using a constant for the default BigInt("0") value used in multiple places to avoid magic numbers and improve maintainability.** [client/src/ui/components/trading/MarketOrderPanel.tsx [165]](https://github.com/BibliothecaDAO/eternum/pull/990/files#diff-00bad72a59745d3d904730035fcdeaddda30f53c9212d94f35f277ef202bd0bdR165-R165) ```diff -entityId={entityId || BigInt("0")} +const DEFAULT_ENTITY_ID = BigInt("0"); +entityId={entityId || DEFAULT_ENTITY_ID} ``` Suggestion importance[1-10]: 6 Why: Using a constant for the default BigInt value is a good practice that improves maintainability by avoiding magic numbers. However, it is a minor improvement.	6