Feat/client labor

client/apps/game/src/main.tsx

@@ -72,11 +72,11 @@ async function init() {
     { vrfProviderAddress: env.VITE_PUBLIC_VRF_PROVIDER_ADDRESS, useBurner: env.VITE_PUBLIC_CHAIN === "local" },
   );
 
+  await initialSync(setupResult, state);
+
   const eternumConfig = await ETERNUM_CONFIG();
   configManager.setDojo(setupResult.components, eternumConfig);
 
-  await initialSync(setupResult, state);
-
   const graphic = new GameRenderer(setupResult);
 
   graphic.initScene();

client/apps/game/src/types/index.ts

@@ -3,6 +3,7 @@ import { ID } from "@bibliothecadao/eternum";
 export enum RightView {
   None,
   ResourceTable,
+  LaborTable,
 }
 
 export enum LeftView {

client/apps/game/src/ui/components/hyperstructures/hyperstructure-resource-chip.tsx

@@ -4,7 +4,7 @@ import { NumberInput } from "@/ui/elements/number-input";
 import { ResourceIcon } from "@/ui/elements/resource-icon";
 import { currencyIntlFormat, divideByPrecision } from "@/ui/utils/utils";
 import { getBlockTimestamp } from "@/utils/timestamp";
-import { findResourceById, getBalance, getIconResourceId, ID } from "@bibliothecadao/eternum";
+import { findResourceById, getBalance, ID } from "@bibliothecadao/eternum";
 import { ProgressWithPercentage, useDojo } from "@bibliothecadao/react";
 import { useEffect, useState } from "react";
 
@@ -70,7 +70,7 @@ export const HyperstructureResourceChip = ({
             position: "top",
             content: (
               <>
-                {findResourceById(getIconResourceId(resourceId, false))?.trait as string} ({currencyIntlFormat(balance)}
+                {findResourceById(resourceId)?.trait as string} ({currencyIntlFormat(balance)}
                 )
               </>
             ),
@@ -83,7 +83,7 @@ export const HyperstructureResourceChip = ({
         <ResourceIcon
           isLabor={false}
           withTooltip={false}
-          resource={findResourceById(getIconResourceId(resourceId, false))?.trait as string}
+          resource={findResourceById(resourceId)?.trait as string}
           size="xs"
           className="mr-2 self-center"
         />

client/apps/game/src/ui/components/resources/entity-labor-table.tsx

@@ -0,0 +1,29 @@
+import { ID, LaborIds, ResourcesIds } from "@bibliothecadao/eternum";
+import { useDojo } from "@bibliothecadao/react";
+import { LaborChip } from "./labor-chip";
+
+export const EntityLaborTable = ({ entityId }: { entityId: ID | undefined }) => {
+  const dojo = useDojo();
+
+  if (!entityId || entityId === 0) {
+    return <div>No Entity Selected</div>;
+  }
+
+  const startProduction = async (resourceType: ResourcesIds, producedAmount: number) => {
+    try {
+      await dojo.setup.systemCalls.start_production({
+        signer: dojo.account.account,
+        entity_id: entityId,
+        resource_type: resourceType,
+        amount: producedAmount,
+      });
+    } catch (error) {
+      console.error("Failed to start production", error);
+    }
+  };
+
+  return Object.entries(LaborIds).map(([_, laborId]) => {
+    if (isNaN(Number(laborId))) return null;
+    return <LaborChip key={laborId} laborId={laborId as LaborIds} startProduction={startProduction} />;
+  });
+};

client/apps/game/src/ui/components/resources/entity-resource-table.tsx

@@ -7,6 +7,7 @@ import {
   configManager,
   ID,
   RESOURCE_TIERS,
+  ResourcesIds,
   StructureType,
 } from "@bibliothecadao/eternum";
 import { useDojo } from "@bibliothecadao/react";
@@ -38,7 +39,7 @@ export const EntityResourceTable = ({ entityId }: { entityId: ID | undefined })
   }
 
   return Object.entries(RESOURCE_TIERS).map(([tier, resourceIds]) => {
-    const resources = resourceIds.map((resourceId: any) => (
+    const resources = resourceIds.map((resourceId: ResourcesIds) => (
       <ResourceChip
         key={resourceId}
         resourceId={resourceId}

client/apps/game/src/ui/components/resources/labor-chip.tsx

@@ -0,0 +1,62 @@
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import {
+  configManager,
+  findResourceById,
+  getResourceIdFromLaborId,
+  LaborIds,
+  ResourcesIds,
+} from "@bibliothecadao/eternum";
+import { useState } from "react";
+
+type LaborChipProps = {
+  laborId: LaborIds;
+  startProduction: (resourceType: ResourcesIds, amount: number) => void;
+};
+
+export const LaborChip = ({ laborId, startProduction }: LaborChipProps) => {
+  const resourceId = getResourceIdFromLaborId(laborId);
+
+  const [productionAmount, setProductionAmount] = useState(0);
+
+  const laborInputs = configManager.laborInputs[resourceId as ResourcesIds];
+
+  return (
+    <>
+      <div className={`flex gap-2 relative group items-center text-xs px-2 p-1 hover:bg-gold/20 `}>
+        <div className="flex flex-col">
+          {laborInputs?.map(({ resource, amount }) => (
+            <div key={resource} className="flex flex-row items-center">
+              <ResourceIcon
+                withTooltip={false}
+                resource={findResourceById(resource)?.trait as string}
+                size="sm"
+                className="mr-3 self-center"
+              />
+              <div className="text-red">-{amount * productionAmount}</div>
+            </div>
+          ))}
+        </div>
+        <div className="grid grid-cols-10 w-full items-center">
+          <div className="flex flex-col col-span-7">
+            <NumberInput
+              value={productionAmount}
+              onChange={(productionAmount) => setProductionAmount(productionAmount)}
+              className="col-span-7"
+            />
+            <Button variant="primary" onClick={() => startProduction(resourceId, productionAmount)}>
+              Start Producing
+            </Button>
+          </div>
+          <ResourceIcon
+            withTooltip={false}
+            resource={findResourceById(resourceId)?.trait as string}
+            size="md"
+            className=""
+          />
+        </div>
+      </div>
+    </>
+  );
+};

client/apps/game/src/ui/components/resources/resource-chip.tsx

@@ -2,21 +2,12 @@ import { useUIStore } from "@/hooks/store/use-ui-store";
 import { ResourceIcon } from "@/ui/elements/resource-icon";
 import { currencyFormat, currencyIntlFormat, divideByPrecision, gramToKg } from "@/ui/utils/utils";
 import { getBlockTimestamp } from "@/utils/timestamp";
-import {
-  configManager,
-  findResourceById,
-  formatTime,
-  getIconResourceId,
-  ID,
-  TickIds,
-  TimeFormat,
-} from "@bibliothecadao/eternum";
+import { configManager, findResourceById, formatTime, ID, TickIds, TimeFormat } from "@bibliothecadao/eternum";
 import { useResourceManager } from "@bibliothecadao/react";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { RealmTransfer } from "./realm-transfer";
 
 export const ResourceChip = ({
-  isLabor = false,
   resourceId,
   entityId,
   maxStorehouseCapacityKg,
@@ -86,9 +77,8 @@ export const ResourceChip = ({
   const icon = useMemo(
     () => (
       <ResourceIcon
-        isLabor={isLabor}
         withTooltip={false}
-        resource={findResourceById(getIconResourceId(resourceId, isLabor))?.trait as string}
+        resource={findResourceById(resourceId)?.trait as string}
         size="sm"
         className="mr-3 self-center"
       />
@@ -103,10 +93,10 @@ export const ResourceChip = ({
   const handleMouseEnter = useCallback(() => {
     setTooltip({
       position: "top",
-      content: <>{findResourceById(getIconResourceId(resourceId, isLabor))?.trait as string}</>,
+      content: <>{findResourceById(resourceId)?.trait as string}</>,
     });
     setShowPerHour(false);
-  }, [resourceId, isLabor, setTooltip]);
+  }, [resourceId, setTooltip]);
 
   const handleMouseLeave = useCallback(() => {
     setTooltip(null);

client/apps/game/src/ui/components/structures/construction/structure-construction-menu.tsx

@@ -5,14 +5,7 @@ import { ResourceCost } from "@/ui/elements/resource-cost";
 import { multiplyByPrecision } from "@/ui/utils/utils";
 import { getBlockTimestamp } from "@/utils/timestamp";
 // import { ETERNUM_CONFIG } from "@/utils/config";
-import {
-  ID,
-  RESOURCE_PRECISION,
-  ResourcesIds,
-  StructureType,
-  configManager,
-  getBalance,
-} from "@bibliothecadao/eternum";
+import { ID, ResourcesIds, StructureType, configManager, getBalance } from "@bibliothecadao/eternum";
 import { useDojo } from "@bibliothecadao/react";
 import React from "react";
 
@@ -49,13 +42,8 @@ export const StructureConstructionMenu = ({ className, entityId }: { className?:
       {buildingTypes.map((structureType, index) => {
         const building = StructureType[structureType as keyof typeof StructureType];
 
-        // if is hyperstructure, the construction cost are only fragments
         const isHyperstructure = building === StructureType["Hyperstructure"];
         const cost = configManager.structureCosts[building];
-        // scaleResourceCostMinMax(
-        //   configManager.getHyperstructureConstructionCosts(),
-        //   RESOURCE_PRECISION,
-        // );
 
         const hasBalance = checkBalance(isHyperstructure ? cost : []);
 
@@ -95,12 +83,7 @@ const StructureInfo = ({
 }) => {
   const dojo = useDojo();
   const currentDefaultTick = getBlockTimestamp().currentDefaultTick;
-  // if is hyperstructure, the construction cost are only fragments
-  const isHyperstructure = structureId === StructureType["Hyperstructure"];
   const cost = configManager.structureCosts[structureId];
-  // eternumConfig.hyperstructures.hyperstructureCreationCosts.filter(
-  //   (cost) => !isHyperstructure || cost.resource_tier === ResourceTier.Lords,
-  // );
 
   const perTick =
     structureId == StructureType.Hyperstructure
@@ -132,8 +115,7 @@ const StructureInfo = ({
               key={index}
               type="horizontal"
               resourceId={ResourcesIds.AncientFragment}
-              // amount={cost[Number(resourceId)].min_amount * RESOURCE_PRECISION}
-              amount={cost[Number(resourceId)].amount * RESOURCE_PRECISION}
+              amount={cost[Number(resourceId)].amount}
               balance={balance.balance}
             />
           );

client/apps/game/src/ui/config.tsx

@@ -104,4 +104,5 @@ export enum MenuEnum {
   resourceArrivals = "resourceArrivals",
   trade = "trade",
   resourceTable = "resourceTable",
+  laborTable = "laborTable",
 }

client/apps/game/src/ui/elements/resource-icon.tsx

@@ -1,4 +1,4 @@
-import People from "@/assets/icons/common/people.svg?react";
+import { ReactComponent as People } from "@/assets/icons/common/people.svg";
 import clsx from "clsx";
 import type { ReactElement } from "react";
 

client/apps/game/src/ui/modules/navigation/right-navigation-module.tsx

@@ -1,5 +1,6 @@
 import { useUIStore } from "@/hooks/store/use-ui-store";
 import { RightView } from "@/types";
+import { EntityLaborTable } from "@/ui/components/resources/entity-labor-table";
 import { BuildingThumbs, MenuEnum } from "@/ui/config";
 import Button from "@/ui/elements/button";
 import CircleButton from "@/ui/elements/circle-button";
@@ -25,6 +26,7 @@ export const RightNavigationModule = () => {
           <CircleButton
             className="resource-table-selector"
             image={BuildingThumbs.resources}
+            disabled={!structureEntityId}
             size="xl"
             tooltipLocation="top"
             label="Balance"
@@ -33,6 +35,21 @@ export const RightNavigationModule = () => {
           />
         ),
       },
+      {
+        name: MenuEnum.laborTable,
+        button: (
+          <CircleButton
+            className="labor-table-selector"
+            image={BuildingThumbs.construction}
+            disabled={!structureEntityId}
+            size="xl"
+            tooltipLocation="top"
+            label="Labor"
+            active={view === RightView.LaborTable}
+            onClick={() => setView(view === RightView.LaborTable ? RightView.None : RightView.LaborTable)}
+          />
+        ),
+      },
     ],
     [view, structureEntityId],
   );
@@ -65,24 +82,23 @@ export const RightNavigationModule = () => {
         className={`w-full pointer-events-auto overflow-y-scroll h-[60vh] rounded-l-2xl border-l-2 border-y-2 border-gold/20`}
       >
         <Suspense fallback={<div className="p-8">Loading...</div>}>
-          {!!structureEntityId && (
-            <div className="entity-resource-table-selector p-2 flex flex-col space-y-1 overflow-y-auto">
-              <a
-                className="text-brown cursor-pointer text-lg w-full"
-                href={`https://empire.realms.world/trade`}
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <Button variant="secondary" className="w-full">
-                  <div className="flex items-center gap-2">
-                    <ResourceIcon resource="Lords" size="xs" />
-                    Bridge Lords & Resources
-                  </div>
-                </Button>
-              </a>
-              <EntityResourceTable entityId={structureEntityId} />
-            </div>
-          )}
+          <div className="entity-resource-table-selector p-2 flex flex-col space-y-1 overflow-y-auto">
+            <a
+              className="text-brown cursor-pointer text-lg w-full"
+              href={`https://empire.realms.world/trade`}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              <Button variant="secondary" className="w-full">
+                <div className="flex items-center gap-2">
+                  <ResourceIcon resource="Lords" size="xs" />
+                  Bridge Lords & Resources
+                </div>
+              </Button>
+            </a>
+            {view === RightView.ResourceTable && <EntityResourceTable entityId={structureEntityId} />}
+            {view === RightView.LaborTable && <EntityLaborTable entityId={structureEntityId} />}
+          </div>
         </Suspense>
       </BaseContainer>
     </div>

contracts/game/src/models/config.cairo

@@ -780,7 +780,6 @@ struct ResourceBridgeWhitelistConfig {
     resource_type: u8
 }
 
-// speed
 #[derive(IntrospectPacked, Copy, Drop, Serde)]
 #[dojo::model]
 pub struct RealmMaxLevelConfig {

contracts/game/src/systems/config/contracts.cairo

@@ -642,18 +642,6 @@ mod config_systems {
         }
     }
 
-    // #[derive(IntrospectPacked, Copy, Drop, Serde)]
-    // #[dojo::model]
-    // pub struct LaborConfig {
-    //     #[key]
-    //     // e.g when configuring stone labor, resource_type = stone
-    //     resource_type: u8,
-    //     // uuid used to get the ResourceCost
-    //     input_id: ID,
-    //     // number of resources required to make labor
-    //     input_count: u8,
-    // }
-
     #[abi(embed_v0)]
     impl TransportConfigImpl of super::ITransportConfig<ContractState> {
         fn set_speed_config(ref self: ContractState, entity_type: ID, sec_per_km: u16) {

contracts/game/src/systems/production/contracts.cairo

@@ -84,7 +84,6 @@ mod production_systems {
                 }
             };
 
-            // todo: check that entity is a realm
             let (building, building_quantity) = BuildingImpl::create(
                 ref world, entity_id, building_category, produce_resource_type, building_coord
             );