Skip to content

Commit

Permalink
Adjust production cost of resource based on output amount + fix hidde…
Browse files Browse the repository at this point in the history
…n popup for 1st row in table
  • Loading branch information
bob0005 committed Sep 23, 2024
1 parent ae4a5e7 commit bda3789
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 19 deletions.
36 changes: 19 additions & 17 deletions client/src/ui/components/bank/LiquidityResourceRow.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { MarketManager } from "@/dojo/modelManager/MarketManager";
import { useDojo } from "@/hooks/context/DojoContext";
import { useTravel } from "@/hooks/helpers/useTravel";
import useUIStore from "@/hooks/store/useUIStore";
import Button from "@/ui/elements/Button";
import { ResourceCost } from "@/ui/elements/ResourceCost";
import { ResourceIcon } from "@/ui/elements/ResourceIcon";
Expand All @@ -11,29 +10,29 @@ import {
EternumGlobalConfig,
ID,
RESOURCE_INPUTS_SCALED,
RESOURCE_OUTPUTS,
ResourcesIds,
resources,
} from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { useCallback, useMemo, useState } from "react";
import React, { useCallback, useMemo, useState } from "react";
import { TravelInfo } from "../resources/ResourceWeight";
import { ConfirmationPopup } from "./ConfirmationPopup";

type LiquidityResourceRowProps = {
bankEntityId: ID;
entityId: ID;
resourceId: ResourcesIds;
isFirst?: boolean;
};

export const LiquidityResourceRow = ({ bankEntityId, entityId, resourceId }: LiquidityResourceRowProps) => {
export const LiquidityResourceRow = ({ bankEntityId, entityId, resourceId, isFirst }: LiquidityResourceRowProps) => {
const dojoContext = useDojo();
const [isLoading, setIsLoading] = useState(false);
const [canCarry, setCanCarry] = useState(false);
const [openConfirmation, setOpenConfirmation] = useState(false);
const [showInputResourcesPrice, setShowInputResourcesPrice] = useState(false);

const setTooltip = useUIStore((state) => state.setTooltip);

const marketEntityId = useMemo(
() => getEntityIdFromKeys([BigInt(bankEntityId), BigInt(resourceId)]),
[bankEntityId, resourceId],
Expand Down Expand Up @@ -161,7 +160,7 @@ export const LiquidityResourceRow = ({ bankEntityId, entityId, resourceId }: Liq
>
{marketManager.getMarketPrice().toFixed(2)} <ResourceIcon resource="Lords" size="sm" />
{showInputResourcesPrice && (
<div className="absolute bottom-10 left-0 z-[100] pointer-events-none">
<div className={`${isFirst ? "top-10" : "bottom-10"} absolute left-0 z-[100] pointer-events-none`}>
<InputResourcesPrice marketManager={marketManager} />
</div>
)}
Expand Down Expand Up @@ -212,24 +211,27 @@ export const LiquidityResourceRow = ({ bankEntityId, entityId, resourceId }: Liq
const InputResourcesPrice = ({ marketManager }: { marketManager: MarketManager }) => {
const { setup } = useDojo();
const inputResources = RESOURCE_INPUTS_SCALED[marketManager.resourceId];
const outputAmount = RESOURCE_OUTPUTS[marketManager.resourceId];

if (!inputResources?.length) return null;
const totalPrice = inputResources.reduce((sum, resource) => {
const price = new MarketManager(
setup,
marketManager.bankEntityId,
marketManager.player,
resource.resource,
).getMarketPrice();
return sum + Number(price) * resource.amount;
}, 0);
const totalPrice =
inputResources.reduce((sum, resource) => {
const price = new MarketManager(
setup,
marketManager.bankEntityId,
marketManager.player,
resource.resource,
).getMarketPrice();
return sum + Number(price) * resource.amount;
}, 0) / outputAmount;
return (
<div className="p-2 w-full flex flex-col items-center justify-center bg-black/70 rounded-lg shadow-xl">
<div className="flex items-center justify-center">
{inputResources.map(({ resource }, index) => (
<>
<React.Fragment key={index}>
{index > 0 && <span className="mx-1">+</span>}
<ResourceIcon key={resource} resource={ResourcesIds[resource]} size="sm" />
</>
</React.Fragment>
))}
</div>
<div className="flex flex-row text-xxs text-gold w-full items-center justify-between mt-1">
Expand Down
5 changes: 3 additions & 2 deletions client/src/ui/components/bank/LiquidityTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ type LiquidityTableProps = {
};

export const LiquidityTableHeader = () => (
<div className="grid grid-cols-7 gap-4 mb-4 px-2">
<div className="grid grid-cols-7 gap-4 mb-4 px-2 border-b">
<div className="uppercase">Pair</div>
<div className="uppercase">
<p>Price</p>
Expand Down Expand Up @@ -47,12 +47,13 @@ export const LiquidityTable = ({ bank_entity_id, entity_id }: LiquidityTableProp
<LiquidityTableHeader />
<div className="overflow-y-auto">
<div className="grid gap-2 relative">
{filteredResources.map((resourceId) => (
{filteredResources.map((resourceId, index) => (
<LiquidityResourceRow
key={resourceId}
bankEntityId={bank_entity_id!}
entityId={entity_id}
resourceId={resourceId}
isFirst={index === 0 ? true : false}
/>
))}
</div>
Expand Down

0 comments on commit bda3789

Please sign in to comment.