diff --git a/client/apps/game/src/ui/components/hints/TheMap.tsx b/client/apps/game/src/ui/components/hints/the-map.tsx
similarity index 87%
rename from client/apps/game/src/ui/components/hints/TheMap.tsx
rename to client/apps/game/src/ui/components/hints/the-map.tsx
index 0431bc6323..007b7f7149 100644
--- a/client/apps/game/src/ui/components/hints/TheMap.tsx
+++ b/client/apps/game/src/ui/components/hints/the-map.tsx
@@ -1,5 +1,5 @@
-import { Headline } from "@/ui/elements/Headline";
-import { ExplorationTable } from "./ExplorationTable";
+import { ExplorationTable } from "@/ui/components/hints/exploration-table";
+import { Headline } from "@/ui/elements/headline";
import { tableOfContents } from "./utils";
export const TheMap = () => {
diff --git a/client/apps/game/src/ui/components/hints/TheWorld.tsx b/client/apps/game/src/ui/components/hints/the-world.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/hints/TheWorld.tsx
rename to client/apps/game/src/ui/components/hints/the-world.tsx
index 2cf47f24fd..37b8a5773a 100644
--- a/client/apps/game/src/ui/components/hints/TheWorld.tsx
+++ b/client/apps/game/src/ui/components/hints/the-world.tsx
@@ -1,4 +1,4 @@
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
export const TheWorld = () => {
const chapters = [
diff --git a/client/apps/game/src/ui/components/hints/Trading.tsx b/client/apps/game/src/ui/components/hints/trading.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/hints/Trading.tsx
rename to client/apps/game/src/ui/components/hints/trading.tsx
index 9dbeaeeb7f..22a8deba3f 100644
--- a/client/apps/game/src/ui/components/hints/Trading.tsx
+++ b/client/apps/game/src/ui/components/hints/trading.tsx
@@ -1,4 +1,4 @@
-import { Headline } from "@/ui/elements/Headline";
+import { Headline } from "@/ui/elements/headline";
import { tableOfContents } from "./utils";
export const Trading = () => {
diff --git a/client/apps/game/src/ui/components/hints/Transfers.tsx b/client/apps/game/src/ui/components/hints/transfers.tsx
similarity index 98%
rename from client/apps/game/src/ui/components/hints/Transfers.tsx
rename to client/apps/game/src/ui/components/hints/transfers.tsx
index 222ed06fc2..eedaa3be2d 100644
--- a/client/apps/game/src/ui/components/hints/Transfers.tsx
+++ b/client/apps/game/src/ui/components/hints/transfers.tsx
@@ -1,7 +1,7 @@
import { configManager } from "@/dojo/setup";
import { BUILDING_IMAGES_PATH } from "@/ui/config";
import { GRAMS_PER_KG } from "@/ui/constants";
-import { Headline } from "@/ui/elements/Headline";
+import { Headline } from "@/ui/elements/headline";
import { BuildingType, CapacityConfigCategory, ResourcesIds } from "@bibliothecadao/eternum";
import { tableOfContents } from "./utils";
diff --git a/client/apps/game/src/ui/components/hints/WorldStructures.tsx b/client/apps/game/src/ui/components/hints/world-structures.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/hints/WorldStructures.tsx
rename to client/apps/game/src/ui/components/hints/world-structures.tsx
index d04f519dd0..404aca6134 100644
--- a/client/apps/game/src/ui/components/hints/WorldStructures.tsx
+++ b/client/apps/game/src/ui/components/hints/world-structures.tsx
@@ -1,7 +1,8 @@
import { configManager } from "@/dojo/setup";
-import { Headline } from "@/ui/elements/Headline";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { STRUCTURE_IMAGE_PATHS } from "@/ui/components/structures/construction/structure-construction-menu";
+import { Headline } from "@/ui/elements/headline";
+import { ResourceCost } from "@/ui/elements/resource-cost";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { formatTime } from "@/ui/utils/utils";
import {
findResourceById,
@@ -10,7 +11,6 @@ import {
StructureType,
} from "@bibliothecadao/eternum";
import { useMemo } from "react";
-import { STRUCTURE_IMAGE_PATHS } from "../structures/construction/StructureConstructionMenu";
import { tableOfContents } from "./utils";
export const WorldStructures = () => {
diff --git a/client/apps/game/src/ui/components/hyperstructures/CoOwners.tsx b/client/apps/game/src/ui/components/hyperstructures/co-owners.tsx
similarity index 91%
rename from client/apps/game/src/ui/components/hyperstructures/CoOwners.tsx
rename to client/apps/game/src/ui/components/hyperstructures/co-owners.tsx
index 70e7bdac31..6068fe5bb6 100644
--- a/client/apps/game/src/ui/components/hyperstructures/CoOwners.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/co-owners.tsx
@@ -1,16 +1,16 @@
import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useGetAllPlayers } from "@/hooks/helpers/use-get-all-players";
-import { useRealm } from "@/hooks/helpers/useRealm";
-import { useStructureByEntityId } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { SelectAddress } from "@/ui/elements/SelectAddress";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayers } from "@/hooks/helpers/use-players";
+import { useStructureByEntityId } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { SelectAddress } from "@/ui/elements/select-address";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { displayAddress, formatTime } from "@/ui/utils/utils";
+import { getAddressName } from "@/utils/entities";
import { ContractAddress, HYPERSTRUCTURE_CONFIG_ID, ID } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { getComponentValue } from "@dojoengine/recs";
@@ -54,10 +54,10 @@ const CoOwnersRows = ({
}) => {
const {
account: { account },
- setup: {
- components: { Hyperstructure, HyperstructureConfig },
- },
+ setup: { components },
} = useDojo();
+ const { Hyperstructure, HyperstructureConfig } = components;
+
const setTooltip = useUIStore((state) => state.setTooltip);
const { nextBlockTimestamp } = useNextBlockTimestamp();
@@ -82,8 +82,6 @@ const CoOwnersRows = ({
const structure = useStructureByEntityId(hyperstructureEntityId);
- const { getAddressName } = useRealm();
-
const sortingParams = useMemo(() => {
return [
{ label: "Name", sortKey: "name", className: "" },
@@ -118,7 +116,7 @@ const CoOwnersRows = ({
{coOwnersWithTimestamp?.coOwners.map((coOwner, index) => {
- const playerName = getAddressName(coOwner.address) || "Player not found";
+ const playerName = getAddressName(coOwner.address, components) || "Player not found";
const isOwner = coOwner.address === ContractAddress(account.address);
@@ -178,7 +176,7 @@ const ChangeCoOwners = ({
},
} = useDojo();
- const getPlayers = useGetAllPlayers();
+ const players = usePlayers();
const [isLoading, setIsLoading] = useState(false);
const [newCoOwners, setNewCoOwners] = useState<
{
@@ -237,10 +235,6 @@ const ChangeCoOwners = ({
.some((coOwner) => coOwner.address === ContractAddress(account.address));
}, [newCoOwners, account.address]);
- const players = useMemo(() => {
- return getPlayers();
- }, []);
-
return (
diff --git a/client/apps/game/src/ui/components/hyperstructures/ContributionSummary.tsx b/client/apps/game/src/ui/components/hyperstructures/contribution-summary.tsx
similarity index 83%
rename from client/apps/game/src/ui/components/hyperstructures/ContributionSummary.tsx
rename to client/apps/game/src/ui/components/hyperstructures/contribution-summary.tsx
index 3bc4ae6411..6f471912df 100644
--- a/client/apps/game/src/ui/components/hyperstructures/ContributionSummary.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/contribution-summary.tsx
@@ -1,9 +1,9 @@
-import { useContributions } from "@/hooks/helpers/useContributions";
-import { useRealm } from "@/hooks/helpers/useRealm";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { SelectResource } from "@/ui/elements/SelectResource";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { SelectResource } from "@/ui/elements/select-resource";
import { copyPlayerAddressToClipboard, currencyIntlFormat, divideByPrecision, formatNumber } from "@/ui/utils/utils";
-import { ContractAddress, ID, ResourcesIds } from "@bibliothecadao/eternum";
+import { getAddressName } from "@/utils/entities";
+import { ContractAddress, ID, LeaderboardManager, ResourcesIds } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
export const ContributionSummary = ({
@@ -13,8 +13,13 @@ export const ContributionSummary = ({
hyperstructureEntityId: ID;
className?: string;
}) => {
- const { getContributions, getContributionsTotalPercentage } = useContributions();
- const { getAddressName } = useRealm();
+ const {
+ setup: { components },
+ } = useDojo();
+
+ const leaderboardManager = useMemo(() => {
+ return LeaderboardManager.instance(components);
+ }, [components]);
const [showContributions, setShowContributions] = useState(false);
const [selectedResource, setSelectedResource] = useState (null);
@@ -24,7 +29,10 @@ export const ContributionSummary = ({
resourceId: number;
};
- const contributions = getContributions(hyperstructureEntityId);
+ const contributions = useMemo(() => {
+ return leaderboardManager.getContributions(hyperstructureEntityId);
+ }, [leaderboardManager, hyperstructureEntityId]);
+
const groupedContributions = contributions.reduce>>((acc, contribution) => {
const { player_address, resource_type, amount } = contribution;
const playerAddressString = player_address.toString();
@@ -59,7 +67,10 @@ export const ContributionSummary = ({
playerAddress,
resources,
percentage:
- getContributionsTotalPercentage(hyperstructureEntityId, resourceContributions[playerAddress]) * 100,
+ leaderboardManager.getContributionsTotalPercentage(
+ hyperstructureEntityId,
+ resourceContributions[playerAddress],
+ ) * 100,
}))
.filter(({ resources }) =>
selectedResource ? resources[selectedResource] > 0n : Object.values(resources).some((amount) => amount > 0n),
@@ -89,7 +100,7 @@ export const ContributionSummary = ({
setSelectedResource(resourceId)} />
{sortedContributors.map(({ playerAddress, resources, percentage }) => {
- const addressName = getAddressName(ContractAddress(playerAddress)) || "Unknown";
+ const addressName = getAddressName(ContractAddress(playerAddress), components) || "Unknown";
return (
diff --git a/client/apps/game/src/ui/components/hyperstructures/HyperstructureDetails.tsx b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-details.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/hyperstructures/HyperstructureDetails.tsx
rename to client/apps/game/src/ui/components/hyperstructures/hyperstructure-details.tsx
index 1c62a74c93..233cda7d1e 100644
--- a/client/apps/game/src/ui/components/hyperstructures/HyperstructureDetails.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-details.tsx
@@ -1,9 +1,9 @@
-import { useDojo } from "@/hooks/context/DojoContext";
+import { useDojo } from "@/hooks/context/dojo-context";
import { Tabs } from "@/ui/elements/tab";
import { ID, LeaderboardManager } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
-import { CoOwners } from "./CoOwners";
-import { Leaderboard } from "./Leaderboard";
+import { CoOwners } from "./co-owners";
+import { Leaderboard } from "./leaderboard";
export const HyperstructureDetails = ({ hyperstructureEntityId }: { hyperstructureEntityId: ID }) => {
const dojo = useDojo();
diff --git a/client/apps/game/src/ui/components/hyperstructures/HyperstructurePanel.tsx b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-panel.tsx
similarity index 90%
rename from client/apps/game/src/ui/components/hyperstructures/HyperstructurePanel.tsx
rename to client/apps/game/src/ui/components/hyperstructures/hyperstructure-panel.tsx
index 3e3a460b07..0080b563bf 100644
--- a/client/apps/game/src/ui/components/hyperstructures/HyperstructurePanel.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-panel.tsx
@@ -1,19 +1,22 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useContributions } from "@/hooks/helpers/useContributions";
-import { useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerContributions } from "@/hooks/helpers/use-contributions";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
import {
ProgressWithPercentage,
useHyperstructureProgress,
useHyperstructureUpdates,
-} from "@/hooks/helpers/useHyperstructures";
-import { useHyperstructureData } from "@/hooks/store/useLeaderBoardStore";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/Select";
-import TextInput from "@/ui/elements/TextInput";
+} from "@/hooks/helpers/use-hyperstructures";
+import { useHyperstructureData } from "@/hooks/store/use-leaderboard-store";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { ContributionSummary } from "@/ui/components/hyperstructures/contribution-summary";
+import { HyperstructureDetails } from "@/ui/components/hyperstructures/hyperstructure-details";
+import { HyperstructureResourceChip } from "@/ui/components/hyperstructures/hyperstructure-resource-chip";
+import Button from "@/ui/elements/button";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
+import TextInput from "@/ui/elements/text-input";
import { currencyIntlFormat, getEntityIdFromKeys, multiplyByPrecision, separateCamelCase } from "@/ui/utils/utils";
+import { getAddressNameFromEntity } from "@/utils/entities";
import {
Access,
calculateCompletionPoints,
@@ -23,9 +26,6 @@ import {
} from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { useMemo, useState } from "react";
-import { ContributionSummary } from "./ContributionSummary";
-import { HyperstructureDetails } from "./HyperstructureDetails";
-import { HyperstructureResourceChip } from "./HyperstructureResourceChip";
export enum DisplayedAccess {
Public = "Public",
@@ -48,7 +48,7 @@ export const HyperstructurePanel = ({ entity }: any) => {
network: { provider },
setup: {
systemCalls: { contribute_to_construction, set_access },
- components: { Hyperstructure },
+ components,
},
} = dojo;
@@ -66,18 +66,15 @@ export const HyperstructurePanel = ({ entity }: any) => {
const progresses = useHyperstructureProgress(entity.entity_id);
- const { useContributionsByPlayerAddress } = useContributions();
-
- const myContributions = useContributionsByPlayerAddress(BigInt(account.address), entity.entity_id);
+ const myContributions = usePlayerContributions(BigInt(account.address), entity.entity_id);
const updates = useHyperstructureUpdates(entity.entity_id);
const [newContributions, setNewContributions] = useState >({});
- const { getAddressNameFromEntity } = useEntitiesUtils();
- const ownerName = getAddressNameFromEntity(entity.entity_id);
+ const ownerName = getAddressNameFromEntity(entity.entity_id, components);
- const hyperstructure = useComponentValue(Hyperstructure, getEntityIdFromKeys([BigInt(entity.entity_id)]));
+ const hyperstructure = useComponentValue(components.Hyperstructure, getEntityIdFromKeys([BigInt(entity.entity_id)]));
const playerGuild = useMemo(() => getGuildFromPlayerAddress(ContractAddress(account.address)), []);
diff --git a/client/apps/game/src/ui/components/hyperstructures/HyperstructureResourceChip.tsx b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-resource-chip.tsx
similarity index 86%
rename from client/apps/game/src/ui/components/hyperstructures/HyperstructureResourceChip.tsx
rename to client/apps/game/src/ui/components/hyperstructures/hyperstructure-resource-chip.tsx
index 2831a85109..1a8efc3f6e 100644
--- a/client/apps/game/src/ui/components/hyperstructures/HyperstructureResourceChip.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/hyperstructure-resource-chip.tsx
@@ -1,13 +1,13 @@
-import { findResourceById, getIconResourceId, ID } from "@bibliothecadao/eternum";
-
-import { ProgressWithPercentage } from "@/hooks/helpers/useHyperstructures";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ProgressWithPercentage } from "@/hooks/helpers/use-hyperstructures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { currencyIntlFormat, divideByPrecision } from "@/ui/utils/utils";
+import { getBalance, getResourceProductionInfo } from "@/utils/resources";
+import { findResourceById, getIconResourceId, ID } from "@bibliothecadao/eternum";
import { useEffect, useState } from "react";
-import { ResourceIcon } from "../../elements/ResourceIcon";
type HyperstructureResourceChipProps = {
structureEntityId: ID;
@@ -26,12 +26,13 @@ export const HyperstructureResourceChip = ({
progress,
resetContributions,
}: HyperstructureResourceChipProps) => {
+ const dojo = useDojo();
+
const [inputValue, setInputValue] = useState(0);
const setTooltip = useUIStore((state) => state.setTooltip);
- const { getBalance, getResourceProductionInfo } = useResourceBalance();
- const balance = divideByPrecision(getBalance(structureEntityId, resourceId).balance);
- const production = getResourceProductionInfo(structureEntityId, resourceId);
+ const balance = divideByPrecision(getBalance(structureEntityId, resourceId, dojo.setup.components).balance);
+ const production = getResourceProductionInfo(structureEntityId, resourceId, dojo.setup.components);
const safetyMargin = production !== undefined && production?.consumption_rate !== 0n ? 0.95 : 1;
diff --git a/client/apps/game/src/ui/components/hyperstructures/Leaderboard.tsx b/client/apps/game/src/ui/components/hyperstructures/leaderboard.tsx
similarity index 81%
rename from client/apps/game/src/ui/components/hyperstructures/Leaderboard.tsx
rename to client/apps/game/src/ui/components/hyperstructures/leaderboard.tsx
index 95dbad1deb..7da7147f88 100644
--- a/client/apps/game/src/ui/components/hyperstructures/Leaderboard.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/leaderboard.tsx
@@ -1,11 +1,11 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useHyperstructureUpdates } from "@/hooks/helpers/useHyperstructures";
-import { useRealm } from "@/hooks/helpers/useRealm";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import Button from "@/ui/elements/Button";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useHyperstructureUpdates } from "@/hooks/helpers/use-hyperstructures";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import Button from "@/ui/elements/button";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { currencyIntlFormat, displayAddress, getEntityIdFromKeys } from "@/ui/utils/utils";
+import { getAddressName } from "@/utils/entities";
import { ContractAddress, ID, LeaderboardManager } from "@bibliothecadao/eternum";
import { getComponentValue } from "@dojoengine/recs";
import { useMemo, useState } from "react";
@@ -20,15 +20,11 @@ export const Leaderboard = ({
const dojo = useDojo();
const {
account: { account },
- setup: {
- components: { Owner },
- },
+ setup: { components },
} = dojo;
const { nextBlockTimestamp } = useNextBlockTimestamp();
- const { getAddressName } = useRealm();
-
const playerPointsLeaderboard = useMemo(() => {
return LeaderboardManager.instance(dojo.setup.components).getPlayersByRank(
nextBlockTimestamp || 0,
@@ -52,7 +48,7 @@ export const Leaderboard = ({
});
const isOwner = useMemo(() => {
- const owner = getComponentValue(Owner, getEntityIdFromKeys([BigInt(hyperstructureEntityId)]));
+ const owner = getComponentValue(components.Owner, getEntityIdFromKeys([BigInt(hyperstructureEntityId)]));
if (!owner) return false;
return ContractAddress(owner.address) === ContractAddress(account.address);
}, [hyperstructureEntityId]);
@@ -77,7 +73,7 @@ export const Leaderboard = ({
))}
{playerPointsLeaderboard.map(([address, points], index) => {
- const playerName = getAddressName(address) || "Player not found";
+ const playerName = getAddressName(address, components) || "Player not found";
const isOwner = address === ContractAddress(account.address);
diff --git a/client/apps/game/src/ui/components/hyperstructures/ResourceExchange.tsx b/client/apps/game/src/ui/components/hyperstructures/resource-exchange.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/hyperstructures/ResourceExchange.tsx
rename to client/apps/game/src/ui/components/hyperstructures/resource-exchange.tsx
index 56d0b38b0f..1a865ff11e 100644
--- a/client/apps/game/src/ui/components/hyperstructures/ResourceExchange.tsx
+++ b/client/apps/game/src/ui/components/hyperstructures/resource-exchange.tsx
@@ -1,9 +1,9 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useResourcesUtils } from "@/hooks/helpers/useResources";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { useDojo } from "@/hooks/context/dojo-context";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { currencyFormat, divideByPrecision, multiplyByPrecision } from "@/ui/utils/utils";
+import { getResourcesFromBalance } from "@/utils/resources";
import { ArmyInfo, ID, ResourcesIds } from "@bibliothecadao/eternum";
import { ArrowRight } from "lucide-react";
import { useMemo, useState } from "react";
@@ -25,13 +25,12 @@ export const ResourceExchange = ({
}: ResourceExchangeProps) => {
const {
setup: {
+ components,
account: { account },
systemCalls: { send_resources },
},
} = useDojo();
- const { getResourcesFromBalance } = useResourcesUtils();
-
const [loading, setLoading] = useState(false);
const [transferDirection, setTransferDirection] = useState<"to" | "from">("to");
const [resourcesGiven, setResourcesGiven] = useState>(
@@ -46,8 +45,8 @@ export const ResourceExchange = ({
),
);
- const giverArmyResources = useMemo(() => getResourcesFromBalance(giverArmyEntityId), [loading]);
- const takerArmyResources = useMemo(() => getResourcesFromBalance(takerArmy?.entity_id!), [loading]);
+ const giverArmyResources = useMemo(() => getResourcesFromBalance(giverArmyEntityId, components), [loading]);
+ const takerArmyResources = useMemo(() => getResourcesFromBalance(takerArmy?.entity_id!, components), [loading]);
const handleResourceGivenChange = (resourceId: number, amount: number) => {
setResourcesGiven({ ...resourcesGiven, [resourceId]: amount });
diff --git a/client/apps/game/src/ui/components/list/EntityList.tsx b/client/apps/game/src/ui/components/list/entity-list.tsx
similarity index 98%
rename from client/apps/game/src/ui/components/list/EntityList.tsx
rename to client/apps/game/src/ui/components/list/entity-list.tsx
index f03a72e482..59879dca0f 100644
--- a/client/apps/game/src/ui/components/list/EntityList.tsx
+++ b/client/apps/game/src/ui/components/list/entity-list.tsx
@@ -1,4 +1,4 @@
-import Button from "@/ui/elements/Button";
+import Button from "@/ui/elements/button";
import { DUMMY_HYPERSTRUCTURE_ENTITY_ID, ID } from "@bibliothecadao/eternum";
import clsx from "clsx";
import React, { useEffect, useState } from "react";
diff --git a/client/apps/game/src/ui/components/military/UserBattles.tsx b/client/apps/game/src/ui/components/military/UserBattles.tsx
deleted file mode 100644
index 8994b96708..0000000000
--- a/client/apps/game/src/ui/components/military/UserBattles.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { useUserBattles } from "@/hooks/helpers/battles/useBattles";
-import { BattleListItem } from "../battles/BattleListItem";
-
-export const UserBattles = () => {
- const battles = useUserBattles();
-
- return (
-
- {battles.length > 0 && (
- <>
- Your battles
- {battles
- .sort((a, b) => Number(a.duration_left) - Number(b.duration_left))
- .map((battle) => (
-
- ))}
- >
- )}
-
- );
-};
diff --git a/client/apps/game/src/ui/components/military/ArmyChip.tsx b/client/apps/game/src/ui/components/military/army-chip.tsx
similarity index 90%
rename from client/apps/game/src/ui/components/military/ArmyChip.tsx
rename to client/apps/game/src/ui/components/military/army-chip.tsx
index ef67635f21..e04a0e952a 100644
--- a/client/apps/game/src/ui/components/military/ArmyChip.tsx
+++ b/client/apps/game/src/ui/components/military/army-chip.tsx
@@ -1,24 +1,24 @@
import { ReactComponent as Inventory } from "@/assets/icons/common/bagpack.svg";
import { ReactComponent as Plus } from "@/assets/icons/common/plus-sign.svg";
import { ReactComponent as Swap } from "@/assets/icons/common/swap.svg";
-import { ReactComponent as Compass } from "@/assets/icons/Compass.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { getArmiesByPosition } from "@/hooks/helpers/useArmies";
-import { armyHasTroops } from "@/hooks/helpers/useQuests";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { Position as PositionInterface } from "@/types/Position";
-import { ArmyCapacity } from "@/ui/elements/ArmyCapacity";
-import Button from "@/ui/elements/Button";
-import { StaminaResource } from "@/ui/elements/StaminaResource";
+import { ReactComponent as Compass } from "@/assets/icons/compass.svg";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useArmiesAtPosition } from "@/hooks/helpers/use-armies";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { Position as PositionInterface } from "@/types/position";
+import { ArmyManagementCard, ViewOnMapIcon } from "@/ui/components/military/army-management-card";
+import { TroopDisplay } from "@/ui/components/military/troop-chip";
+import { InventoryResources } from "@/ui/components/resources/inventory-resources";
+import { Exchange } from "@/ui/components/structures/worldmap/structure-card";
+import { ArmyCapacity } from "@/ui/elements/army-capacity";
+import Button from "@/ui/elements/button";
+import { StaminaResource } from "@/ui/elements/stamina-resource";
+import { armyHasTroops } from "@/utils/army";
import { ArmyInfo, BattleManager, Position } from "@bibliothecadao/eternum";
import { LucideArrowRight } from "lucide-react";
import React, { Dispatch, SetStateAction, useMemo, useState } from "react";
import { useLocation } from "wouter";
-import { InventoryResources } from "../resources/InventoryResources";
-import { Exchange } from "../structures/worldmap/StructureCard";
-import { ArmyManagementCard, ViewOnMapIcon } from "./ArmyManagementCard";
-import { TroopDisplay } from "./TroopChip";
export const NavigateToPositionIcon = ({
position,
@@ -227,13 +227,11 @@ const ArmyMergeTroopsPanel = ({
}) => {
const [selectedReceiverArmy, setSelectedReceiverArmy] = useState(null);
- const getArmies = getArmiesByPosition();
+ const armiesAtPosition = useArmiesAtPosition({ position: giverArmy.position });
const armies = useMemo(() => {
- return getArmies({ x: giverArmy.position.x, y: giverArmy.position.y }).filter(
- (army) => army.entity_id !== giverArmy.entity_id,
- );
- }, [giverArmy]);
+ return armiesAtPosition.filter((army) => army.entity_id !== giverArmy.entity_id);
+ }, [giverArmy, armiesAtPosition]);
return (
diff --git a/client/apps/game/src/ui/components/military/ArmyList.tsx b/client/apps/game/src/ui/components/military/army-list.tsx
similarity index 87%
rename from client/apps/game/src/ui/components/military/ArmyList.tsx
rename to client/apps/game/src/ui/components/military/army-list.tsx
index a5e56e1890..be9aa7cef0 100644
--- a/client/apps/game/src/ui/components/military/ArmyList.tsx
+++ b/client/apps/game/src/ui/components/military/army-list.tsx
@@ -1,15 +1,14 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useArmiesByEntityOwner } from "@/hooks/helpers/useArmies";
-import { type PlayerStructure } from "@/hooks/helpers/useEntities";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { Headline } from "@/ui/elements/Headline";
-import { HintModalButton } from "@/ui/elements/HintModalButton";
-import { BuildingType, StructureType, TileManager } from "@bibliothecadao/eternum";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useArmiesByStructure } from "@/hooks/helpers/use-armies";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { HintSection } from "@/ui/components/hints/hint-modal";
+import { ArmyChip } from "@/ui/components/military/army-chip";
+import Button from "@/ui/elements/button";
+import { Headline } from "@/ui/elements/headline";
+import { HintModalButton } from "@/ui/elements/hint-modal-button";
+import { BuildingType, PlayerStructure, StructureType, TileManager } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
-import { HintSection } from "../hints/HintModal";
-import { ArmyChip } from "./ArmyChip";
const MAX_AMOUNT_OF_DEFENSIVE_ARMIES = 1;
@@ -29,8 +28,8 @@ export const EntityArmyList = ({ structure }: { structure: PlayerStructure }) =>
});
const existingBuildings = tileManager.existingBuildings();
- const { entityArmies: structureArmies } = useArmiesByEntityOwner({
- entity_owner_entity_id: structure?.entity_id || 0,
+ const { entityArmies: structureArmies } = useArmiesByStructure({
+ structureEntityId: structure?.entity_id || 0,
});
const {
diff --git a/client/apps/game/src/ui/components/military/ArmyManagementCard.tsx b/client/apps/game/src/ui/components/military/army-management-card.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/military/ArmyManagementCard.tsx
rename to client/apps/game/src/ui/components/military/army-management-card.tsx
index d8e3195f35..3d446a238e 100644
--- a/client/apps/game/src/ui/components/military/ArmyManagementCard.tsx
+++ b/client/apps/game/src/ui/components/military/army-management-card.tsx
@@ -1,13 +1,15 @@
import { ReactComponent as Pen } from "@/assets/icons/common/pen.svg";
import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
import { ReactComponent as Map } from "@/assets/icons/common/world.svg";
-
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import TextInput from "@/ui/elements/TextInput";
+import { configManager } from "@/dojo/setup";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useQuery } from "@/hooks/helpers/use-query";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { Position as PositionInterface } from "@/types/position";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import TextInput from "@/ui/elements/text-input";
import {
currencyFormat,
divideByPrecision,
@@ -16,16 +18,11 @@ import {
getEntityIdFromKeys,
multiplyByPrecision,
} from "@/ui/utils/utils";
-import { ID, Position, ResourcesIds, U32_MAX } from "@bibliothecadao/eternum";
+import { getBalance } from "@/utils/resources";
+import { ArmyInfo, ArmyManager, ID, Position, ResourcesIds, U32_MAX } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
-import { useCallback, useEffect, useMemo, useState } from "react";
-
-import { configManager } from "@/dojo/setup";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { Position as PositionInterface } from "@/types/Position";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { ArmyInfo, ArmyManager } from "@bibliothecadao/eternum";
import clsx from "clsx";
+import { useCallback, useEffect, useMemo, useState } from "react";
type ArmyManagementCardProps = {
owner_entity: ID;
@@ -52,7 +49,6 @@ export const ArmyManagementCard = ({ owner_entity, army, setSelectedEntity }: Ar
const isDefendingArmy = Boolean(army?.protectee);
const [confirmDelete, setConfirmDelete] = useState(false);
- const { getBalance } = useResourceBalance();
const [isLoading, setIsLoading] = useState(false);
const [canCreate, setCanCreate] = useState(false);
@@ -138,7 +134,7 @@ export const ArmyManagementCard = ({ owner_entity, army, setSelectedEntity }: Ar
let canCreate = true;
Object.keys(troopCounts).forEach((troopId) => {
const count = troopCounts[Number(troopId)];
- const balance = getBalance(owner_entity, Number(troopId)).balance;
+ const balance = getBalance(owner_entity, Number(troopId), dojo.setup.components).balance;
if (count > balance) {
canCreate = false;
}
@@ -251,7 +247,7 @@ export const ArmyManagementCard = ({ owner_entity, army, setSelectedEntity }: Ar
{troops.map((troop) => {
- const balance = getBalance(owner_entity, troop.name).balance;
+ const balance = getBalance(owner_entity, troop.name, dojo.setup.components).balance;
return (
diff --git a/client/apps/game/src/ui/components/military/EntitiesArmyTable.tsx b/client/apps/game/src/ui/components/military/entities-army-table.tsx
similarity index 77%
rename from client/apps/game/src/ui/components/military/EntitiesArmyTable.tsx
rename to client/apps/game/src/ui/components/military/entities-army-table.tsx
index 8191c173a7..289225d036 100644
--- a/client/apps/game/src/ui/components/military/EntitiesArmyTable.tsx
+++ b/client/apps/game/src/ui/components/military/entities-army-table.tsx
@@ -1,20 +1,20 @@
-import { useArmiesByEntityOwner } from "@/hooks/helpers/useArmies";
-import { useEntities } from "@/hooks/helpers/useEntities";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { Headline } from "@/ui/elements/Headline";
-import { HintModalButton } from "@/ui/elements/HintModalButton";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { BattleSimulation } from "@/ui/modules/simulation/BattleSimulation";
+import { useArmiesByStructure } from "@/hooks/helpers/use-armies";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { HintSection } from "@/ui/components/hints/hint-modal";
+import { ArmyChip } from "@/ui/components/military/army-chip";
+import { battleSimulation, pillageSimulation } from "@/ui/components/navigation/config";
+import Button from "@/ui/elements/button";
+import { Headline } from "@/ui/elements/headline";
+import { HintModalButton } from "@/ui/elements/hint-modal-button";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { BattleSimulation } from "@/ui/modules/simulation/battle-simulation";
import { PillageSimulation } from "@/ui/modules/simulation/pillage-simulation";
import { divideByPrecisionFormatted } from "@/ui/utils/utils";
import { ArmyInfo, ID, ResourcesIds } from "@bibliothecadao/eternum";
-import { HintSection } from "../hints/HintModal";
-import { battleSimulation, pillageSimulation } from "../navigation/Config";
-import { ArmyChip } from "./ArmyChip";
export const EntitiesArmyTable = () => {
- const { playerStructures } = useEntities();
+ const playerStructures = usePlayerStructures();
const togglePopup = useUIStore((state) => state.togglePopup);
return (
@@ -29,7 +29,7 @@ export const EntitiesArmyTable = () => {
- {playerStructures().map((entity: any, index: number) => {
+ {playerStructures.map((entity: any, index: number) => {
return (
@@ -52,7 +52,7 @@ const EntityArmyTable = ({ structureEntityId }: { structureEntityId: ID | undefi
if (!structureEntityId) {
return Entity not found ;
}
- const { entityArmies } = useArmiesByEntityOwner({ entity_owner_entity_id: structureEntityId });
+ const { entityArmies } = useArmiesByStructure({ structureEntityId });
const totalTroops = entityArmies.reduce(
(acc, army: ArmyInfo) => {
diff --git a/client/apps/game/src/ui/components/military/PillageHistory.tsx b/client/apps/game/src/ui/components/military/pillage-history.tsx
similarity index 81%
rename from client/apps/game/src/ui/components/military/PillageHistory.tsx
rename to client/apps/game/src/ui/components/military/pillage-history.tsx
index c696d77ce0..fb8ef417e5 100644
--- a/client/apps/game/src/ui/components/military/PillageHistory.tsx
+++ b/client/apps/game/src/ui/components/military/pillage-history.tsx
@@ -1,21 +1,21 @@
-import { ClientComponents } from "@/dojo/createClientComponents";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
-import TwitterShareButton from "@/ui/elements/TwitterShareButton";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ResourceCost } from "@/ui/elements/resource-cost";
+import TwitterShareButton from "@/ui/elements/twitter-share-button";
import { formatSocialText, twitterTemplates } from "@/ui/socials";
import { divideByPrecision, formatNumber, formatResources, formatTime } from "@/ui/utils/utils";
-import { BattleSide, ID, Resource, resources } from "@bibliothecadao/eternum";
+import { getAddressNameFromEntity, getPlayerAddressFromEntity } from "@/utils/entities";
+import { BattleSide, ClientComponents, ID, Resource, resources } from "@bibliothecadao/eternum";
import { ComponentValue, defineQuery, getComponentValue, HasValue, isComponentUpdate } from "@dojoengine/recs";
import { useEffect, useMemo, useState } from "react";
import { env } from "../../../../env";
-import { TroopDisplay } from "./TroopChip";
+import { TroopDisplay } from "./troop-chip";
type PillageEvent = ComponentValue;
const PillageHistoryItem = ({ addressName, history }: { addressName: string; history: PillageEvent }) => {
const {
setup: {
+ components,
account: { account },
},
} = useDojo();
@@ -23,24 +23,22 @@ const PillageHistoryItem = ({ addressName, history }: { addressName: string; his
const isSuccess = history.winner === BattleSide[BattleSide.Attack];
const formattedResources = useMemo(() => formatResources(history.pillaged_resources), [history.pillaged_resources]);
- const { getPlayerAddressFromEntity, getAddressNameFromEntity } = useEntitiesUtils();
-
const attackerIsPlayer = useMemo(
- () => getPlayerAddressFromEntity(history.pillager_army_entity_id) === BigInt(account.address),
+ () => getPlayerAddressFromEntity(history.pillager_army_entity_id, components) === BigInt(account.address),
[getPlayerAddressFromEntity, history.pillager_army_entity_id, account.address],
);
const twitterText = useMemo(() => {
if (isSuccess && formattedResources.length > 0 && attackerIsPlayer) {
return formatSocialText(twitterTemplates.pillage, {
- enemyName: getAddressNameFromEntity(history.pillaged_structure_entity_id) || "Unknown",
+ enemyName: getAddressNameFromEntity(history.pillaged_structure_entity_id, components) || "Unknown",
addressName,
resources: formattedResources
.map(
(pillagedResource) =>
- `${formatNumber(divideByPrecision(pillagedResource.amount), 0)} ${resources.find(
- (resource) => resource.id === pillagedResource.resourceId,
- )?.trait}`,
+ `${formatNumber(divideByPrecision(pillagedResource.amount), 0)} ${
+ resources.find((resource) => resource.id === pillagedResource.resourceId)?.trait
+ }`,
)
.join(", "),
url: env.VITE_SOCIAL_LINK,
@@ -125,28 +123,28 @@ const PillageHistoryItem = ({ addressName, history }: { addressName: string; his
export const PillageHistory = ({ structureId }: { structureId: ID }) => {
const {
- setup: {
- components: { events },
- },
+ setup: { components },
} = useDojo();
const [pillageHistory, setPillageHistory] = useState([]);
- const { getAddressNameFromEntity } = useEntitiesUtils();
useEffect(() => {
- const query = defineQuery([HasValue(events.BattlePillageData, { pillaged_structure_entity_id: structureId })], {
- runOnInit: true,
- });
+ const query = defineQuery(
+ [HasValue(components.events.BattlePillageData, { pillaged_structure_entity_id: structureId })],
+ {
+ runOnInit: true,
+ },
+ );
const subscription = query.update$.subscribe((update) => {
- if (isComponentUpdate(update, events.BattlePillageData)) {
- const event = getComponentValue(events.BattlePillageData, update.entity);
+ if (isComponentUpdate(update, components.events.BattlePillageData)) {
+ const event = getComponentValue(components.events.BattlePillageData, update.entity);
setPillageHistory((prev) => [event!, ...prev]);
}
});
return () => subscription.unsubscribe();
- }, [events.BattlePillageData, structureId]);
+ }, [components.events.BattlePillageData, structureId]);
return (
@@ -156,7 +154,7 @@ export const PillageHistory = ({ structureId }: { structureId: ID }) => {
.sort((a, b) => b.timestamp - a.timestamp)
.slice(0, 20)
.map((history, index) => {
- const addressName = getAddressNameFromEntity(history.pillager_army_entity_id);
+ const addressName = getAddressNameFromEntity(history.pillager_army_entity_id, components);
return ;
})}
diff --git a/client/apps/game/src/ui/components/military/TroopChip.tsx b/client/apps/game/src/ui/components/military/troop-chip.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/military/TroopChip.tsx
rename to client/apps/game/src/ui/components/military/troop-chip.tsx
index ede4ff5a0b..49fdc11c7d 100644
--- a/client/apps/game/src/ui/components/military/TroopChip.tsx
+++ b/client/apps/game/src/ui/components/military/troop-chip.tsx
@@ -1,6 +1,6 @@
-import { ClientComponents } from "@/dojo/createClientComponents";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { currencyFormat } from "@/ui/utils/utils";
+import { ClientComponents } from "@bibliothecadao/eternum";
import { ComponentValue } from "@dojoengine/recs";
export const TroopDisplay = ({
diff --git a/client/apps/game/src/ui/components/military/user-battles.tsx b/client/apps/game/src/ui/components/military/user-battles.tsx
new file mode 100644
index 0000000000..f3aa66fcaa
--- /dev/null
+++ b/client/apps/game/src/ui/components/military/user-battles.tsx
@@ -0,0 +1,21 @@
+import { usePlayerBattles } from "@/hooks/helpers/use-battles";
+import { BattleListItem } from "@/ui/components/battles/battle-list-item";
+
+export const UserBattles = () => {
+ const battleEntityIds = usePlayerBattles();
+
+ return (
+
+ {battleEntityIds.length > 0 && (
+ <>
+ Your battles
+ {battleEntityIds
+ // .sort((a, b) => Number(a.duration_left) - Number(b.duration_left))
+ .map((id) => (
+
+ ))}
+ >
+ )}
+
+ );
+};
diff --git a/client/apps/game/src/ui/components/ModalContainer.tsx b/client/apps/game/src/ui/components/modal-container.tsx
similarity index 92%
rename from client/apps/game/src/ui/components/ModalContainer.tsx
rename to client/apps/game/src/ui/components/modal-container.tsx
index 78a1fccb46..7f6dd7f2f2 100644
--- a/client/apps/game/src/ui/components/ModalContainer.tsx
+++ b/client/apps/game/src/ui/components/modal-container.tsx
@@ -1,7 +1,7 @@
-import { useModalStore } from "@/hooks/store/useModalStore";
+import { useModalStore } from "@/hooks/store/use-modal-store";
+import Button from "@/ui/elements/button";
import { X } from "lucide-react";
import { useCallback, useEffect } from "react";
-import Button from "../elements/Button";
interface ModalContainerProps {
children: React.ReactNode;
diff --git a/client/apps/game/src/ui/components/navigation/Config.tsx b/client/apps/game/src/ui/components/navigation/config.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/navigation/Config.tsx
rename to client/apps/game/src/ui/components/navigation/config.tsx
index bed9393f5c..e12fd5cc63 100644
--- a/client/apps/game/src/ui/components/navigation/Config.tsx
+++ b/client/apps/game/src/ui/components/navigation/config.tsx
@@ -1,4 +1,4 @@
-import { HintSection } from "../hints/HintModal";
+import { HintSection } from "../hints/hint-modal";
type OSWindows =
| "World Structures"
diff --git a/client/apps/game/src/ui/components/navigation/OSWindow.tsx b/client/apps/game/src/ui/components/navigation/os-window.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/navigation/OSWindow.tsx
rename to client/apps/game/src/ui/components/navigation/os-window.tsx
index 17ea274844..8b521db5fd 100644
--- a/client/apps/game/src/ui/components/navigation/OSWindow.tsx
+++ b/client/apps/game/src/ui/components/navigation/os-window.tsx
@@ -1,7 +1,7 @@
import { IS_MOBILE } from "@/ui/config";
import { motion } from "framer-motion";
-import { SecondaryPopup } from "../../elements/SecondaryPopup";
-import { ExpandableOSInterface, OSInterface } from "./Config";
+import { SecondaryPopup } from "../../elements/secondary-popup";
+import { ExpandableOSInterface, OSInterface } from "./config";
export const OSWindow = ({
onClick,
diff --git a/client/apps/game/src/ui/components/overlays/OrientationOverlay.tsx b/client/apps/game/src/ui/components/overlays/orientation-overlay.tsx
similarity index 100%
rename from client/apps/game/src/ui/components/overlays/OrientationOverlay.tsx
rename to client/apps/game/src/ui/components/overlays/orientation-overlay.tsx
diff --git a/client/apps/game/src/ui/components/pwa-update-popup.tsx b/client/apps/game/src/ui/components/pwa-update-popup.tsx
index 301390c617..4f3d51db9c 100644
--- a/client/apps/game/src/ui/components/pwa-update-popup.tsx
+++ b/client/apps/game/src/ui/components/pwa-update-popup.tsx
@@ -1,4 +1,4 @@
-import Button from "@/ui/elements/Button";
+import Button from "@/ui/elements/button";
interface PWAUpdatePopupProps {
onUpdate: () => void;
diff --git a/client/apps/game/src/ui/components/quest/questDetails.tsx b/client/apps/game/src/ui/components/quest/quest-details.ts
similarity index 93%
rename from client/apps/game/src/ui/components/quest/questDetails.tsx
rename to client/apps/game/src/ui/components/quest/quest-details.ts
index b6b3809839..d7e7ab357c 100644
--- a/client/apps/game/src/ui/components/quest/questDetails.tsx
+++ b/client/apps/game/src/ui/components/quest/quest-details.ts
@@ -1,5 +1,4 @@
-import { Prize } from "@/hooks/helpers/useQuests";
-import { QuestType } from "@bibliothecadao/eternum";
+import { Prize, QuestType } from "@bibliothecadao/eternum";
interface StaticQuestInfo {
name: string;
diff --git a/client/apps/game/src/ui/components/quest/steps/buildFoodSteps.tsx b/client/apps/game/src/ui/components/quest/steps/build-food-steps.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/quest/steps/buildFoodSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/build-food-steps.tsx
index dfdf62d0d7..550f9dc070 100644
--- a/client/apps/game/src/ui/components/quest/steps/buildFoodSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/build-food-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/buildResourceSteps.tsx b/client/apps/game/src/ui/components/quest/steps/build-resource-steps.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/quest/steps/buildResourceSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/build-resource-steps.tsx
index 78ad13ef4f..a648ad8885 100644
--- a/client/apps/game/src/ui/components/quest/steps/buildResourceSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/build-resource-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/createAttackArmy.tsx b/client/apps/game/src/ui/components/quest/steps/create-attack-army.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/quest/steps/createAttackArmy.tsx
rename to client/apps/game/src/ui/components/quest/steps/create-attack-army.tsx
index 7753a84767..0026ce8466 100644
--- a/client/apps/game/src/ui/components/quest/steps/createAttackArmy.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/create-attack-army.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/createDefenseArmySteps.tsx b/client/apps/game/src/ui/components/quest/steps/create-defense-army-steps.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/quest/steps/createDefenseArmySteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/create-defense-army-steps.tsx
index 967fd826e8..a4ba212bbc 100644
--- a/client/apps/game/src/ui/components/quest/steps/createDefenseArmySteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/create-defense-army-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/createTradeSteps.tsx b/client/apps/game/src/ui/components/quest/steps/create-trade-steps.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/quest/steps/createTradeSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/create-trade-steps.tsx
index d5b860d71a..357c28d7e6 100644
--- a/client/apps/game/src/ui/components/quest/steps/createTradeSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/create-trade-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/pauseProductionSteps.tsx b/client/apps/game/src/ui/components/quest/steps/pause-production-steps.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/quest/steps/pauseProductionSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/pause-production-steps.tsx
index 19de7a152c..c368964746 100644
--- a/client/apps/game/src/ui/components/quest/steps/pauseProductionSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/pause-production-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { BUILDINGS_CENTER } from "@bibliothecadao/eternum";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/settleSteps.tsx b/client/apps/game/src/ui/components/quest/steps/settle-steps.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/quest/steps/settleSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/settle-steps.tsx
index d32bc800e0..a429378d90 100644
--- a/client/apps/game/src/ui/components/quest/steps/settleSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/settle-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton, waitForElement } from "./utils";
diff --git a/client/apps/game/src/ui/components/quest/steps/travelSteps.tsx b/client/apps/game/src/ui/components/quest/steps/travel-steps.tsx
similarity index 89%
rename from client/apps/game/src/ui/components/quest/steps/travelSteps.tsx
rename to client/apps/game/src/ui/components/quest/steps/travel-steps.tsx
index 96329909f7..7361cad7b1 100644
--- a/client/apps/game/src/ui/components/quest/steps/travelSteps.tsx
+++ b/client/apps/game/src/ui/components/quest/steps/travel-steps.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LeftView } from "@/ui/modules/navigation/LeftNavigationModule";
-import { RightView } from "@/ui/modules/navigation/RightNavigationModule";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
+import { RightView } from "@/ui/modules/navigation/right-navigation-module";
import { StepOptions } from "shepherd.js";
import { StepButton } from "./utils";
diff --git a/client/apps/game/src/ui/components/resources/DepositResources.tsx b/client/apps/game/src/ui/components/resources/deposit-resources.tsx
similarity index 85%
rename from client/apps/game/src/ui/components/resources/DepositResources.tsx
rename to client/apps/game/src/ui/components/resources/deposit-resources.tsx
index 2be3e0e4b0..aade33beb7 100644
--- a/client/apps/game/src/ui/components/resources/DepositResources.tsx
+++ b/client/apps/game/src/ui/components/resources/deposit-resources.tsx
@@ -1,11 +1,10 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { ArrivalInfo } from "@/hooks/helpers/use-resource-arrivals";
-import { useStructureByEntityId } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import { soundSelector, useUiSounds } from "@/hooks/useUISound";
-import Button from "@/ui/elements/Button";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useStructureByEntityId } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
+import Button from "@/ui/elements/button";
import { getEntityIdFromKeys } from "@/ui/utils/utils";
-import { BattleManager, ID, Resource, ResourceInventoryManager } from "@bibliothecadao/eternum";
+import { ArrivalInfo, BattleManager, ID, Resource, ResourceInventoryManager } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { useMemo, useState } from "react";
diff --git a/client/apps/game/src/ui/components/resources/EntityResourceTable.tsx b/client/apps/game/src/ui/components/resources/entity-resource-table.tsx
similarity index 90%
rename from client/apps/game/src/ui/components/resources/EntityResourceTable.tsx
rename to client/apps/game/src/ui/components/resources/entity-resource-table.tsx
index 6657507075..7ec846bc96 100644
--- a/client/apps/game/src/ui/components/resources/EntityResourceTable.tsx
+++ b/client/apps/game/src/ui/components/resources/entity-resource-table.tsx
@@ -1,12 +1,12 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
+import { useDojo } from "@/hooks/context/dojo-context";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { ResourceChip } from "@/ui/components/resources/resource-chip";
import { getEntityIdFromKeys, gramToKg, multiplyByPrecision } from "@/ui/utils/utils";
import { BuildingType, CapacityConfigCategory, ID, RESOURCE_TIERS, StructureType } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { getComponentValue } from "@dojoengine/recs";
import { useMemo } from "react";
-import { ResourceChip } from "./ResourceChip";
export const EntityResourceTable = ({ entityId }: { entityId: ID | undefined }) => {
const dojo = useDojo();
diff --git a/client/apps/game/src/ui/components/resources/InventoryResources.tsx b/client/apps/game/src/ui/components/resources/inventory-resources.tsx
similarity index 84%
rename from client/apps/game/src/ui/components/resources/InventoryResources.tsx
rename to client/apps/game/src/ui/components/resources/inventory-resources.tsx
index 235d28010f..67ae4ddd0e 100644
--- a/client/apps/game/src/ui/components/resources/InventoryResources.tsx
+++ b/client/apps/game/src/ui/components/resources/inventory-resources.tsx
@@ -1,8 +1,8 @@
-import { debouncedAddToSubscription } from "@/dojo/debouncedQueries";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useResourceBalance, useResourcesUtils } from "@/hooks/helpers/useResources";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
+import { debouncedAddToSubscription } from "@/dojo/debounced-queries";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ResourceCost } from "@/ui/elements/resource-cost";
import { divideByPrecision } from "@/ui/utils/utils";
+import { getBalance, getInventoryResources } from "@/utils/resources";
import { ID, Resource, ResourcesIds } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
@@ -27,15 +27,22 @@ export const InventoryResources = ({
const dojo = useDojo();
const [showAll, setShowAll] = useState(false);
- const { useResourcesFromBalance } = useResourcesUtils();
- const { getBalance } = useResourceBalance();
- const inventoriesResources = useResourcesFromBalance(entityId);
+ const inventoriesResources = useMemo(
+ () => getInventoryResources(entityId, dojo.setup.components),
+ [entityId, dojo.setup.components],
+ );
const [isSyncing, setIsSyncing] = useState(false);
const dynamicResources = useMemo(
- () => dynamic.map((resourceId): Resource => ({ resourceId, amount: getBalance(entityId, resourceId).balance })),
+ () =>
+ dynamic.map(
+ (resourceId): Resource => ({
+ resourceId,
+ amount: getBalance(entityId, resourceId, dojo.setup.components).balance,
+ }),
+ ),
[dynamic, entityId, getBalance],
);
diff --git a/client/apps/game/src/ui/components/resources/RealmResourcesIO.tsx b/client/apps/game/src/ui/components/resources/realm-resources-io.tsx
similarity index 78%
rename from client/apps/game/src/ui/components/resources/RealmResourcesIO.tsx
rename to client/apps/game/src/ui/components/resources/realm-resources-io.tsx
index 08ca68215b..35dcc38578 100644
--- a/client/apps/game/src/ui/components/resources/RealmResourcesIO.tsx
+++ b/client/apps/game/src/ui/components/resources/realm-resources-io.tsx
@@ -1,8 +1,10 @@
import { configManager } from "@/dojo/setup";
-import { useGetRealm } from "@/hooks/helpers/useRealm";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { unpackResources } from "@/ui/utils/packedData";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { unpackResources } from "@/ui/utils/packed-data";
+import { getRealmInfo } from "@/utils/realm";
import { ID, ResourcesIds } from "@bibliothecadao/eternum";
+import { getEntityIdFromKeys } from "@dojoengine/utils";
export const RealmResourcesIO = ({
realmEntityId,
@@ -10,12 +12,13 @@ export const RealmResourcesIO = ({
titleClassName,
size = "xs",
}: {
- realmEntityId?: ID;
+ realmEntityId: ID;
className?: string;
titleClassName?: string;
size?: "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
}) => {
- const { realm } = useGetRealm(realmEntityId);
+ const dojo = useDojo();
+ const realm = getRealmInfo(getEntityIdFromKeys([BigInt(realmEntityId)]), dojo.setup.components);
const resourcesProduced = realm ? unpackResources(realm.resourceTypesPacked) : [];
const resourcesInputs = configManager.resourceInputs;
diff --git a/client/apps/game/src/ui/components/resources/realm-transfer.tsx b/client/apps/game/src/ui/components/resources/realm-transfer.tsx
index 31bd232538..a0f10565a8 100644
--- a/client/apps/game/src/ui/components/resources/realm-transfer.tsx
+++ b/client/apps/game/src/ui/components/resources/realm-transfer.tsx
@@ -1,18 +1,17 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { PlayerStructure, useEntities } from "@/hooks/helpers/useEntities";
-import { useResourceManager } from "@/hooks/helpers/useResources";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import { useResourceManager } from "@/hooks/helpers/use-resources";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { OSWindow } from "@/ui/components/navigation/os-window";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { calculateDonkeysNeeded, currencyFormat, getTotalResourceWeight, multiplyByPrecision } from "@/ui/utils/utils";
-import { EternumGlobalConfig, ResourcesIds, findResourceById } from "@bibliothecadao/eternum";
-import { Dispatch, SetStateAction, memo, useCallback, useEffect, useMemo, useState } from "react";
-
-import { ID } from "@bibliothecadao/eternum";
+import { ID, PlayerStructure, RESOURCE_PRECISION, ResourcesIds, findResourceById } from "@bibliothecadao/eternum";
import { ArrowLeftIcon, ArrowRightIcon } from "lucide-react";
+import { Dispatch, SetStateAction, memo, useCallback, useEffect, useMemo, useState } from "react";
import { num } from "starknet";
-import { OSWindow } from "../navigation/OSWindow";
+
type transferCall = {
structureId: ID;
@@ -35,7 +34,7 @@ export const RealmTransfer = memo(
const isOpen = useUIStore((state) => state.isPopupOpen(resource.toString()));
const selectedStructureEntityId = useUIStore((state) => state.structureEntityId);
- const { playerStructures } = useEntities();
+ const playerStructures = usePlayerStructures();
const [isLoading, setIsLoading] = useState(false);
const [calls, setCalls] = useState([]);
@@ -64,7 +63,7 @@ export const RealmTransfer = memo(
const cleanedCalls = calls.map(({ sender_entity_id, recipient_entity_id, resources }) => ({
sender_entity_id,
recipient_entity_id,
- resources: [resources[0], BigInt(Number(resources[1]) * EternumGlobalConfig.resources.resourcePrecision)],
+ resources: [resources[0], BigInt(Number(resources[1]) * RESOURCE_PRECISION)],
}));
try {
@@ -109,7 +108,7 @@ export const RealmTransfer = memo(
{currencyFormat(balance ? Number(balance) : 0, 2)}
- {playerStructures().map((structure) => (
+ {playerStructures.map((structure) => (
{
- let netRate = resourceManager.netRate();
- if (netRate[1] < 0) {
- // net rate is negative
- if (Math.abs(netRate[1]) > resourceManager.balance(useUIStore.getState().currentDefaultTick)) {
- return 0;
- }
- }
- return netRate[1];
- }, [resourceManager, production]);
+ const productionRate = useMemo(() => {
+ return Number(divideByPrecision(Number(production?.production_rate || 0)));
+ }, [production]);
+
+ const productionEndsAt = useMemo(() => {
+ return resourceManager.getProductionEndsAt();
+ }, [production]);
+
useEffect(() => {
const tickTime = configManager.getTick(TickIds.Default) * 1000;
let realTick = useUIStore.getState().currentDefaultTick;
- const resource = resourceManager.getResource();
- const [sign, rate] = resourceManager.netRate();
-
- const productionDuration = resourceManager.productionDuration(realTick);
- const depletionDuration = resourceManager.depletionDuration(realTick);
-
- const newBalance = resourceManager.balanceFromComponents(
- resourceId,
- rate,
- sign,
- resource?.balance,
- productionDuration,
- depletionDuration,
- );
-
+ const newBalance = resourceManager.balance(realTick);
setBalance(newBalance);
- if (Math.abs(netRate) > 0) {
+ if (Math.abs(productionRate) > 0) {
const interval = setInterval(() => {
realTick += 1;
- const localResource = resourceManager.getResource();
- const localProductionDuration = resourceManager.productionDuration(realTick);
- const localDepletionDuration = resourceManager.depletionDuration(realTick);
-
- const newBalance = resourceManager.balanceFromComponents(
- resourceId,
- rate,
- netRate > 0,
- localResource?.balance,
- localProductionDuration,
- localDepletionDuration,
- );
-
+ const newBalance = resourceManager.balance(realTick);
setBalance(newBalance);
}, tickTime);
return () => clearInterval(interval);
}
- }, [setBalance, resourceManager, netRate, resourceId, production]);
+ }, [setBalance, resourceManager, resourceId, production]);
- const isConsumingInputsWithoutOutput = useMemo(() => {
- if (!production?.production_rate) return false;
- return resourceManager.isConsumingInputsWithoutOutput(useUIStore.getState().currentDefaultTick);
- }, [resourceManager, production, entityId]);
const icon = useMemo(
() => (
@@ -124,17 +91,8 @@ export const ResourceChip = ({
);
const reachedMaxCap = useMemo(() => {
- return maxAmountStorable === balance && Math.abs(netRate) > 0;
- }, [maxAmountStorable, balance, netRate]);
-
- const timeUntilFinishTick = useMemo(() => {
- return resourceManager.timeUntilFinishTick(useUIStore.getState().currentDefaultTick);
- }, [resourceManager, production]);
-
- const isProducingOrConsuming = useMemo(() => {
- if (netRate > 0 && timeUntilFinishTick <= 0) return false;
- return Math.abs(netRate) > 0 && !reachedMaxCap && !isConsumingInputsWithoutOutput && balance > 0;
- }, [netRate, reachedMaxCap, isConsumingInputsWithoutOutput, balance, timeUntilFinishTick]);
+ return maxAmountStorable === balance && Math.abs(productionRate) > 0;
+ }, [maxAmountStorable, balance, production]);
const handleMouseEnter = useCallback(() => {
setTooltip({
@@ -172,17 +130,17 @@ export const ResourceChip = ({
: ""}
- {isProducingOrConsuming ? (
+ {Math.abs(productionRate) > 0 && productionEndsAt > useUIStore.getState().currentDefaultTick ? (
- {parseFloat(netRate.toString()) < 0 ? "" : "+"}
+ +
{showPerHour
- ? `${currencyIntlFormat(netRate * 3.6, 2)}/h`
- : `${currencyIntlFormat(netRate / 1000, 2)}/s`}
+ ? `${currencyIntlFormat(productionRate * 60 * 60, 2)}/h`
+ : `${currencyIntlFormat(productionRate, 2)}/s`}
) : (
@@ -192,9 +150,9 @@ export const ResourceChip = ({
position: "top",
content: (
<>
- {isConsumingInputsWithoutOutput
- ? "Production has stopped because inputs have been depleted"
- : "Production has stopped because the max balance has been reached"}
+ {reachedMaxCap
+ ? "Production has stopped because the max balance has been reached"
+ : "Production has stopped because labor has been depleted"}
>
),
});
@@ -204,7 +162,7 @@ export const ResourceChip = ({
}}
className="self-center px-2 col-span-3 mx-auto"
>
- {isConsumingInputsWithoutOutput || reachedMaxCap ? "⚠️" : ""}
+ {reachedMaxCap ? "MaxCap" : ""}
)}
diff --git a/client/apps/game/src/ui/components/resources/TravelInfo.tsx b/client/apps/game/src/ui/components/resources/travel-info.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/resources/TravelInfo.tsx
rename to client/apps/game/src/ui/components/resources/travel-info.tsx
index 26cf065000..8fe8264ea4 100644
--- a/client/apps/game/src/ui/components/resources/TravelInfo.tsx
+++ b/client/apps/game/src/ui/components/resources/travel-info.tsx
@@ -1,7 +1,7 @@
import { configManager } from "@/dojo/setup";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
+import { useDojo } from "@/hooks/context/dojo-context";
import { GRAMS_PER_KG } from "@/ui/constants";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import {
calculateDonkeysNeeded,
currencyFormat,
@@ -9,6 +9,7 @@ import {
getTotalResourceWeight,
multiplyByPrecision,
} from "@/ui/utils/utils";
+import { getBalance } from "@/utils/resources";
import { ResourcesIds, type ID, type Resource } from "@bibliothecadao/eternum";
import { useEffect, useMemo, useState } from "react";
@@ -25,19 +26,19 @@ export const TravelInfo = ({
setCanCarry?: (canContinue: boolean) => void;
isAmm?: boolean;
}) => {
+ const dojo = useDojo();
+
const [resourceWeight, setResourceWeight] = useState(0);
const [donkeyBalance, setDonkeyBalance] = useState(0);
const neededDonkeys = useMemo(() => calculateDonkeysNeeded(resourceWeight), [resourceWeight]);
- const { getBalance } = useResourceBalance();
-
useEffect(() => {
const totalWeight = getTotalResourceWeight(resources);
const multipliedWeight = multiplyByPrecision(totalWeight);
setResourceWeight(multipliedWeight);
- const { balance } = getBalance(entityId, ResourcesIds.Donkey);
+ const { balance } = getBalance(entityId, ResourcesIds.Donkey, dojo.setup.components);
const currentDonkeyAmount = isAmm ? 0 : resources.find((r) => r.resourceId === ResourcesIds.Donkey)?.amount || 0;
diff --git a/client/apps/game/src/ui/components/structures/construction/StructureCard.tsx b/client/apps/game/src/ui/components/structures/construction/structure-card.tsx
similarity index 91%
rename from client/apps/game/src/ui/components/structures/construction/StructureCard.tsx
rename to client/apps/game/src/ui/components/structures/construction/structure-card.tsx
index 3d00e0da74..8ff368e1c0 100644
--- a/client/apps/game/src/ui/components/structures/construction/StructureCard.tsx
+++ b/client/apps/game/src/ui/components/structures/construction/structure-card.tsx
@@ -1,9 +1,9 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { ResourcesIds, StructureType } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { InfoIcon } from "lucide-react";
-import { STRUCTURE_IMAGE_PATHS } from "./StructureConstructionMenu";
+import { STRUCTURE_IMAGE_PATHS } from "./structure-construction-menu";
export const StructureCard = ({
structureId,
diff --git a/client/apps/game/src/ui/components/structures/construction/StructureConstructionMenu.tsx b/client/apps/game/src/ui/components/structures/construction/structure-construction-menu.tsx
similarity index 82%
rename from client/apps/game/src/ui/components/structures/construction/StructureConstructionMenu.tsx
rename to client/apps/game/src/ui/components/structures/construction/structure-construction-menu.tsx
index f888d5f859..ee6e50b97e 100644
--- a/client/apps/game/src/ui/components/structures/construction/StructureConstructionMenu.tsx
+++ b/client/apps/game/src/ui/components/structures/construction/structure-construction-menu.tsx
@@ -1,21 +1,24 @@
import { configManager } from "@/dojo/setup";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
-import useUIStore from "@/hooks/store/useUIStore";
-import { Headline } from "@/ui/elements/Headline";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
+import { useDojo } from "@/hooks/context/dojo-context";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { StructureCard } from "@/ui/components/structures/construction/structure-card";
+import { Headline } from "@/ui/elements/headline";
+import { ResourceCost } from "@/ui/elements/resource-cost";
import { multiplyByPrecision } from "@/ui/utils/utils";
+import { ETERNUM_CONFIG } from "@/utils/config";
+import { getBalance } from "@/utils/resources";
import {
- EternumGlobalConfig,
- HYPERSTRUCTURE_CONSTRUCTION_COSTS_SCALED,
- HYPERSTRUCTURE_CREATION_COSTS,
ID,
+ RESOURCE_PRECISION,
ResourceTier,
ResourcesIds,
StructureType,
+ scaleResourceCostMinMax
} from "@bibliothecadao/eternum";
import React from "react";
-import { StructureCard } from "./StructureCard";
+
+const eternumConfig = await ETERNUM_CONFIG();
const STRUCTURE_IMAGE_PREFIX = "/images/buildings/thumb/";
export const STRUCTURE_IMAGE_PATHS = {
[StructureType.Bank]: STRUCTURE_IMAGE_PREFIX + "mine.png",
@@ -26,11 +29,11 @@ export const STRUCTURE_IMAGE_PATHS = {
};
export const StructureConstructionMenu = ({ className, entityId }: { className?: string; entityId: number }) => {
+ const dojo = useDojo();
+
const setPreviewBuilding = useUIStore((state) => state.setPreviewBuilding);
const previewBuilding = useUIStore((state) => state.previewBuilding);
- const { getBalance } = useResourceBalance();
-
const buildingTypes = Object.keys(StructureType)
.filter((key) => isNaN(Number(key)))
.filter(
@@ -40,7 +43,7 @@ export const StructureConstructionMenu = ({ className, entityId }: { className?:
const checkBalance = (cost: any) =>
Object.keys(cost).every((resourceId) => {
const resourceCost = cost[Number(resourceId)];
- const balance = getBalance(entityId, resourceCost.resource);
+ const balance = getBalance(entityId, resourceCost.resource, dojo.setup.components);
return balance.balance >= multiplyByPrecision(resourceCost.amount);
});
@@ -51,7 +54,7 @@ export const StructureConstructionMenu = ({ className, entityId }: { className?:
// if is hyperstructure, the construction cost are only fragments
const isHyperstructure = building === StructureType["Hyperstructure"];
- const cost = HYPERSTRUCTURE_CONSTRUCTION_COSTS_SCALED.filter(
+ const cost = scaleResourceCostMinMax(eternumConfig.hyperstructures.hyperstructureCreationCosts, RESOURCE_PRECISION).filter(
(cost) => !isHyperstructure || cost.resource === ResourcesIds.AncientFragment,
);
@@ -91,9 +94,11 @@ const StructureInfo = ({
entityId: ID | undefined;
extraButtons?: React.ReactNode[];
}) => {
+ const dojo = useDojo();
+
// if is hyperstructure, the construction cost are only fragments
const isHyperstructure = structureId === StructureType["Hyperstructure"];
- const cost = HYPERSTRUCTURE_CREATION_COSTS.filter(
+ const cost = eternumConfig.hyperstructures.hyperstructureCreationCosts.filter(
(cost) => !isHyperstructure || cost.resource_tier === ResourceTier.Lords,
);
@@ -102,8 +107,6 @@ const StructureInfo = ({
? `+${configManager.getHyperstructureConfig().pointsPerCycle} points`
: "";
- const { getBalance } = useResourceBalance();
-
return (
{StructureType[structureId]}
@@ -118,13 +121,13 @@ const StructureInfo = ({
One time cost
{Object.keys(cost).map((resourceId, index) => {
- const balance = getBalance(entityId || 0, ResourcesIds.AncientFragment);
+ const balance = getBalance(entityId || 0, ResourcesIds.AncientFragment, dojo.setup.components);
return (
);
diff --git a/client/apps/game/src/ui/components/structures/worldmap/StructureCard.tsx b/client/apps/game/src/ui/components/structures/worldmap/structure-card.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/structures/worldmap/StructureCard.tsx
rename to client/apps/game/src/ui/components/structures/worldmap/structure-card.tsx
index 6bdf8a5854..4160a79fce 100644
--- a/client/apps/game/src/ui/components/structures/worldmap/StructureCard.tsx
+++ b/client/apps/game/src/ui/components/structures/worldmap/structure-card.tsx
@@ -1,19 +1,26 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { getArmyByEntityId } from "@/hooks/helpers/useArmies";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { useIsStructureImmune, useStructureAtPosition, useStructureImmunityTimer } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { Position } from "@/types/Position";
-import { ArmyCapacity } from "@/ui/elements/ArmyCapacity";
-import Button from "@/ui/elements/Button";
-import { Headline } from "@/ui/elements/Headline";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/ui/elements/Tabs";
-import { getTotalTroops } from "@/ui/modules/military/battle-view/BattleHistory";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGetArmyByEntityId } from "@/hooks/helpers/use-armies";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { useQuery } from "@/hooks/helpers/use-query";
+import {
+ useIsStructureImmune,
+ useStructureAtPosition,
+ useStructureImmunityTimer,
+} from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { Position } from "@/types/position";
+import { ResourceExchange } from "@/ui/components/hyperstructures/resource-exchange";
+import { ImmunityTimer } from "@/ui/components/worldmap/structures/structure-label";
+import { StructureListItem } from "@/ui/components/worldmap/structures/structure-list-item";
+import { ArmyCapacity } from "@/ui/elements/army-capacity";
+import Button from "@/ui/elements/button";
+import { Headline } from "@/ui/elements/headline";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/ui/elements/tabs";
+import { getTotalTroops } from "@/ui/modules/military/battle-view/battle-history";
import { currencyFormat, formatNumber, formatStringNumber } from "@/ui/utils/utils";
import { ArmyInfo, ContractAddress, ID, ResourcesIds } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
@@ -21,9 +28,6 @@ import { getEntityIdFromKeys } from "@dojoengine/utils";
import clsx from "clsx";
import { ArrowRight } from "lucide-react";
import { useMemo, useState } from "react";
-import { ResourceExchange } from "../../hyperstructures/ResourceExchange";
-import { ImmunityTimer } from "../../worldmap/structures/StructureLabel";
-import { StructureListItem } from "../../worldmap/structures/StructureListItem";
export const StructureCard = ({
className,
@@ -208,7 +212,7 @@ const TroopExchange = ({
},
} = useDojo();
- const { getArmy } = getArmyByEntityId();
+ const { getArmy } = useGetArmyByEntityId();
const maxTroopCountPerArmy = configManager.getTroopConfig().maxTroopCount;
diff --git a/client/apps/game/src/ui/components/Toaster.tsx b/client/apps/game/src/ui/components/toaster.tsx
similarity index 100%
rename from client/apps/game/src/ui/components/Toaster.tsx
rename to client/apps/game/src/ui/components/toaster.tsx
diff --git a/client/apps/game/src/ui/components/toggle/ToggleComponent.tsx b/client/apps/game/src/ui/components/toggle/toggle-component.tsx
similarity index 100%
rename from client/apps/game/src/ui/components/toggle/ToggleComponent.tsx
rename to client/apps/game/src/ui/components/toggle/toggle-component.tsx
diff --git a/client/apps/game/src/ui/components/trading/MarketModal.tsx b/client/apps/game/src/ui/components/trading/market-modal.tsx
similarity index 83%
rename from client/apps/game/src/ui/components/trading/MarketModal.tsx
rename to client/apps/game/src/ui/components/trading/market-modal.tsx
index a7f6a243f1..e209032da8 100644
--- a/client/apps/game/src/ui/components/trading/MarketModal.tsx
+++ b/client/apps/game/src/ui/components/trading/market-modal.tsx
@@ -1,79 +1,84 @@
-import { ReactComponent as Coins } from "@/assets/icons/Coins.svg";
-import { ReactComponent as Crown } from "@/assets/icons/Crown.svg";
-import { ReactComponent as Scroll } from "@/assets/icons/Scroll.svg";
-import { ReactComponent as Sparkles } from "@/assets/icons/Sparkles.svg";
-import { ReactComponent as Swap } from "@/assets/icons/Swap.svg";
+import { ReactComponent as Coins } from "@/assets/icons/coins.svg";
+import { ReactComponent as Crown } from "@/assets/icons/crown.svg";
+import { ReactComponent as Scroll } from "@/assets/icons/scroll.svg";
+import { ReactComponent as Sparkles } from "@/assets/icons/sparkles.svg";
+import { ReactComponent as Swap } from "@/assets/icons/swap.svg";
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useBattlesByPosition } from "@/hooks/helpers/battles/useBattles";
-import { useArmyByArmyEntityId } from "@/hooks/helpers/useArmies";
-import { useGetBanks } from "@/hooks/helpers/useBanks";
-import { useEntities } from "@/hooks/helpers/useEntities";
-import { useStructureByPosition } from "@/hooks/helpers/useStructures";
-import { useSetMarket } from "@/hooks/helpers/useTrade";
-import useMarketStore from "@/hooks/store/useMarketStore";
-import { useModalStore } from "@/hooks/store/useModalStore";
-import useUIStore from "@/hooks/store/useUIStore";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useArmyByArmyEntityId } from "@/hooks/helpers/use-armies";
+import { useBank } from "@/hooks/helpers/use-bank";
+import { useBattlesAtPosition } from "@/hooks/helpers/use-battles";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import { useStructureByPosition } from "@/hooks/helpers/use-structures";
+import { useSetMarket } from "@/hooks/helpers/use-trade";
+import useMarketStore from "@/hooks/store/use-market-store";
+import { useModalStore } from "@/hooks/store/use-modal-store";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { HintModal } from "@/ui/components/hints/hint-modal";
+import { TroopDisplay } from "@/ui/components/military/troop-chip";
+import { ModalContainer } from "@/ui/components/modal-container";
import { BuildingThumbs } from "@/ui/config";
-import CircleButton from "@/ui/elements/CircleButton";
-import { LoadingAnimation } from "@/ui/elements/LoadingAnimation";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/Select";
+import CircleButton from "@/ui/elements/circle-button";
+import { LoadingAnimation } from "@/ui/elements/loading-animation";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
import { Tabs } from "@/ui/elements/tab";
-import { formatTimeDifference } from "@/ui/modules/military/battle-view/BattleProgress";
+import { formatTimeDifference } from "@/ui/modules/military/battle-view/battle-progress";
import { currencyFormat, getEntityIdFromKeys } from "@/ui/utils/utils";
import { BattleManager, ID, ResourcesIds } from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { Suspense, lazy, useMemo, useState } from "react";
-import { ModalContainer } from "../ModalContainer";
-import { HintModal } from "../hints/HintModal";
-import { TroopDisplay } from "../military/TroopChip";
const MarketResourceSidebar = lazy(() =>
- import("./MarketResourceSideBar").then((module) => ({ default: module.MarketResourceSidebar })),
+ import("@/ui/components/trading/market-resource-sidebar").then((module) => ({
+ default: module.MarketResourceSidebar,
+ })),
);
const MarketOrderPanel = lazy(() =>
- import("./MarketOrderPanel").then((module) => ({ default: module.MarketOrderPanel })),
+ import("./market-order-panel").then((module) => ({ default: module.MarketOrderPanel })),
);
-const BankPanel = lazy(() => import("../bank/BankList").then((module) => ({ default: module.BankPanel })));
+const BankPanel = lazy(() =>
+ import("@/ui/components/bank/bank-list").then((module) => ({ default: module.BankPanel })),
+);
const MarketTradingHistory = lazy(() =>
- import("./MarketTradingHistory").then((module) => ({ default: module.MarketTradingHistory })),
+ import("@/ui/components/trading/market-trading-history").then((module) => ({ default: module.MarketTradingHistory })),
);
-const RealmProduction = lazy(() => import("./RealmProduction").then((module) => ({ default: module.RealmProduction })));
+const RealmProduction = lazy(() =>
+ import("@/ui/components/trading/realm-production").then((module) => ({ default: module.RealmProduction })),
+);
-const TransferView = lazy(() => import("./TransferView").then((module) => ({ default: module.TransferView })));
+const TransferView = lazy(() =>
+ import("@/ui/components/trading/transfer-view").then((module) => ({ default: module.TransferView })),
+);
export const MarketModal = () => {
const dojo = useDojo();
const [selectedTab, setSelectedTab] = useState(0);
- const { playerStructures } = useEntities();
+ const playerStructures = usePlayerStructures();
const { toggleModal } = useModalStore();
- const banks = useGetBanks();
+ const bank = useBank();
const { bidOffers, askOffers } = useSetMarket();
- const bank = banks.length === 1 ? banks[0] : null;
- const battles = useBattlesByPosition(bank?.position || { x: 0, y: 0 });
+ const battles = useBattlesAtPosition(bank?.position || { x: 0, y: 0 });
const currentBlockTimestamp = useUIStore.getState().nextBlockTimestamp || 0;
const getStructure = useStructureByPosition();
const bankStructure = getStructure(bank?.position || { x: 0, y: 0 });
- const battle = useMemo(() => {
+ const battleEntityId = useMemo(() => {
if (battles.length === 0) return null;
- return battles
- .filter((battle) => battle.isStructureBattle)
- .sort((a, b) => Number(a.last_updated || 0) - Number(b.last_updated || 0))[0];
+ return battles[0];
}, [battles]);
const battleManager = useMemo(
- () => new BattleManager(dojo.setup.components, dojo.network.provider, battle?.entity_id || 0),
- [battle?.entity_id],
+ () => new BattleManager(dojo.setup.components, dojo.network.provider, battleEntityId || 0),
+ [battleEntityId],
);
// initial entity id
@@ -83,8 +88,6 @@ export const MarketModal = () => {
const selectedResource = useMarketStore((state) => state.selectedResource);
const setSelectedResource = useMarketStore((state) => state.setSelectedResource);
- const structures = playerStructures();
-
const [isSiegeOngoing, isBattleOngoing] = useMemo(() => {
const isSiegeOngoing = battleManager.isSiege(currentBlockTimestamp);
const isBattleOngoing = battleManager.isBattleOngoing(currentBlockTimestamp);
@@ -212,7 +215,7 @@ export const MarketModal = () => {
- {structures.map((structure, index) => (
+ {playerStructures.map((structure, index) => (
{structure.name}
diff --git a/client/apps/game/src/ui/components/trading/MarketOrderPanel.tsx b/client/apps/game/src/ui/components/trading/market-order-panel.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/trading/MarketOrderPanel.tsx
rename to client/apps/game/src/ui/components/trading/market-order-panel.tsx
index 214e2c3610..ef51cbc040 100644
--- a/client/apps/game/src/ui/components/trading/MarketOrderPanel.tsx
+++ b/client/apps/game/src/ui/components/trading/market-order-panel.tsx
@@ -1,14 +1,13 @@
-import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useRealm } from "@/hooks/helpers/useRealm";
-import { useResourceManager } from "@/hooks/helpers/useResources";
-import { useIsResourcesLocked } from "@/hooks/helpers/useStructures";
-import { useTravel } from "@/hooks/helpers/useTravel";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { soundSelector, useUiSounds } from "@/hooks/useUISound";
-import Button from "@/ui/elements/Button";
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useResourceManager } from "@/hooks/helpers/use-resources";
+import { useIsResourcesLocked } from "@/hooks/helpers/use-structures";
+import { useTravel } from "@/hooks/helpers/use-travel";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
+import { ConfirmationPopup } from "@/ui/components/bank/confirmation-popup";
+import Button from "@/ui/elements/button";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import {
calculateDonkeysNeeded,
currencyFormat,
@@ -17,20 +16,21 @@ import {
getTotalResourceWeight,
multiplyByPrecision,
} from "@/ui/utils/utils";
+import { getRealmAddressName } from "@/utils/realm";
import {
DONKEY_ENTITY_TYPE,
- EternumGlobalConfig,
- ONE_MONTH,
+ RESOURCE_PRECISION,
ResourceManager,
ResourcesIds,
+ configManager,
findResourceById,
type ID,
- type MarketInterface,
+ type MarketInterface
} from "@bibliothecadao/eternum";
import clsx from "clsx";
import { memo, useCallback, useEffect, useMemo, useState } from "react";
-import { ConfirmationPopup } from "../bank/ConfirmationPopup";
+export const ONE_MONTH = 2628000;
export const MarketResource = memo(
({
entityId,
@@ -266,8 +266,6 @@ const OrderRow = memo(
[entityId, updateBalance],
);
- const { getRealmAddressName } = useRealm();
-
const isMakerResourcesLocked = useIsResourcesLocked(offer.makerId);
const [confirmOrderModal, setConfirmOrderModal] = useState(false);
@@ -360,7 +358,7 @@ const OrderRow = memo(
}, [donkeyProductionManager, donkeyProduction, currentDefaultTick]);
const accountName = useMemo(() => {
- return getRealmAddressName(offer.makerId);
+ return getRealmAddressName(offer.makerId, dojo.setup.components);
}, [offer.originName]);
const onAccept = async () => {
@@ -498,7 +496,7 @@ const OrderRow = memo(
const OrderCreation = memo(
({ entityId, resourceId, isBuy = false }: { entityId: ID; resourceId: ResourcesIds; isBuy?: boolean }) => {
const [loading, setLoading] = useState(false);
- const [resource, setResource] = useState(EternumGlobalConfig.resources.resourcePrecision);
+ const [resource, setResource] = useState(RESOURCE_PRECISION);
const [lords, setLords] = useState(100);
const [bid, setBid] = useState(String(lords / resource));
const { nextBlockTimestamp } = useNextBlockTimestamp();
diff --git a/client/apps/game/src/ui/components/trading/MarketResourceSideBar.tsx b/client/apps/game/src/ui/components/trading/market-resource-sidebar.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/trading/MarketResourceSideBar.tsx
rename to client/apps/game/src/ui/components/trading/market-resource-sidebar.tsx
index fd2dac241d..f7321b27c1 100644
--- a/client/apps/game/src/ui/components/trading/MarketResourceSideBar.tsx
+++ b/client/apps/game/src/ui/components/trading/market-resource-sidebar.tsx
@@ -1,7 +1,7 @@
-import { useDojo } from "@/hooks/context/DojoContext";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { MarketResource } from "@/ui/components/trading/market-order-panel";
import { ID, MarketInterface, MarketManager, RESOURCE_TIERS, ResourcesIds } from "@bibliothecadao/eternum";
import { useMemo } from "react";
-import { MarketResource } from "./MarketOrderPanel";
export const MarketResourceSidebar = ({
entityId,
diff --git a/client/apps/game/src/ui/components/trading/MarketTradingHistory.tsx b/client/apps/game/src/ui/components/trading/market-trading-history.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/trading/MarketTradingHistory.tsx
rename to client/apps/game/src/ui/components/trading/market-trading-history.tsx
index 86bdd8351d..584af9cd4c 100644
--- a/client/apps/game/src/ui/components/trading/MarketTradingHistory.tsx
+++ b/client/apps/game/src/ui/components/trading/market-trading-history.tsx
@@ -1,13 +1,13 @@
import { world } from "@/dojo/world";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useTrade } from "@/hooks/helpers/useTrade";
-import { Checkbox } from "@/ui/elements/Checkbox";
-import { SelectResource } from "@/ui/elements/SelectResource";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useTrade } from "@/hooks/helpers/use-trade";
+import { EventType, TradeHistoryEvent, TradeHistoryRowHeader } from "@/ui/components/trading/trade-history-event";
+import { Checkbox } from "@/ui/elements/checkbox";
+import { SelectResource } from "@/ui/elements/select-resource";
import { ID, Resource, ResourcesIds } from "@bibliothecadao/eternum";
import { defineComponentSystem, getComponentValue, isComponentUpdate } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
import { memo, useEffect, useMemo, useState } from "react";
-import { EventType, TradeHistoryEvent, TradeHistoryRowHeader } from "./TradeHistoryEvent";
const MAX_TRADES = 100;
diff --git a/client/apps/game/src/ui/components/trading/RealmProduction.tsx b/client/apps/game/src/ui/components/trading/realm-production.tsx
similarity index 63%
rename from client/apps/game/src/ui/components/trading/RealmProduction.tsx
rename to client/apps/game/src/ui/components/trading/realm-production.tsx
index 80af913df3..22f30c914f 100644
--- a/client/apps/game/src/ui/components/trading/RealmProduction.tsx
+++ b/client/apps/game/src/ui/components/trading/realm-production.tsx
@@ -1,34 +1,45 @@
import { configManager } from "@/dojo/setup";
-import { getRealms } from "@/hooks/helpers/useRealm";
-import useUIStore from "@/hooks/store/useUIStore";
-import { SelectResource } from "@/ui/elements/SelectResource";
-import { unpackResources } from "@/ui/utils/packedData";
+import { useRealms } from "@/hooks/helpers/use-realm";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { SelectResource } from "@/ui/elements/select-resource";
+import { unpackResources } from "@/ui/utils/packed-data";
import { ResourcesIds } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
-import { RealmResourcesIO } from "../resources/RealmResourcesIO";
export const RealmProduction = () => {
const setSelectedPlayer = useUIStore((state) => state.setSelectedPlayer);
const toggleModal = useUIStore((state) => state.toggleModal);
- const realms = getRealms();
+ // todo: pay attention to expensive query
+ const realms = useRealms();
const [filterProduced, setFilterProduced] = useState(null);
const [filterConsumed, setFilterConsumed] = useState(null);
const resourcesInputs = useMemo(() => configManager.resourceInputs, []);
+ const realmsProduction = useMemo(() => {
+ return realms.map((realm) => {
+ const resourcesProduced = unpackResources(realm.produced_resources);
+
+ return {
+ ...realm,
+ resourcesProduced,
+ };
+ });
+ }, [realms]);
+
const filteredRealms = useMemo(() => {
if (!realms) return [];
- return realms.filter((realm) => {
+ return realmsProduction.filter((realm) => {
if (!realm) return false;
- const resourcesProduced = unpackResources(realm.resourceTypesPacked);
- if (filterProduced && !resourcesProduced.includes(filterProduced)) return false;
+ if (filterProduced && !realm.resourcesProduced.includes(filterProduced)) return false;
if (filterConsumed) {
const resourcesConsumed = new Set(
- resourcesProduced.flatMap((resourceId) =>
+ realm.resourcesProduced.flatMap((resourceId) =>
resourcesInputs[resourceId]
.filter((input) => input.resource !== ResourcesIds["Wheat"] && input.resource !== ResourcesIds["Fish"])
.map((input) => input.resource),
@@ -40,7 +51,7 @@ export const RealmProduction = () => {
return true;
});
- }, [realms, filterProduced, filterConsumed, resourcesInputs]);
+ }, [realmsProduction, filterProduced, filterConsumed, resourcesInputs]);
const handleRealmClick = (realm: any) => {
toggleModal(null);
@@ -67,10 +78,12 @@ export const RealmProduction = () => {
className="mb-5 border border-gold/40 rounded-xl p-3 hover:opacity-70"
onClick={() => handleRealmClick(realm)}
>
- {realm.ownerName}
- {realm.name}
+
+ {realm.resourcesProduced.map((resourceId) => (
+
+ ))}
+
- {realm.realmId && }
))}
diff --git a/client/apps/game/src/ui/components/trading/ResourceArrivals.tsx b/client/apps/game/src/ui/components/trading/resource-arrivals.tsx
similarity index 85%
rename from client/apps/game/src/ui/components/trading/ResourceArrivals.tsx
rename to client/apps/game/src/ui/components/trading/resource-arrivals.tsx
index a1a86b841c..ed525bae36 100644
--- a/client/apps/game/src/ui/components/trading/ResourceArrivals.tsx
+++ b/client/apps/game/src/ui/components/trading/resource-arrivals.tsx
@@ -1,15 +1,15 @@
import { addToSubscription } from "@/dojo/queries";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { ArrivalInfo } from "@/hooks/helpers/use-resource-arrivals";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import Button from "@/ui/elements/Button";
-import { Checkbox } from "@/ui/elements/Checkbox";
-import { Headline } from "@/ui/elements/Headline";
-import { HintModalButton } from "@/ui/elements/HintModalButton";
+import { useDojo } from "@/hooks/context/dojo-context";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { EntityArrival } from "@/ui/components/entities/entity";
+import { HintSection } from "@/ui/components/hints/hint-modal";
+import Button from "@/ui/elements/button";
+import { Checkbox } from "@/ui/elements/checkbox";
+import { Headline } from "@/ui/elements/headline";
+import { HintModalButton } from "@/ui/elements/hint-modal-button";
+import { ArrivalInfo } from "@bibliothecadao/eternum";
import { memo, useEffect, useState } from "react";
import { create } from "zustand";
-import { EntityArrival } from "../entities/Entity";
-import { HintSection } from "../hints/HintModal";
const DISPLAYED_ARRIVALS = 3;
interface SubscribedIdsStore {
diff --git a/client/apps/game/src/ui/components/trading/SelectEntityFromList.tsx b/client/apps/game/src/ui/components/trading/select-entity-from-list.tsx
similarity index 87%
rename from client/apps/game/src/ui/components/trading/SelectEntityFromList.tsx
rename to client/apps/game/src/ui/components/trading/select-entity-from-list.tsx
index d22d998570..fbed4c45f2 100644
--- a/client/apps/game/src/ui/components/trading/SelectEntityFromList.tsx
+++ b/client/apps/game/src/ui/components/trading/select-entity-from-list.tsx
@@ -1,5 +1,6 @@
-import { useRealm } from "@/hooks/helpers/useRealm";
-import Button from "@/ui/elements/Button";
+import { useDojo } from "@/hooks/context/dojo-context";
+import Button from "@/ui/elements/button";
+import { getRealmAddressName } from "@/utils/realm";
import { ID } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { memo } from "react";
@@ -18,14 +19,16 @@ interface SelectEntityFromListProps {
export const SelectEntityFromList = memo(
({ onSelect, selectedEntityId, selectedCounterpartyId, entities }: SelectEntityFromListProps) => {
- const { getRealmAddressName } = useRealm();
+ const {
+ setup: { components },
+ } = useDojo();
return (
{entities.map((entity) => {
const isSelected = selectedEntityId === entity.entity_id;
const isDisabled = isSelected || selectedCounterpartyId === entity.entity_id;
- const realmName = getRealmAddressName(entity.entity_id);
+ const realmName = getRealmAddressName(entity.entity_id, components);
return (
{
- const { getBalance } = useResourceBalance();
+ const dojo = useDojo();
+
const { playResourceSound } = usePlayResourceSound();
const orderedResources = useMemo(() => {
@@ -50,12 +52,15 @@ export const SelectResources = ({
return (
{selectedResourceIds.map((id: any, index: any) => {
- const resource = getBalance(entity_id, id);
+ const resource = getBalance(entity_id, id, dojo.setup.components);
const options = [orderedResources.find((res) => res.id === id), ...unselectedResources].map((res: any) => ({
id: res.id,
label: (
-
+
),
}));
diff --git a/client/apps/game/src/ui/components/trading/TradeHistoryEvent.tsx b/client/apps/game/src/ui/components/trading/trade-history-event.tsx
similarity index 88%
rename from client/apps/game/src/ui/components/trading/TradeHistoryEvent.tsx
rename to client/apps/game/src/ui/components/trading/trade-history-event.tsx
index ad8c08ed48..26466bf9d8 100644
--- a/client/apps/game/src/ui/components/trading/TradeHistoryEvent.tsx
+++ b/client/apps/game/src/ui/components/trading/trade-history-event.tsx
@@ -1,8 +1,9 @@
-import { useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { currencyIntlFormat, divideByPrecision } from "@/ui/utils/utils";
+import { getAddressNameFromEntity } from "@/utils/entities";
import { Resource, ResourcesIds } from "@bibliothecadao/eternum";
-import { TradeEvent } from "./MarketTradingHistory";
+import { TradeEvent } from "./market-trading-history";
export enum EventType {
SWAP = "AMM Swap",
@@ -24,7 +25,9 @@ export const TradeHistoryRowHeader = () => {
};
export const TradeHistoryEvent = ({ trade }: { trade: TradeEvent }) => {
- const { getAddressNameFromEntity } = useEntitiesUtils();
+ const {
+ setup: { components },
+ } = useDojo();
const resourceTaken = trade.event.resourceTaken;
const resourceGiven = trade.event.resourceGiven;
@@ -33,7 +36,7 @@ export const TradeHistoryEvent = ({ trade }: { trade: TradeEvent }) => {
}
const price = getLordsPricePerResource(trade.event.resourceGiven, trade.event.resourceTaken);
- const taker = getAddressNameFromEntity(trade.event.takerId);
+ const taker = getAddressNameFromEntity(trade.event.takerId, components);
return (
diff --git a/client/apps/game/src/ui/components/trading/TransferBetweenEntities.tsx b/client/apps/game/src/ui/components/trading/transfer-between-entities.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/trading/TransferBetweenEntities.tsx
rename to client/apps/game/src/ui/components/trading/transfer-between-entities.tsx
index 540b070d94..160fe8138a 100644
--- a/client/apps/game/src/ui/components/trading/TransferBetweenEntities.tsx
+++ b/client/apps/game/src/ui/components/trading/transfer-between-entities.tsx
@@ -1,20 +1,20 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useRealm } from "@/hooks/helpers/useRealm";
-import { useTravel } from "@/hooks/helpers/useTravel";
-import { soundSelector, useUiSounds } from "@/hooks/useUISound";
-import Button from "@/ui/elements/Button";
-import { Checkbox } from "@/ui/elements/Checkbox";
-import { Headline } from "@/ui/elements/Headline";
-import TextInput from "@/ui/elements/TextInput";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useTravel } from "@/hooks/helpers/use-travel";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
+import { TravelInfo } from "@/ui/components/resources/travel-info";
+import { ToggleComponent } from "@/ui/components/toggle/toggle-component";
+import { SelectEntityFromList } from "@/ui/components/trading/select-entity-from-list";
+import { SelectResources } from "@/ui/components/trading/select-resources";
+import Button from "@/ui/elements/button";
+import { Checkbox } from "@/ui/elements/checkbox";
+import { Headline } from "@/ui/elements/headline";
+import TextInput from "@/ui/elements/text-input";
import { multiplyByPrecision, normalizeDiacriticalMarks } from "@/ui/utils/utils";
+import { getRealmAddressName } from "@/utils/realm";
import { DONKEY_ENTITY_TYPE, ID } from "@bibliothecadao/eternum";
import { ArrowRight, LucideArrowRight } from "lucide-react";
import { memo, useEffect, useMemo, useState } from "react";
-import { TravelInfo } from "../resources/TravelInfo";
-import { ToggleComponent } from "../toggle/ToggleComponent";
-import { SelectEntityFromList } from "./SelectEntityFromList";
-import { SelectResources } from "./SelectResources";
enum STEP_ID {
SELECT_ENTITIES = 1,
@@ -172,8 +172,6 @@ export const TransferBetweenEntities = ({
filtered: boolean;
filterBy: (filtered: boolean) => void;
}) => {
- const { getRealmAddressName } = useRealm();
-
const [selectedEntityIdFrom, setSelectedEntityIdFrom] = useState (null);
const [selectedEntityIdTo, setSelectedEntityIdTo] = useState(null);
const [selectedResourceIds, setSelectedResourceIds] = useState([]);
@@ -192,6 +190,7 @@ export const TransferBetweenEntities = ({
const {
account: { account },
setup: {
+ components,
systemCalls: { send_resources, pickup_resources },
},
} = useDojo();
@@ -251,7 +250,7 @@ export const TransferBetweenEntities = ({
return entitiesList.map(({ entities, name }) => ({
entities: entities.map((entity) => ({
...entity,
- accountName: getRealmAddressName(entity.entity_id),
+ accountName: getRealmAddressName(entity.entity_id, components),
})),
name,
}));
diff --git a/client/apps/game/src/ui/components/trading/TransferView.tsx b/client/apps/game/src/ui/components/trading/transfer-view.tsx
similarity index 72%
rename from client/apps/game/src/ui/components/trading/TransferView.tsx
rename to client/apps/game/src/ui/components/trading/transfer-view.tsx
index 4ff0933b4a..23870ae1e1 100644
--- a/client/apps/game/src/ui/components/trading/TransferView.tsx
+++ b/client/apps/game/src/ui/components/trading/transfer-view.tsx
@@ -1,22 +1,24 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { PlayerStructure, RealmWithPosition, useEntities, useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { usePlayerRealms } from "@/hooks/helpers/use-realm";
+import { TransferBetweenEntities } from "@/ui/components/trading/transfer-between-entities";
import { getRealmNameById } from "@/ui/utils/realms";
-import { ContractAddress, StructureType } from "@bibliothecadao/eternum";
+import { getEntityName } from "@/utils/entities";
+import { ContractAddress, PlayerStructure, RealmWithPosition, StructureType } from "@bibliothecadao/eternum";
import { useEntityQuery } from "@dojoengine/react";
import { Has, NotValue, getComponentValue } from "@dojoengine/recs";
import { useMemo, useState } from "react";
-import { TransferBetweenEntities } from "./TransferBetweenEntities";
export const TransferView = () => {
const {
account: { account },
- setup: {
- components: { Structure, Position, Owner, Realm },
- },
+ setup: { components },
} = useDojo();
+ const { Structure, Position, Owner, Realm } = components;
- const { playerRealms, playerStructures } = useEntities();
+ const playerRealms = usePlayerRealms();
+ const playerStructures = usePlayerStructures();
const [guildOnly, setGuildOnly] = useState(false);
@@ -26,8 +28,6 @@ export const TransferView = () => {
return getPlayersInPlayersGuild(BigInt(account.address)).map((a) => BigInt(a.address));
}, [account.address]);
- const { getEntityName } = useEntitiesUtils();
-
const otherStructuresQuery = useEntityQuery([
Has(Structure),
Has(Position),
@@ -43,7 +43,7 @@ export const TransferView = () => {
const position = getComponentValue(Position, id);
- const structureName = getEntityName(structure.entity_id);
+ const structureName = getEntityName(structure.entity_id, components);
const name = structureName ? `${structure?.category} ${structureName}` : structure.category || "";
return { ...structure, position: position!, name, owner: getComponentValue(Owner, id) };
@@ -71,17 +71,17 @@ export const TransferView = () => {
filterBy={setGuildOnly}
filtered={guildOnly}
entitiesList={[
- { entities: playerRealms(), name: "Your Realms" },
+ { entities: playerRealms, name: "Your Realms" },
{
- entities: playerStructures().filter((structure) => structure.category === "Hyperstructure"),
+ entities: playerStructures.filter((structure) => structure.category === "Hyperstructure"),
name: "Your Hyperstructures",
},
{
- entities: playerStructures().filter((structure) => structure.category === "FragmentMine"),
+ entities: playerStructures.filter((structure) => structure.category === "FragmentMine"),
name: "Your Fragment Mines",
},
{
- entities: playerStructures().filter((structure) => structure.category === "Bank"),
+ entities: playerStructures.filter((structure) => structure.category === "Bank"),
name: "Your Banks",
},
{
diff --git a/client/apps/game/src/ui/components/TxEmit.tsx b/client/apps/game/src/ui/components/tx-emit.tsx
similarity index 98%
rename from client/apps/game/src/ui/components/TxEmit.tsx
rename to client/apps/game/src/ui/components/tx-emit.tsx
index 442d30fa8d..8c56561f3f 100644
--- a/client/apps/game/src/ui/components/TxEmit.tsx
+++ b/client/apps/game/src/ui/components/tx-emit.tsx
@@ -1,4 +1,4 @@
-import { useDojo } from "@/hooks/context/DojoContext";
+import { useDojo } from "@/hooks/context/dojo-context";
import { TransactionType } from "@bibliothecadao/eternum";
import { useEffect } from "react";
import { toast } from "sonner";
diff --git a/client/apps/game/src/ui/components/WorldLoading.tsx b/client/apps/game/src/ui/components/world-loading.tsx
similarity index 90%
rename from client/apps/game/src/ui/components/WorldLoading.tsx
rename to client/apps/game/src/ui/components/world-loading.tsx
index fbb45c35ac..adb40021ec 100644
--- a/client/apps/game/src/ui/components/WorldLoading.tsx
+++ b/client/apps/game/src/ui/components/world-loading.tsx
@@ -1,5 +1,5 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { LoadingStateKey } from "@/hooks/store/useWorldLoading";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LoadingStateKey } from "@/hooks/store/use-world-loading";
export const WorldLoading = () => {
const loadingStates = useUIStore((state) => state.loadingStates);
@@ -37,7 +37,7 @@ export const WorldLoading = () => {
>
{anyLoading && (
-
+
Loading: {getLoadingItems()}
)}
diff --git a/client/apps/game/src/ui/components/worldmap/armies/ActionInfo.tsx b/client/apps/game/src/ui/components/worldmap/armies/action-info.tsx
similarity index 78%
rename from client/apps/game/src/ui/components/worldmap/armies/ActionInfo.tsx
rename to client/apps/game/src/ui/components/worldmap/armies/action-info.tsx
index aeac82e524..78f1ce200e 100644
--- a/client/apps/game/src/ui/components/worldmap/armies/ActionInfo.tsx
+++ b/client/apps/game/src/ui/components/worldmap/armies/action-info.tsx
@@ -1,13 +1,13 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
-import useUIStore from "@/hooks/store/useUIStore";
+import { useDojo } from "@/hooks/context/dojo-context";
+import useUIStore from "@/hooks/store/use-ui-store";
import { BuildingThumbs, FELT_CENTER } from "@/ui/config";
-import { BaseThreeTooltip, Position } from "@/ui/elements/BaseThreeTooltip";
-import { Headline } from "@/ui/elements/Headline";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
-import { StaminaResourceCost } from "@/ui/elements/StaminaResourceCost";
-import { computeExploreFoodCosts, computeTravelFoodCosts, ResourcesIds } from "@bibliothecadao/eternum";
+import { BaseThreeTooltip, Position } from "@/ui/elements/base-three-tooltip";
+import { Headline } from "@/ui/elements/headline";
+import { ResourceCost } from "@/ui/elements/resource-cost";
+import { StaminaResourceCost } from "@/ui/elements/stamina-resource-cost";
+import { getBalance } from "@/utils/resources";
+import { computeExploreFoodCosts, computeTravelFoodCosts, ID, ResourcesIds } from "@bibliothecadao/eternum";
import { getComponentValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
import { memo, useCallback, useMemo } from "react";
@@ -24,9 +24,9 @@ const TooltipContent = memo(
isExplored: boolean;
travelPath: any;
costs: { travelFoodCosts: any; exploreFoodCosts: any };
- selectedEntityId: string;
- structureEntityId: string;
- getBalance: any;
+ selectedEntityId: number;
+ structureEntityId: number;
+ getBalance: (entityId: ID, resourceId: ResourcesIds) => { balance: number; resourceId: ResourcesIds };
}) => (
<>
{isExplored ? "Travel" : "Explore"}
@@ -82,11 +82,8 @@ export const ActionInfo = memo(() => {
const selectedEntityId = useUIStore(useCallback((state) => state.armyActions.selectedEntityId, []));
const structureEntityId = useUIStore(useCallback((state) => state.structureEntityId, []));
- const { getBalance } = useResourceBalance();
const {
- setup: {
- components: { Army },
- },
+ setup: { components },
} = useDojo();
const selectedEntityTroops = useMemo(() => {
@@ -97,7 +94,7 @@ export const ActionInfo = memo(() => {
crossbowman_count: 0n,
};
}
- const army = getComponentValue(Army, getEntityIdFromKeys([BigInt(selectedEntityId)]));
+ const army = getComponentValue(components.Army, getEntityIdFromKeys([BigInt(selectedEntityId)]));
return (
army?.troops || {
knight_count: 0n,
@@ -105,7 +102,7 @@ export const ActionInfo = memo(() => {
crossbowman_count: 0n,
}
);
- }, [selectedEntityId, Army]);
+ }, [selectedEntityId]);
const travelPath = useMemo(() => {
if (!hoveredHex) return undefined;
@@ -128,7 +125,7 @@ export const ActionInfo = memo(() => {
[selectedEntityTroops],
);
- if (!showTooltip) return null;
+ if (!showTooltip || !selectedEntityId) return null;
return (
@@ -136,9 +133,9 @@ export const ActionInfo = memo(() => {
isExplored={isExplored}
travelPath={travelPath}
costs={costs}
- selectedEntityId={selectedEntityId!.toString()}
- structureEntityId={structureEntityId.toString()}
- getBalance={getBalance}
+ selectedEntityId={selectedEntityId}
+ structureEntityId={structureEntityId}
+ getBalance={(entityId: ID, resourceId: ResourcesIds) => getBalance(entityId, resourceId, components)}
/>
);
diff --git a/client/apps/game/src/ui/components/worldmap/armies/ActionInstructions.tsx b/client/apps/game/src/ui/components/worldmap/armies/action-instructions.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/worldmap/armies/ActionInstructions.tsx
rename to client/apps/game/src/ui/components/worldmap/armies/action-instructions.tsx
index 4952617143..820130b166 100644
--- a/client/apps/game/src/ui/components/worldmap/armies/ActionInstructions.tsx
+++ b/client/apps/game/src/ui/components/worldmap/armies/action-instructions.tsx
@@ -1,4 +1,4 @@
-import useUIStore from "@/hooks/store/useUIStore";
+import useUIStore from "@/hooks/store/use-ui-store";
import { IS_MOBILE } from "@/ui/config";
export const ActionInstructions = () => {
diff --git a/client/apps/game/src/ui/components/worldmap/armies/ArmyInfoLabel.tsx b/client/apps/game/src/ui/components/worldmap/armies/army-info-label.tsx
similarity index 76%
rename from client/apps/game/src/ui/components/worldmap/armies/ArmyInfoLabel.tsx
rename to client/apps/game/src/ui/components/worldmap/armies/army-info-label.tsx
index 796dc50e33..9089be5b3e 100644
--- a/client/apps/game/src/ui/components/worldmap/armies/ArmyInfoLabel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/armies/army-info-label.tsx
@@ -1,27 +1,27 @@
-import useUIStore from "../../../../hooks/store/useUIStore";
-import { currencyFormat } from "../../../utils/utils";
-
-import { getArmyByEntityId } from "@/hooks/helpers/useArmies";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { useIsStructureImmune, useStructureImmunityTimer, useStructures } from "@/hooks/helpers/useStructures";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { ArmyCapacity } from "@/ui/elements/ArmyCapacity";
-import { BaseThreeTooltip, Position } from "@/ui/elements/BaseThreeTooltip";
-import { Headline } from "@/ui/elements/Headline";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { StaminaResource } from "@/ui/elements/StaminaResource";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGetArmyByEntityId } from "@/hooks/helpers/use-armies";
+import { useQuery } from "@/hooks/helpers/use-query";
+import { useIsStructureImmune, useStructureImmunityTimer, useStructures } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { ArmyWarning } from "@/ui/components/worldmap/armies/army-warning";
+import { ImmunityTimer } from "@/ui/components/worldmap/structures/structure-label";
+import { ArmyCapacity } from "@/ui/elements/army-capacity";
+import { BaseThreeTooltip, Position } from "@/ui/elements/base-three-tooltip";
+import { Headline } from "@/ui/elements/headline";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { StaminaResource } from "@/ui/elements/stamina-resource";
+import { getRealmNameById } from "@/ui/utils/realms";
+import { currencyFormat } from "@/ui/utils/utils";
+import { getRealmAddressName } from "@/utils/realm";
import { ArmyInfo, Structure } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { useMemo } from "react";
-import { useRealm } from "../../../../hooks/helpers/useRealm";
-import { getRealmNameById } from "../../../utils/realms";
-import { ImmunityTimer } from "../structures/StructureLabel";
-import { ArmyWarning } from "./ArmyWarning";
export const ArmyInfoLabel = () => {
const { isMapView } = useQuery();
const hoveredArmyEntityId = useUIStore((state) => state.hoveredArmyEntityId);
- const { getArmy } = getArmyByEntityId();
+ const { getArmy } = useGetArmyByEntityId();
const army = useMemo(() => {
if (hoveredArmyEntityId) return getArmy(hoveredArmyEntityId);
@@ -36,12 +36,15 @@ interface ArmyInfoLabelProps {
}
const RaiderInfo = ({ army }: ArmyInfoLabelProps) => {
- const { getRealmAddressName } = useRealm();
+ const {
+ setup: { components },
+ } = useDojo();
+
const { realm, entity_id, entityOwner, troops } = army;
const realmId = realm?.realm_id || 0;
- const attackerAddressName = entityOwner ? getRealmAddressName(entityOwner.entity_owner_id) : "";
+ const attackerAddressName = entityOwner ? getRealmAddressName(entityOwner.entity_owner_id, components) : "";
const { getStructureByEntityId } = useStructures();
diff --git a/client/apps/game/src/ui/components/worldmap/armies/ArmyWarning.tsx b/client/apps/game/src/ui/components/worldmap/armies/army-warning.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/worldmap/armies/ArmyWarning.tsx
rename to client/apps/game/src/ui/components/worldmap/armies/army-warning.tsx
index 0f1b8459ad..12c2e60d93 100644
--- a/client/apps/game/src/ui/components/worldmap/armies/ArmyWarning.tsx
+++ b/client/apps/game/src/ui/components/worldmap/armies/army-warning.tsx
@@ -1,6 +1,6 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import useUIStore from "@/hooks/store/useUIStore";
+import { useDojo } from "@/hooks/context/dojo-context";
+import useUIStore from "@/hooks/store/use-ui-store";
import { currencyFormat, multiplyByPrecision } from "@/ui/utils/utils";
import { ArmyInfo, ArmyMovementManager, computeExploreFoodCosts, StaminaManager } from "@bibliothecadao/eternum";
import { useMemo } from "react";
diff --git a/client/apps/game/src/ui/components/worldmap/armies/SelectedArmy.tsx b/client/apps/game/src/ui/components/worldmap/armies/selected-army.tsx
similarity index 64%
rename from client/apps/game/src/ui/components/worldmap/armies/SelectedArmy.tsx
rename to client/apps/game/src/ui/components/worldmap/armies/selected-army.tsx
index bfb0235835..60851e61ac 100644
--- a/client/apps/game/src/ui/components/worldmap/armies/SelectedArmy.tsx
+++ b/client/apps/game/src/ui/components/worldmap/armies/selected-army.tsx
@@ -1,12 +1,11 @@
-import { useOwnArmiesByPosition } from "@/hooks/helpers/useArmies";
-import { useEntities } from "@/hooks/helpers/useEntities";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import useUIStore from "@/hooks/store/useUIStore";
-import { Position } from "@/types/Position";
-import { ArmyChip } from "@/ui/components/military/ArmyChip";
-import { InventoryResources } from "@/ui/components/resources/InventoryResources";
+import { useArmiesAtPosition } from "@/hooks/helpers/use-armies";
+import { useQuery } from "@/hooks/helpers/use-query";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { Position } from "@/types/position";
+import { ArmyChip } from "@/ui/components/military/army-chip";
+import { InventoryResources } from "@/ui/components/resources/inventory-resources";
import { useCallback, useEffect, useMemo, useState } from "react";
-import { ArmyWarning } from "./ArmyWarning";
+import { ArmyWarning } from "./army-warning";
export const SelectedArmy = () => {
const selectedHex = useUIStore((state) => state.selectedHex);
@@ -20,39 +19,36 @@ export const SelectedArmy = () => {
if (!selectedHex) updateSelectedEntityId(null);
}, [selectedHex, updateSelectedEntityId]);
- const { playerStructures } = useEntities();
-
- const rawArmies = useOwnArmiesByPosition({
+ const armies = useArmiesAtPosition({
position: new Position({ x: selectedHex?.col || 0, y: selectedHex?.row || 0 }).getContract(),
- inBattle: false,
- playerStructures: playerStructures(),
});
- const userArmies = useMemo(() => rawArmies.filter((army) => army.health.current > 0), [rawArmies]);
+ // player armies that are not in battle
+ const playerArmies = useMemo(() => armies.filter((army) => army.isMine && army.battle_id === 0), [armies]);
useEffect(() => {
setSelectedArmyIndex(0);
- }, [userArmies]);
+ }, [playerArmies]);
useEffect(() => {
if (selectedHex) {
- updateSelectedEntityId(userArmies[selectedArmyIndex]?.entity_id || 0);
+ updateSelectedEntityId(playerArmies[selectedArmyIndex]?.entity_id || 0);
}
- }, [selectedArmyIndex, userArmies, updateSelectedEntityId, selectedHex]);
+ }, [selectedArmyIndex, playerArmies, updateSelectedEntityId, selectedHex]);
const ownArmy = useMemo(
- () => userArmies.find((army) => army.entity_id === selectedEntityId),
- [userArmies, selectedEntityId],
+ () => playerArmies.find((army) => army.entity_id === selectedEntityId),
+ [playerArmies, selectedEntityId],
);
const handleKeyDown = useCallback(
(event: KeyboardEvent) => {
if (event.key === "Tab") {
event.preventDefault();
- setSelectedArmyIndex((prevIndex) => (prevIndex + 1) % userArmies.length);
+ setSelectedArmyIndex((prevIndex) => (prevIndex + 1) % playerArmies.length);
}
},
- [userArmies.length],
+ [playerArmies.length],
);
useEffect(() => {
@@ -74,11 +70,11 @@ export const SelectedArmy = () => {
>
{showTooltip && (
- {userArmies.length > 1 && (
+ {playerArmies.length > 1 && (
Press Tab to cycle through armies
- Army {selectedArmyIndex + 1}/{userArmies.length}
+ Army {selectedArmyIndex + 1}/{playerArmies.length}
)}
diff --git a/client/apps/game/src/ui/components/worldmap/battles/BattleLabel.tsx b/client/apps/game/src/ui/components/worldmap/battles/battle-label.tsx
similarity index 79%
rename from client/apps/game/src/ui/components/worldmap/battles/BattleLabel.tsx
rename to client/apps/game/src/ui/components/worldmap/battles/battle-label.tsx
index d4b25c312a..a258b77b75 100644
--- a/client/apps/game/src/ui/components/worldmap/battles/BattleLabel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/battles/battle-label.tsx
@@ -1,26 +1,22 @@
-import { DojoResult, useDojo } from "@/hooks/context/DojoContext";
-import { useBattlesByPosition } from "@/hooks/helpers/battles/useBattles";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { useStructureByPosition } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import { BaseThreeTooltip, Position } from "@/ui/elements/BaseThreeTooltip";
-import { Headline } from "@/ui/elements/Headline";
-import { DurationLeft, ProgressBar } from "@/ui/modules/military/battle-view/BattleProgress";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useBattlesAtPosition } from "@/hooks/helpers/use-battles";
+import { useQuery } from "@/hooks/helpers/use-query";
+import { useStructureByPosition } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { BaseThreeTooltip, Position } from "@/ui/elements/base-three-tooltip";
+import { Headline } from "@/ui/elements/headline";
+import { DurationLeft, ProgressBar } from "@/ui/modules/military/battle-view/battle-progress";
import { divideByPrecision } from "@/ui/utils/utils";
import { BattleManager, Structure } from "@bibliothecadao/eternum";
import { useMemo } from "react";
export const BattleInfoLabel = () => {
- const dojo = useDojo();
const { isMapView } = useQuery();
const getStructure = useStructureByPosition();
const hoveredBattlePosition = useUIStore((state) => state.hoveredBattle);
const currentTimestamp = useUIStore.getState().nextBlockTimestamp || 0;
- const battles = useBattlesByPosition({ x: hoveredBattlePosition?.x || 0, y: hoveredBattlePosition?.y || 0 }).filter(
- (battle) => battle.duration_left > 0,
- );
-
+ const battles = useBattlesAtPosition({ x: hoveredBattlePosition?.x || 0, y: hoveredBattlePosition?.y || 0 });
const structure = getStructure({ x: hoveredBattlePosition?.x || 0, y: hoveredBattlePosition?.y || 0 });
return (
@@ -33,9 +29,8 @@ export const BattleInfoLabel = () => {
{battles.map((battle) => (
@@ -49,15 +44,15 @@ export const BattleInfoLabel = () => {
const BattleInfo = ({
battleEntityId,
- dojo,
currentTimestamp,
structure,
}: {
battleEntityId: number;
- dojo: DojoResult;
currentTimestamp: number;
structure: Structure | undefined;
}) => {
+ const dojo = useDojo();
+
const battleManager = useMemo(
() => new BattleManager(dojo.setup.components, dojo.network.provider, battleEntityId),
[battleEntityId, dojo],
diff --git a/client/apps/game/src/ui/components/worldmap/battles/BattleSimulationPanel.tsx b/client/apps/game/src/ui/components/worldmap/battles/battle-simulation-panel.tsx
similarity index 97%
rename from client/apps/game/src/ui/components/worldmap/battles/BattleSimulationPanel.tsx
rename to client/apps/game/src/ui/components/worldmap/battles/battle-simulation-panel.tsx
index 5f8861877c..66334dbe36 100644
--- a/client/apps/game/src/ui/components/worldmap/battles/BattleSimulationPanel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/battles/battle-simulation-panel.tsx
@@ -1,5 +1,6 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { Troops } from "@/ui/components/worldmap/battles/troops";
import { formatTime } from "@/ui/utils/utils";
import {
Battle,
@@ -11,7 +12,6 @@ import {
import { getComponentValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
import { useMemo, useState } from "react";
-import { Troops } from "./Troops";
export const BattleSimulationPanel = () => {
const {
diff --git a/client/apps/game/src/ui/components/worldmap/battles/PillageSimulationPanel.tsx b/client/apps/game/src/ui/components/worldmap/battles/pillage-simulation-panel.tsx
similarity index 98%
rename from client/apps/game/src/ui/components/worldmap/battles/PillageSimulationPanel.tsx
rename to client/apps/game/src/ui/components/worldmap/battles/pillage-simulation-panel.tsx
index 46cfdf7b57..8c7c79e745 100644
--- a/client/apps/game/src/ui/components/worldmap/battles/PillageSimulationPanel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/battles/pillage-simulation-panel.tsx
@@ -1,5 +1,6 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { Troops } from "@/ui/components/worldmap/battles/troops";
import {
calculateRemainingTroops,
getChancesOfSuccess,
@@ -16,7 +17,6 @@ import {
import { getComponentValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
import { useMemo, useState } from "react";
-import { Troops } from "./Troops";
export const PillageSimulationPanel = () => {
const {
diff --git a/client/apps/game/src/ui/components/worldmap/battles/Troops.tsx b/client/apps/game/src/ui/components/worldmap/battles/troops.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/worldmap/battles/Troops.tsx
rename to client/apps/game/src/ui/components/worldmap/battles/troops.tsx
index f3cd6a8d9c..f7a67ecde8 100644
--- a/client/apps/game/src/ui/components/worldmap/battles/Troops.tsx
+++ b/client/apps/game/src/ui/components/worldmap/battles/troops.tsx
@@ -1,5 +1,5 @@
-import { NumberInput } from "@/ui/elements/NumberInput";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
+import { NumberInput } from "@/ui/elements/number-input";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { currencyFormat } from "@/ui/utils/utils";
import { ResourcesIds } from "@bibliothecadao/eternum";
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/CreateGuildButton.tsx b/client/apps/game/src/ui/components/worldmap/guilds/create-guild-button.tsx
similarity index 93%
rename from client/apps/game/src/ui/components/worldmap/guilds/CreateGuildButton.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/create-guild-button.tsx
index a19c58e365..68b1b6542e 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/CreateGuildButton.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/create-guild-button.tsx
@@ -1,8 +1,8 @@
import { ReactComponent as LockClosed } from "@/assets/icons/common/lock-closed.svg";
import { ReactComponent as LockOpen } from "@/assets/icons/common/lock-open.svg";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
-import TextInput from "@/ui/elements/TextInput";
+import useUIStore from "@/hooks/store/use-ui-store";
+import Button from "@/ui/elements/button";
+import TextInput from "@/ui/elements/text-input";
import { MAX_NAME_LENGTH } from "@bibliothecadao/eternum";
interface CreateGuildButtonProps {
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/GuildInvitesList.tsx b/client/apps/game/src/ui/components/worldmap/guilds/guild-invites-list.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/worldmap/guilds/GuildInvitesList.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/guild-invites-list.tsx
index 0f7ddf68ac..0d6fb83328 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/GuildInvitesList.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/guild-invites-list.tsx
@@ -1,7 +1,7 @@
import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
-import useUIStore from "@/hooks/store/useUIStore";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { currencyIntlFormat, sortItems } from "@/ui/utils/utils";
import { ContractAddress, GuildWhitelistInfo } from "@bibliothecadao/eternum";
import clsx from "clsx";
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/GuildList.tsx b/client/apps/game/src/ui/components/worldmap/guilds/guild-list.tsx
similarity index 95%
rename from client/apps/game/src/ui/components/worldmap/guilds/GuildList.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/guild-list.tsx
index 399a492095..1a7002a4b8 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/GuildList.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/guild-list.tsx
@@ -1,6 +1,6 @@
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { currencyIntlFormat } from "@/ui/utils/utils";
import { GuildInfo, ResourcesIds } from "@bibliothecadao/eternum";
import clsx from "clsx";
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/GuildMemberList.tsx b/client/apps/game/src/ui/components/worldmap/guilds/guild-member-list.tsx
similarity index 96%
rename from client/apps/game/src/ui/components/worldmap/guilds/GuildMemberList.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/guild-member-list.tsx
index ea8b4370cf..d7360baa4d 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/GuildMemberList.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/guild-member-list.tsx
@@ -1,7 +1,7 @@
-import { ReactComponent as Crown } from "@/assets/icons/Crown.svg";
import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import { ReactComponent as Crown } from "@/assets/icons/crown.svg";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { currencyIntlFormat, sortItems } from "@/ui/utils/utils";
import { ContractAddress, GuildMemberInfo } from "@bibliothecadao/eternum";
import clsx from "clsx";
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/GuildMembers.tsx b/client/apps/game/src/ui/components/worldmap/guilds/guild-members.tsx
similarity index 91%
rename from client/apps/game/src/ui/components/worldmap/guilds/GuildMembers.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/guild-members.tsx
index fe80f65f2b..d97e844241 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/GuildMembers.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/guild-members.tsx
@@ -1,18 +1,18 @@
import { ReactComponent as Pen } from "@/assets/icons/common/pen.svg";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
-import Button from "@/ui/elements/Button";
-import TextInput from "@/ui/elements/TextInput";
-import TwitterShareButton from "@/ui/elements/TwitterShareButton";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { GuildInviteList } from "@/ui/components/worldmap/guilds/guild-invites-list";
+import { GuildMemberList } from "@/ui/components/worldmap/guilds/guild-member-list";
+import Button from "@/ui/elements/button";
+import TextInput from "@/ui/elements/text-input";
+import TwitterShareButton from "@/ui/elements/twitter-share-button";
import { formatSocialText, twitterTemplates } from "@/ui/socials";
-import { ContractAddress, ID, Player } from "@bibliothecadao/eternum";
+import { ContractAddress, ID, PlayerInfo } from "@bibliothecadao/eternum";
import { useCallback, useState } from "react";
import { env } from "../../../../../env";
-import { useDojo } from "../../../../hooks/context/DojoContext";
-import { GuildInviteList } from "./GuildInvitesList";
-import { GuildMemberList } from "./GuildMemberList";
interface GuildMembersProps {
- players: Player[];
+ players: PlayerInfo[];
selectedGuildEntityId: number;
viewPlayerInfo: (playerAddress: ContractAddress) => void;
setIsExpanded: (isExpanded: boolean) => void;
@@ -23,6 +23,7 @@ interface GuildMembersProps {
export const GuildMembers = ({ players, selectedGuildEntityId, viewPlayerInfo, setIsExpanded }: GuildMembersProps) => {
const {
setup: {
+ components,
systemCalls: { join_guild, remove_guild_member, disband_guild, remove_player_from_whitelist, set_entity_name },
},
account: { account },
@@ -35,7 +36,7 @@ export const GuildMembers = ({ players, selectedGuildEntityId, viewPlayerInfo, s
const invitedPlayers = useGuildWhitelist(selectedGuildEntityId, players);
const userWhitelist = usePlayerWhitelist(ContractAddress(account.address));
const userGuild = getGuildFromPlayerAddress(ContractAddress(account.address));
- const selectedGuild = getGuildFromEntityId(selectedGuildEntityId, ContractAddress(account.address));
+ const selectedGuild = getGuildFromEntityId(selectedGuildEntityId, ContractAddress(account.address), components);
const playerName = players.find((player) => player.address === ContractAddress(account?.address))?.name;
diff --git a/client/apps/game/src/ui/components/worldmap/guilds/Guilds.tsx b/client/apps/game/src/ui/components/worldmap/guilds/guilds.tsx
similarity index 91%
rename from client/apps/game/src/ui/components/worldmap/guilds/Guilds.tsx
rename to client/apps/game/src/ui/components/worldmap/guilds/guilds.tsx
index c9e7eb2dd9..8c1b0e2d53 100644
--- a/client/apps/game/src/ui/components/worldmap/guilds/Guilds.tsx
+++ b/client/apps/game/src/ui/components/worldmap/guilds/guilds.tsx
@@ -1,22 +1,22 @@
-import { useGuilds } from "@/hooks/helpers/useGuilds";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { CreateGuildButton } from "@/ui/components/worldmap/guilds/create-guild-button";
+import { GuildListHeader, GuildRow } from "@/ui/components/worldmap/guilds/guild-list";
import { PRIZE_POOL_GUILDS } from "@/ui/constants";
-import Button from "@/ui/elements/Button";
-import { SortInterface } from "@/ui/elements/SortButton";
-import TextInput from "@/ui/elements/TextInput";
+import Button from "@/ui/elements/button";
+import { SortInterface } from "@/ui/elements/sort-button";
+import TextInput from "@/ui/elements/text-input";
import { sortItems } from "@/ui/utils/utils";
-import { calculateGuildLordsPrize, ContractAddress, ID, Player } from "@bibliothecadao/eternum";
+import { calculateGuildLordsPrize, ContractAddress, ID, PlayerInfo } from "@bibliothecadao/eternum";
import { ChevronRight } from "lucide-react";
import { useMemo, useState } from "react";
-import { useDojo } from "../../../../hooks/context/DojoContext";
-import { CreateGuildButton } from "./CreateGuildButton";
-import { GuildListHeader, GuildRow } from "./GuildList";
export const Guilds = ({
viewGuildMembers,
players,
}: {
viewGuildMembers: (guildEntityId: ID) => void;
- players: Player[];
+ players: PlayerInfo[];
}) => {
const {
setup: {
diff --git a/client/apps/game/src/ui/components/worldmap/players/PlayerList.tsx b/client/apps/game/src/ui/components/worldmap/players/player-list.tsx
similarity index 94%
rename from client/apps/game/src/ui/components/worldmap/players/PlayerList.tsx
rename to client/apps/game/src/ui/components/worldmap/players/player-list.tsx
index b36ef8622c..798e455ed5 100644
--- a/client/apps/game/src/ui/components/worldmap/players/PlayerList.tsx
+++ b/client/apps/game/src/ui/components/worldmap/players/player-list.tsx
@@ -1,15 +1,15 @@
import { ReactComponent as Invite } from "@/assets/icons/common/envelope.svg";
import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
-import useUIStore from "@/hooks/store/useUIStore";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { SortButton, SortInterface } from "@/ui/elements/SortButton";
-import { SortPanel } from "@/ui/elements/SortPanel";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { SortButton, SortInterface } from "@/ui/elements/sort-button";
+import { SortPanel } from "@/ui/elements/sort-panel";
import { currencyIntlFormat, sortItems } from "@/ui/utils/utils";
-import { ContractAddress, GuildInfo, Player, ResourcesIds } from "@bibliothecadao/eternum";
+import { ContractAddress, GuildInfo, PlayerInfo, ResourcesIds } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { useMemo, useState } from "react";
-export interface PlayerCustom extends Player {
+export interface PlayerCustom extends PlayerInfo {
structures: string[];
isUser: boolean;
isInvited: boolean;
diff --git a/client/apps/game/src/ui/components/worldmap/players/PlayersPanel.tsx b/client/apps/game/src/ui/components/worldmap/players/players-panel.tsx
similarity index 90%
rename from client/apps/game/src/ui/components/worldmap/players/PlayersPanel.tsx
rename to client/apps/game/src/ui/components/worldmap/players/players-panel.tsx
index 8b6ec24090..687427484c 100644
--- a/client/apps/game/src/ui/components/worldmap/players/PlayersPanel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/players/players-panel.tsx
@@ -1,31 +1,32 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
-import Button from "@/ui/elements/Button";
-import TextInput from "@/ui/elements/TextInput";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { PlayerCustom, PlayerList } from "@/ui/components/worldmap/players/player-list";
+import Button from "@/ui/elements/button";
+import TextInput from "@/ui/elements/text-input";
import { getEntityIdFromKeys, normalizeDiacriticalMarks, toHexString } from "@/ui/utils/utils";
-import { ContractAddress, Player } from "@bibliothecadao/eternum";
+import { getEntityName } from "@/utils/entities";
+import { ContractAddress, PlayerInfo } from "@bibliothecadao/eternum";
import { Has, HasValue, getComponentValue, runQuery } from "@dojoengine/recs";
import { KeyboardEvent, useMemo, useState } from "react";
-import { PlayerCustom, PlayerList } from "./PlayerList";
export const PlayersPanel = ({
players,
viewPlayerInfo,
}: {
- players: Player[];
+ players: PlayerInfo[];
viewPlayerInfo: (playerAddress: ContractAddress) => void;
}) => {
const {
setup: {
- components: { Structure, Owner, GuildWhitelist },
+ components,
systemCalls: { whitelist_player, remove_player_from_whitelist },
},
account: { account },
} = useDojo();
+ const { Structure, Owner, GuildWhitelist } = components;
+
const { getGuildFromPlayerAddress } = useGuilds();
- const { getEntityName } = useEntitiesUtils();
const userGuild = getGuildFromPlayerAddress(ContractAddress(account.address));
const [isLoading, setIsLoading] = useState(false);
@@ -46,7 +47,7 @@ export const PlayersPanel = ({
const structure = getComponentValue(Structure, entityId);
if (!structure) return undefined;
- const structureName = getEntityName(structure.entity_id);
+ const structureName = getEntityName(structure.entity_id, components);
return structureName;
})
.filter((structure): structure is string => structure !== undefined);
diff --git a/client/apps/game/src/ui/components/worldmap/structures/StructureLabel.tsx b/client/apps/game/src/ui/components/worldmap/structures/structure-label.tsx
similarity index 82%
rename from client/apps/game/src/ui/components/worldmap/structures/StructureLabel.tsx
rename to client/apps/game/src/ui/components/worldmap/structures/structure-label.tsx
index b8b43cdb19..d3663437da 100644
--- a/client/apps/game/src/ui/components/worldmap/structures/StructureLabel.tsx
+++ b/client/apps/game/src/ui/components/worldmap/structures/structure-label.tsx
@@ -1,14 +1,14 @@
-import { useGuilds } from "@/hooks/helpers/useGuilds";
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { useIsStructureImmune, useStructureImmunityTimer, useStructures } from "@/hooks/helpers/useStructures";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { BaseThreeTooltip, Position } from "@/ui/elements/BaseThreeTooltip";
-import { Headline } from "@/ui/elements/Headline";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { useQuery } from "@/hooks/helpers/use-query";
+import { useIsStructureImmune, useStructureImmunityTimer, useStructures } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { StructureListItem } from "@/ui/components/worldmap/structures/structure-list-item";
+import { BaseThreeTooltip, Position } from "@/ui/elements/base-three-tooltip";
+import { Headline } from "@/ui/elements/headline";
import { formatTime } from "@/ui/utils/utils";
import { ContractAddress, Structure } from "@bibliothecadao/eternum";
import { memo, useMemo } from "react";
-import useUIStore from "../../../../hooks/store/useUIStore";
-import { StructureListItem } from "./StructureListItem";
export const ImmunityTimer = ({
isImmune,
diff --git a/client/apps/game/src/ui/components/worldmap/structures/StructureListItem.tsx b/client/apps/game/src/ui/components/worldmap/structures/structure-list-item.tsx
similarity index 85%
rename from client/apps/game/src/ui/components/worldmap/structures/StructureListItem.tsx
rename to client/apps/game/src/ui/components/worldmap/structures/structure-list-item.tsx
index 5209b65e62..efe8ba7768 100644
--- a/client/apps/game/src/ui/components/worldmap/structures/StructureListItem.tsx
+++ b/client/apps/game/src/ui/components/worldmap/structures/structure-list-item.tsx
@@ -1,18 +1,18 @@
import { ReactComponent as Sword } from "@/assets/icons/common/cross-swords.svg";
import { ReactComponent as Eye } from "@/assets/icons/common/eye.svg";
import { ReactComponent as Shield } from "@/assets/icons/common/shield.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { getUserArmyInBattle } from "@/hooks/helpers/useArmies";
-import { useGetHyperstructureProgress } from "@/hooks/helpers/useHyperstructures";
-import { useIsStructureImmune } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useArmiesInBattle } from "@/hooks/helpers/use-armies";
+import { useGetHyperstructureProgress } from "@/hooks/helpers/use-hyperstructures";
+import { useIsStructureImmune } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { TroopDisplay } from "@/ui/components/military/troop-chip";
+import { InventoryResources } from "@/ui/components/resources/inventory-resources";
+import { RealmResourcesIO } from "@/ui/components/resources/realm-resources-io";
import { ArmyInfo, BattleManager, Structure, StructureType } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { useMemo } from "react";
-import { TroopDisplay } from "../../military/TroopChip";
-import { InventoryResources } from "../../resources/InventoryResources";
-import { RealmResourcesIO } from "../../resources/RealmResourcesIO";
type StructureListItemProps = {
structure: Structure;
@@ -62,7 +62,12 @@ export const StructureListItem = ({
return { updatedBattle };
}, [nextBlockTimestamp]);
- const userArmyInBattle = getUserArmyInBattle(updatedBattle?.entity_id || 0);
+ const armiesInBattle = useArmiesInBattle(updatedBattle?.entity_id || 0);
+
+ // Filter out only the player's armies
+ const playerArmiesInBattle = useMemo(() => {
+ return armiesInBattle.filter((army) => army.isMine);
+ }, [armiesInBattle]);
const isImmune = useIsStructureImmune(structure, nextBlockTimestamp!);
@@ -129,7 +134,7 @@ export const StructureListItem = ({
if (structure.isMine) {
return [shieldButton];
}
- if (userArmyInBattle) {
+ if (playerArmiesInBattle.length > 0) {
return [eyeButton];
}
return [
@@ -160,7 +165,14 @@ export const StructureListItem = ({
/>,
];
}
- }, [nextBlockTimestamp, userArmyInBattle, ownArmySelected, updatedBattle, setBattleView, setShowMergeTroopsPopup]);
+ }, [
+ nextBlockTimestamp,
+ playerArmiesInBattle,
+ ownArmySelected,
+ updatedBattle,
+ setBattleView,
+ setShowMergeTroopsPopup,
+ ]);
return (
diff --git a/client/apps/game/src/ui/containers/BaseContainer.tsx b/client/apps/game/src/ui/containers/base-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/BaseContainer.tsx
rename to client/apps/game/src/ui/containers/base-container.tsx
diff --git a/client/apps/game/src/ui/containers/BattleContainer.tsx b/client/apps/game/src/ui/containers/battle-container.tsx
similarity index 93%
rename from client/apps/game/src/ui/containers/BattleContainer.tsx
rename to client/apps/game/src/ui/containers/battle-container.tsx
index 4d7ecb5913..4731ac51bb 100644
--- a/client/apps/game/src/ui/containers/BattleContainer.tsx
+++ b/client/apps/game/src/ui/containers/battle-container.tsx
@@ -1,4 +1,4 @@
-import useUIStore from "@/hooks/store/useUIStore";
+import useUIStore from "@/hooks/store/use-ui-store";
import { memo, useEffect } from "react";
export const BattleContainer = memo(({ children }: { children: React.ReactNode }) => {
diff --git a/client/apps/game/src/ui/containers/BlankOverlayContainer.tsx b/client/apps/game/src/ui/containers/blank-overlay-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/BlankOverlayContainer.tsx
rename to client/apps/game/src/ui/containers/blank-overlay-container.tsx
diff --git a/client/apps/game/src/ui/containers/BottomMiddleContainer.tsx b/client/apps/game/src/ui/containers/bottom-middle-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/BottomMiddleContainer.tsx
rename to client/apps/game/src/ui/containers/bottom-middle-container.tsx
diff --git a/client/apps/game/src/ui/containers/BottomRightContainer.tsx b/client/apps/game/src/ui/containers/bottom-right-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/BottomRightContainer.tsx
rename to client/apps/game/src/ui/containers/bottom-right-container.tsx
diff --git a/client/apps/game/src/ui/containers/LeftMiddleContainer.tsx b/client/apps/game/src/ui/containers/left-middle-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/LeftMiddleContainer.tsx
rename to client/apps/game/src/ui/containers/left-middle-container.tsx
diff --git a/client/apps/game/src/ui/containers/RightMiddleContainer.tsx b/client/apps/game/src/ui/containers/right-middle-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/RightMiddleContainer.tsx
rename to client/apps/game/src/ui/containers/right-middle-container.tsx
diff --git a/client/apps/game/src/ui/containers/TopCenterContainer.tsx b/client/apps/game/src/ui/containers/top-center-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/TopCenterContainer.tsx
rename to client/apps/game/src/ui/containers/top-center-container.tsx
diff --git a/client/apps/game/src/ui/containers/TopLeftContainer.tsx b/client/apps/game/src/ui/containers/top-left-container.tsx
similarity index 100%
rename from client/apps/game/src/ui/containers/TopLeftContainer.tsx
rename to client/apps/game/src/ui/containers/top-left-container.tsx
diff --git a/client/apps/game/src/ui/elements/Switch.tsx b/client/apps/game/src/ui/elements/Switch.tsx
deleted file mode 100644
index e3ea994986..0000000000
--- a/client/apps/game/src/ui/elements/Switch.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import * as SwitchPrimitives from "@radix-ui/react-switch";
-import * as React from "react";
-
-import { cn } from "./lib/utils";
-
-const Switch = React.forwardRef<
- React.ElementRef ,
- React.ComponentPropsWithoutRef
->(({ className, ...props }, ref) => (
-
-
-
-));
-Switch.displayName = SwitchPrimitives.Root.displayName;
-
-export { Switch };
diff --git a/client/apps/game/src/ui/elements/ArmyCapacity.tsx b/client/apps/game/src/ui/elements/army-capacity.tsx
similarity index 98%
rename from client/apps/game/src/ui/elements/ArmyCapacity.tsx
rename to client/apps/game/src/ui/elements/army-capacity.tsx
index 680155ab6e..1c363ba63f 100644
--- a/client/apps/game/src/ui/elements/ArmyCapacity.tsx
+++ b/client/apps/game/src/ui/elements/army-capacity.tsx
@@ -1,6 +1,6 @@
import { ReactComponent as Inventory } from "@/assets/icons/common/bagpack.svg";
import { configManager } from "@/dojo/setup";
-import useUIStore from "@/hooks/store/useUIStore";
+import useUIStore from "@/hooks/store/use-ui-store";
import { ArmyInfo, getArmyNumberOfTroops } from "@bibliothecadao/eternum";
import { useMemo } from "react";
import { formatNumber, formatStringNumber } from "../utils/utils";
diff --git a/client/apps/game/src/ui/elements/Avatar.tsx b/client/apps/game/src/ui/elements/avatar.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/Avatar.tsx
rename to client/apps/game/src/ui/elements/avatar.tsx
diff --git a/client/apps/game/src/ui/elements/BaseThreeTooltip.tsx b/client/apps/game/src/ui/elements/base-three-tooltip.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/BaseThreeTooltip.tsx
rename to client/apps/game/src/ui/elements/base-three-tooltip.tsx
diff --git a/client/apps/game/src/ui/elements/Button.tsx b/client/apps/game/src/ui/elements/button.tsx
similarity index 97%
rename from client/apps/game/src/ui/elements/Button.tsx
rename to client/apps/game/src/ui/elements/button.tsx
index 745037c04e..a0e0290809 100644
--- a/client/apps/game/src/ui/elements/Button.tsx
+++ b/client/apps/game/src/ui/elements/button.tsx
@@ -1,5 +1,5 @@
import React from "react";
-import { soundSelector, useUiSounds } from "../../hooks/useUISound";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
type ButtonProps = {
onClick?: (e: React.MouseEvent) => void;
diff --git a/client/apps/game/src/ui/elements/Checkbox.tsx b/client/apps/game/src/ui/elements/checkbox.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/Checkbox.tsx
rename to client/apps/game/src/ui/elements/checkbox.tsx
diff --git a/client/apps/game/src/ui/elements/CircleButton.tsx b/client/apps/game/src/ui/elements/circle-button.tsx
similarity index 97%
rename from client/apps/game/src/ui/elements/CircleButton.tsx
rename to client/apps/game/src/ui/elements/circle-button.tsx
index c644607cac..d06fe33384 100644
--- a/client/apps/game/src/ui/elements/CircleButton.tsx
+++ b/client/apps/game/src/ui/elements/circle-button.tsx
@@ -1,5 +1,5 @@
-import useUIStore from "@/hooks/store/useUIStore";
-import { soundSelector, useUiSounds } from "@/hooks/useUISound";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
import clsx from "clsx";
type CircleButtonProps = {
diff --git a/client/apps/game/src/ui/elements/Headline.tsx b/client/apps/game/src/ui/elements/headline.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/Headline.tsx
rename to client/apps/game/src/ui/elements/headline.tsx
diff --git a/client/apps/game/src/ui/elements/HintModalButton.tsx b/client/apps/game/src/ui/elements/hint-modal-button.tsx
similarity index 71%
rename from client/apps/game/src/ui/elements/HintModalButton.tsx
rename to client/apps/game/src/ui/elements/hint-modal-button.tsx
index fdc1544857..1b0c2fef79 100644
--- a/client/apps/game/src/ui/elements/HintModalButton.tsx
+++ b/client/apps/game/src/ui/elements/hint-modal-button.tsx
@@ -1,7 +1,7 @@
-import { useModalStore } from "@/hooks/store/useModalStore";
-import { HintModal } from "../components/hints/HintModal";
+import { useModalStore } from "@/hooks/store/use-modal-store";
+import CircleButton from "@/ui/elements/circle-button";
+import { HintModal } from "../components/hints/hint-modal";
import { BuildingThumbs } from "../config";
-import CircleButton from "./CircleButton";
type HintModalButtonProps = {
section?: string;
diff --git a/client/apps/game/src/ui/elements/KeyBoardKey.tsx b/client/apps/game/src/ui/elements/keyboard-key.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/KeyBoardKey.tsx
rename to client/apps/game/src/ui/elements/keyboard-key.tsx
diff --git a/client/apps/game/src/ui/elements/ListSelect.tsx b/client/apps/game/src/ui/elements/list-select.tsx
similarity index 99%
rename from client/apps/game/src/ui/elements/ListSelect.tsx
rename to client/apps/game/src/ui/elements/list-select.tsx
index 75c85415ae..a38bab9ee3 100644
--- a/client/apps/game/src/ui/elements/ListSelect.tsx
+++ b/client/apps/game/src/ui/elements/list-select.tsx
@@ -1,9 +1,9 @@
import { ReactComponent as CaretDown } from "@/assets/icons/common/caret-down-fill.svg";
import { ReactComponent as Checkmark } from "@/assets/icons/common/checkmark.svg";
+import TextInput from "@/ui/elements/text-input";
import { Listbox, Transition } from "@headlessui/react";
import clsx from "clsx";
import { Fragment, ReactNode, useMemo, useRef, useState } from "react";
-import TextInput from "./TextInput";
interface ListSelectOption {
id: any;
diff --git a/client/apps/game/src/ui/elements/LoadingAnimation.tsx b/client/apps/game/src/ui/elements/loading-animation.tsx
similarity index 56%
rename from client/apps/game/src/ui/elements/LoadingAnimation.tsx
rename to client/apps/game/src/ui/elements/loading-animation.tsx
index 09696685c5..ee3756e911 100644
--- a/client/apps/game/src/ui/elements/LoadingAnimation.tsx
+++ b/client/apps/game/src/ui/elements/loading-animation.tsx
@@ -1,7 +1,7 @@
export const LoadingAnimation = () => {
return (
-
+
);
};
diff --git a/client/apps/game/src/ui/elements/NumberInput.tsx b/client/apps/game/src/ui/elements/number-input.tsx
similarity index 97%
rename from client/apps/game/src/ui/elements/NumberInput.tsx
rename to client/apps/game/src/ui/elements/number-input.tsx
index f72a16d300..5871c5e96b 100644
--- a/client/apps/game/src/ui/elements/NumberInput.tsx
+++ b/client/apps/game/src/ui/elements/number-input.tsx
@@ -2,7 +2,7 @@ import { ReactComponent as ArrowLeft } from "@/assets/icons/common/arrow-left.sv
import { ReactComponent as ArrowRight } from "@/assets/icons/common/arrow-right.svg";
import clsx from "clsx";
import { useEffect, useState } from "react";
-import { soundSelector, useUiSounds } from "../../hooks/useUISound";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
type NumberInputProps = {
value: number;
diff --git a/client/apps/game/src/ui/elements/RangeInput.tsx b/client/apps/game/src/ui/elements/range-input.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/RangeInput.tsx
rename to client/apps/game/src/ui/elements/range-input.tsx
diff --git a/client/apps/game/src/ui/elements/ResourceCost.tsx b/client/apps/game/src/ui/elements/resource-cost.tsx
similarity index 97%
rename from client/apps/game/src/ui/elements/ResourceCost.tsx
rename to client/apps/game/src/ui/elements/resource-cost.tsx
index 091facb496..70da0cccdd 100644
--- a/client/apps/game/src/ui/elements/ResourceCost.tsx
+++ b/client/apps/game/src/ui/elements/resource-cost.tsx
@@ -1,8 +1,8 @@
+import { ResourceIcon } from "@/ui/elements/resource-icon";
import { findResourceById } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { useMemo } from "react";
import { currencyFormat, divideByPrecision } from "../utils/utils";
-import { ResourceIcon } from "./ResourceIcon";
type ResourceCostProps = {
isLabor?: boolean;
diff --git a/client/apps/game/src/ui/elements/ResourceIcon.tsx b/client/apps/game/src/ui/elements/resource-icon.tsx
similarity index 81%
rename from client/apps/game/src/ui/elements/ResourceIcon.tsx
rename to client/apps/game/src/ui/elements/resource-icon.tsx
index 6f94037a88..36be2c6bbb 100644
--- a/client/apps/game/src/ui/elements/ResourceIcon.tsx
+++ b/client/apps/game/src/ui/elements/resource-icon.tsx
@@ -1,10 +1,4 @@
-import { ReactComponent as People } from "@/assets/icons/common/people.svg";
-import { ReactComponent as Cloth } from "@/assets/icons/resources/Cloth.svg";
-import { ReactComponent as DemonHide } from "@/assets/icons/resources/DemonHide.svg";
-import { ReactComponent as DesertGlass } from "@/assets/icons/resources/DesertGlass.svg";
-import { ReactComponent as Lords } from "@/assets/icons/resources/Lords.svg";
-import { ReactComponent as Ore } from "@/assets/icons/resources/Ore.svg";
-import { ReactComponent as Spores } from "@/assets/icons/resources/Spores.svg";
+import People from "@/assets/icons/common/people.svg?react";
import clsx from "clsx";
import type { ReactElement } from "react";
@@ -25,48 +19,43 @@ type Resource = {
};
const Components: { [key: string]: Resource } = Object.freeze({
- Adamantine: {
- component: ,
- name: "Adamantine",
- },
- AlchemicalSilver: {
- component: ,
- name: "Alchemical Silver",
- },
+ Wood: { component: , name: "Wood" },
+ Stone: { component: , name: "Stone" },
Coal: { component: , name: "Coal" },
- ColdIron: { component: , name: "Cold Iron" },
Copper: { component: , name: "Copper" },
- DeepCrystal: { component: , name: "Deep Crystal" },
- Diamonds: { component: , name: "Diamonds" },
- Dragonhide: { component: , name: "Dragonhide" },
- EtherealSilica: { component: , name: "Ethereal Silica" },
+ Obsidian: { component: , name: "Obsidian" },
+ Silver: { component: , name: "Silver" },
+ Ironwood: { component: , name: "Ironwood" },
+ ColdIron: { component: , name: "Cold Iron" },
Gold: { component: , name: "Gold" },
Hartwood: { component: , name: "Hartwood" },
- Ignium: { component: , name: "Ignium" },
- Ironwood: { component: , name: "Ironwood" },
- Mithral: { component: , name: "Mithral" },
- Obsidian: { component: , name: "Obsidian" },
- Ruby: { component: , name: "Ruby" },
+ Diamonds: { component: , name: "Diamonds" },
Sapphire: { component: , name: "Sapphire" },
- Silver: { component: , name: "Silver" },
- Stone: { component: , name: "Stone" },
+ Ruby: { component: , name: "Ruby" },
+ DeepCrystal: { component: , name: "Deep Crystal" },
+ Ignium: { component: , name: "Ignium" },
+ EtherealSilica: { component: , name: "Ethereal Silica" },
TrueIce: { component: , name: "TrueIce" },
TwilightQuartz: { component: , name: "Twilight Quartz" },
- Wood: { component: , name: "Wood" },
- EmbersGlow: { component: , name: "Demon Hide" },
- StoneTemple: { component: , name: "Cloth" },
- DesertOasis: { component: , name: "Desert Glass" },
- MountainDeep: { component: , name: "Ore" },
- UnderwaterKeep: { component: , name: "Lords" },
- ForestRuins: { component: , name: "Spores" },
- Lords: { component: , name: "Lords" },
- Fish: { component: , name: "Fish" },
- Wheat: { component: , name: "Wheat" },
- Donkey: { component: , name: "Donkey" },
+ AlchemicalSilver: {
+ component: ,
+ name: "Alchemical Silver",
+ },
+ Adamantine: {
+ component: ,
+ name: "Adamantine",
+ },
+ Mithral: { component: , name: "Mithral" },
+ Dragonhide: { component: , name: "Dragonhide" },
+ AncientFragment: { component: , name: "Ancient Fragment" },
Knight: { component: , name: "Knight" },
Crossbowman: { component: , name: "Crossbowman" },
Paladin: { component: , name: "Paladin" },
- AncientFragment: { component: , name: "Ancient Fragment" },
+ Lords: { component: , name: "Lords" },
+ Wheat: { component: , name: "Wheat" },
+ Fish: { component: , name: "Fish" },
+
+ Donkey: { component: , name: "Donkey" },
House: { component: , name: "House" },
Silo: { component: , name: "Silo" },
Timeglass: { component: , name: "Timeglass" },
diff --git a/client/apps/game/src/ui/elements/SecondaryPopup.tsx b/client/apps/game/src/ui/elements/secondary-popup.tsx
similarity index 98%
rename from client/apps/game/src/ui/elements/SecondaryPopup.tsx
rename to client/apps/game/src/ui/elements/secondary-popup.tsx
index e97c6a4532..a5e4071fa0 100644
--- a/client/apps/game/src/ui/elements/SecondaryPopup.tsx
+++ b/client/apps/game/src/ui/elements/secondary-popup.tsx
@@ -1,10 +1,10 @@
+import Button from "@/ui/elements/button";
+import { HintModalButton } from "@/ui/elements/hint-modal-button";
import clsx from "clsx";
import { motion } from "framer-motion";
import { X } from "lucide-react";
import { useEffect, useRef, useState } from "react";
import Draggable from "react-draggable";
-import Button from "./Button";
-import { HintModalButton } from "./HintModalButton";
type FilterPopupProps = {
children: React.ReactNode;
diff --git a/client/apps/game/src/ui/elements/SelectAddress.tsx b/client/apps/game/src/ui/elements/select-address.tsx
similarity index 97%
rename from client/apps/game/src/ui/elements/SelectAddress.tsx
rename to client/apps/game/src/ui/elements/select-address.tsx
index 08e22ba2d7..a94ef413e1 100644
--- a/client/apps/game/src/ui/elements/SelectAddress.tsx
+++ b/client/apps/game/src/ui/elements/select-address.tsx
@@ -1,8 +1,8 @@
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
+import TextInput from "@/ui/elements/text-input";
import { ContractAddress, Player } from "@bibliothecadao/eternum";
import React, { useMemo, useRef, useState } from "react";
import { displayAddress, toHexString } from "../utils/utils";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./Select";
-import TextInput from "./TextInput";
interface SelectAddressProps {
initialSelectedAddress: ContractAddress;
diff --git a/client/apps/game/src/ui/elements/SelectResource.tsx b/client/apps/game/src/ui/elements/select-resource.tsx
similarity index 96%
rename from client/apps/game/src/ui/elements/SelectResource.tsx
rename to client/apps/game/src/ui/elements/select-resource.tsx
index 7d6b7c21cb..89729c5832 100644
--- a/client/apps/game/src/ui/elements/SelectResource.tsx
+++ b/client/apps/game/src/ui/elements/select-resource.tsx
@@ -1,10 +1,10 @@
import { ReactComponent as Cross } from "@/assets/icons/common/cross.svg";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
+import TextInput from "@/ui/elements/text-input";
import { RESOURCE_TIERS, ResourcesIds } from "@bibliothecadao/eternum";
import clsx from "clsx";
import React, { useMemo, useRef, useState } from "react";
-import { ResourceIcon } from "./ResourceIcon";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./Select";
-import TextInput from "./TextInput";
interface SelectResourceProps {
onSelect: (resourceId: number | null) => void;
diff --git a/client/apps/game/src/ui/elements/Select.tsx b/client/apps/game/src/ui/elements/select.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/Select.tsx
rename to client/apps/game/src/ui/elements/select.tsx
diff --git a/client/apps/game/src/ui/elements/SortButton.tsx b/client/apps/game/src/ui/elements/sort-button.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/SortButton.tsx
rename to client/apps/game/src/ui/elements/sort-button.tsx
diff --git a/client/apps/game/src/ui/elements/SortPanel.tsx b/client/apps/game/src/ui/elements/sort-panel.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/SortPanel.tsx
rename to client/apps/game/src/ui/elements/sort-panel.tsx
diff --git a/client/apps/game/src/ui/elements/StaminaResourceCost.tsx b/client/apps/game/src/ui/elements/stamina-resource-cost.tsx
similarity index 91%
rename from client/apps/game/src/ui/elements/StaminaResourceCost.tsx
rename to client/apps/game/src/ui/elements/stamina-resource-cost.tsx
index e5a16f702e..2bfed809f8 100644
--- a/client/apps/game/src/ui/elements/StaminaResourceCost.tsx
+++ b/client/apps/game/src/ui/elements/stamina-resource-cost.tsx
@@ -1,6 +1,6 @@
import { configManager } from "@/dojo/setup";
-import { useStaminaManager } from "@/hooks/helpers/useStamina";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
+import { useStaminaManager } from "@/hooks/helpers/use-stamina";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
import { ID } from "@bibliothecadao/eternum";
import clsx from "clsx";
import { useMemo } from "react";
diff --git a/client/apps/game/src/ui/elements/StaminaResource.tsx b/client/apps/game/src/ui/elements/stamina-resource.tsx
similarity index 90%
rename from client/apps/game/src/ui/elements/StaminaResource.tsx
rename to client/apps/game/src/ui/elements/stamina-resource.tsx
index 1194aa7aa0..885e8795eb 100644
--- a/client/apps/game/src/ui/elements/StaminaResource.tsx
+++ b/client/apps/game/src/ui/elements/stamina-resource.tsx
@@ -1,9 +1,9 @@
import { ReactComponent as Lightning } from "@/assets/icons/common/lightning.svg";
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useStaminaManager } from "@/hooks/helpers/useStamina";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useStaminaManager } from "@/hooks/helpers/use-stamina";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
import { ID } from "@bibliothecadao/eternum";
import { getComponentValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
diff --git a/client/apps/game/src/ui/elements/tab/TabList.tsx b/client/apps/game/src/ui/elements/tab/tab-list.tsx
similarity index 80%
rename from client/apps/game/src/ui/elements/tab/TabList.tsx
rename to client/apps/game/src/ui/elements/tab/tab-list.tsx
index 0e7da568ea..95ec243111 100644
--- a/client/apps/game/src/ui/elements/tab/TabList.tsx
+++ b/client/apps/game/src/ui/elements/tab/tab-list.tsx
@@ -1,9 +1,9 @@
+import { TabContext } from "@/ui/elements/tab/tab-provider";
+import { VARIANTS } from "@/ui/elements/tab/tabs";
import { Tab } from "@headlessui/react";
import clsx from "clsx";
import type { ComponentProps } from "react";
import { useContext } from "react";
-import { TabContext } from "./TabProvider";
-import { VARIANTS } from "./tabs";
type TabListProps = ComponentProps<"div">;
diff --git a/client/apps/game/src/ui/elements/tab/TabPanel.tsx b/client/apps/game/src/ui/elements/tab/tab-panel.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/tab/TabPanel.tsx
rename to client/apps/game/src/ui/elements/tab/tab-panel.tsx
diff --git a/client/apps/game/src/ui/elements/tab/TabPanels.tsx b/client/apps/game/src/ui/elements/tab/tab-panels.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/tab/TabPanels.tsx
rename to client/apps/game/src/ui/elements/tab/tab-panels.tsx
diff --git a/client/apps/game/src/ui/elements/tab/TabProvider.tsx b/client/apps/game/src/ui/elements/tab/tab-provider.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/tab/TabProvider.tsx
rename to client/apps/game/src/ui/elements/tab/tab-provider.tsx
diff --git a/client/apps/game/src/ui/elements/tab/tab.tsx b/client/apps/game/src/ui/elements/tab/tab.tsx
index bb5ffa5e2a..15720d5690 100644
--- a/client/apps/game/src/ui/elements/tab/tab.tsx
+++ b/client/apps/game/src/ui/elements/tab/tab.tsx
@@ -1,9 +1,9 @@
+import { TabContext } from "@/ui/elements/tab/tab-provider";
+import { VARIANTS } from "@/ui/elements/tab/tabs";
import { Tab as HeadlessTab } from "@headlessui/react";
import clsx from "clsx";
import type { ComponentProps } from "react";
import { useContext } from "react";
-import { TabContext } from "./TabProvider";
-import { VARIANTS } from "./tabs";
type TabProps = ComponentProps<"button"> & { noText?: boolean };
diff --git a/client/apps/game/src/ui/elements/tab/tabs.tsx b/client/apps/game/src/ui/elements/tab/tabs.tsx
index c137c88df7..b7491adf37 100644
--- a/client/apps/game/src/ui/elements/tab/tabs.tsx
+++ b/client/apps/game/src/ui/elements/tab/tabs.tsx
@@ -1,12 +1,12 @@
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
+import { Tab } from "@/ui/elements/tab/tab";
+import { TabList } from "@/ui/elements/tab/tab-list";
+import { TabPanel } from "@/ui/elements/tab/tab-panel";
+import { TabPanels } from "@/ui/elements/tab/tab-panels";
+import { TabProvider } from "@/ui/elements/tab/tab-provider";
import { Tab as HeadlessTab } from "@headlessui/react";
import clsx from "clsx";
import type { ReactNode } from "react";
-import { soundSelector, useUiSounds } from "../../../hooks/useUISound";
-import { TabList } from "./TabList";
-import { TabPanel } from "./TabPanel";
-import { TabPanels } from "./TabPanels";
-import { TabProvider } from "./TabProvider";
-import { Tab } from "./tab";
export const VARIANTS: any = {
default: {
diff --git a/client/apps/game/src/ui/elements/Tabs.tsx b/client/apps/game/src/ui/elements/tabs.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/Tabs.tsx
rename to client/apps/game/src/ui/elements/tabs.tsx
diff --git a/client/apps/game/src/ui/elements/TextInput.tsx b/client/apps/game/src/ui/elements/text-input.tsx
similarity index 100%
rename from client/apps/game/src/ui/elements/TextInput.tsx
rename to client/apps/game/src/ui/elements/text-input.tsx
diff --git a/client/apps/game/src/ui/elements/Tooltip.tsx b/client/apps/game/src/ui/elements/tooltip.tsx
similarity index 98%
rename from client/apps/game/src/ui/elements/Tooltip.tsx
rename to client/apps/game/src/ui/elements/tooltip.tsx
index 5790f2f721..5fcd20f93b 100644
--- a/client/apps/game/src/ui/elements/Tooltip.tsx
+++ b/client/apps/game/src/ui/elements/tooltip.tsx
@@ -1,7 +1,7 @@
import clsx from "clsx";
import throttle from "lodash/throttle";
import { useEffect, useRef } from "react";
-import useUIStore from "../../hooks/store/useUIStore";
+import useUIStore from "@/hooks/store/use-ui-store";
type TooltipProps = {
className?: string;
diff --git a/client/apps/game/src/ui/elements/TwitterShareButton.tsx b/client/apps/game/src/ui/elements/twitter-share-button.tsx
similarity index 96%
rename from client/apps/game/src/ui/elements/TwitterShareButton.tsx
rename to client/apps/game/src/ui/elements/twitter-share-button.tsx
index e69e744f41..36dce053bf 100644
--- a/client/apps/game/src/ui/elements/TwitterShareButton.tsx
+++ b/client/apps/game/src/ui/elements/twitter-share-button.tsx
@@ -1,6 +1,6 @@
import { ReactComponent as TwitterIcon } from "@/assets/icons/twitter.svg";
+import Button from "@/ui/elements/button";
import React from "react";
-import Button from "./Button";
interface Props {
text: string;
diff --git a/client/apps/game/src/ui/layouts/OnboardingButton.tsx b/client/apps/game/src/ui/layouts/onboarding-button.tsx
similarity index 92%
rename from client/apps/game/src/ui/layouts/OnboardingButton.tsx
rename to client/apps/game/src/ui/layouts/onboarding-button.tsx
index 6beb761935..c807cd513f 100644
--- a/client/apps/game/src/ui/layouts/OnboardingButton.tsx
+++ b/client/apps/game/src/ui/layouts/onboarding-button.tsx
@@ -1,4 +1,4 @@
-import Button from "@/ui/elements/Button";
+import Button from "@/ui/elements/button";
import { ReactNode } from "react";
export const OnboardingButton = ({
diff --git a/client/apps/game/src/ui/layouts/Onboarding.tsx b/client/apps/game/src/ui/layouts/onboarding.tsx
similarity index 84%
rename from client/apps/game/src/ui/layouts/Onboarding.tsx
rename to client/apps/game/src/ui/layouts/onboarding.tsx
index 7d470d4e42..419de44b15 100644
--- a/client/apps/game/src/ui/layouts/Onboarding.tsx
+++ b/client/apps/game/src/ui/layouts/onboarding.tsx
@@ -1,19 +1,19 @@
import { ReactComponent as BackArrow } from "@/assets/icons/back.svg";
-import { ReactComponent as EternumWordsLogo } from "@/assets/icons/eternum_words_logo.svg";
+import { ReactComponent as EternumWordsLogo } from "@/assets/icons/eternum-words-logo.svg";
import { ReactComponent as Lock } from "@/assets/icons/lock.svg";
import { ReactComponent as LordsIcon } from "@/assets/icons/resources/LordsSimple.svg";
import { ReactComponent as TreasureChest } from "@/assets/icons/treasure-chest.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { usePlayerRealms } from "@/hooks/helpers/useRealm";
-import useUIStore from "@/hooks/store/useUIStore";
-import Button from "@/ui/elements/Button";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerRealms } from "@/hooks/helpers/use-realm";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { SeasonPassRealm, getUnusedSeasonPasses } from "@/ui/components/cityview/realm/settle-realm-component";
+import Button from "@/ui/elements/button";
+import { TermsOfService } from "@/ui/layouts/terms-of-service";
+import { Controller } from "@/ui/modules/controller/controller";
+import { SettleRealm, StepOne } from "@/ui/modules/onboarding/steps";
import { motion } from "framer-motion";
import { useEffect, useMemo, useState } from "react";
import { env } from "../../../env";
-import { SeasonPassRealm, getUnusedSeasonPasses } from "../components/cityview/realm/SettleRealmComponent";
-import { Controller } from "../modules/controller/Controller";
-import { SettleRealm, StepOne } from "../modules/onboarding/Steps";
-import { TermsOfService } from "./TermsOfService";
interface OnboardingOverlayProps {
controller?: boolean;
@@ -113,7 +113,10 @@ export const StepContainer = ({
{loading ? (
-
+
) : (
)}
@@ -188,7 +191,7 @@ const SeasonPassButton = ({ setSettleRealm }: SeasonPassButtonProps) => {
const realms = usePlayerRealms();
const createRandomRealm = () => {
- const newRealmId = Math.max(...realms.map((realm) => realm.realmId), 0) + 1;
+ const newRealmId = Math.floor(Math.random() * 8000) + 1;
create_multiple_realms_dev({ signer: account, realm_ids: [newRealmId] });
};
@@ -206,25 +209,31 @@ const SeasonPassButton = ({ setSettleRealm }: SeasonPassButtonProps) => {
hasAcceptedToS &&
(seasonPassRealms.length > 0 ? (
) : (
-
- ))
- );
+
+
+ )
+ )
+ )
+ )
};
diff --git a/client/apps/game/src/ui/layouts/TermsOfService.tsx b/client/apps/game/src/ui/layouts/terms-of-service.tsx
similarity index 98%
rename from client/apps/game/src/ui/layouts/TermsOfService.tsx
rename to client/apps/game/src/ui/layouts/terms-of-service.tsx
index 1e53a50f9b..1a4b3e0337 100644
--- a/client/apps/game/src/ui/layouts/TermsOfService.tsx
+++ b/client/apps/game/src/ui/layouts/terms-of-service.tsx
@@ -1,6 +1,6 @@
-import useUIStore from "@/hooks/store/useUIStore";
+import useUIStore from "@/hooks/store/use-ui-store";
+import Button from "@/ui/elements/button";
import { useMemo, useRef, useState } from "react";
-import Button from "../elements/Button";
export const TermsOfService = () => {
const setHasAcceptedToS = useUIStore((state) => state.setHasAcceptedToS);
diff --git a/client/apps/game/src/ui/layouts/World.tsx b/client/apps/game/src/ui/layouts/world.tsx
similarity index 72%
rename from client/apps/game/src/ui/layouts/World.tsx
rename to client/apps/game/src/ui/layouts/world.tsx
index 3b5e24fef0..6bac9f3b79 100644
--- a/client/apps/game/src/ui/layouts/World.tsx
+++ b/client/apps/game/src/ui/layouts/world.tsx
@@ -1,95 +1,99 @@
-import { Leva } from "leva";
-import { lazy, Suspense, useEffect, useMemo, useState } from "react";
-import { Redirect } from "wouter";
-import useUIStore from "../../hooks/store/useUIStore";
-
import {
debounceAddDonkeysAndArmiesSubscription,
- debouncedAddHyperstructureSubscription,
debouncedAddMarketSubscription,
debouncedAddToSubscription,
debouncedAddToSubscriptionOneKey,
-} from "@/dojo/debouncedQueries";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { PlayerStructure, useEntities } from "@/hooks/helpers/useEntities";
-import { useStructureEntityId } from "@/hooks/helpers/useStructureEntityId";
-import { useFetchBlockchainData } from "@/hooks/store/useBlockchainStore";
-import { LoadingStateKey } from "@/hooks/store/useWorldLoading";
-import { ADMIN_BANK_ENTITY_ID } from "@bibliothecadao/eternum";
+} from "@/dojo/debounced-queries";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import { useStructureEntityId } from "@/hooks/helpers/use-structure-entity-id";
+import { useFetchBlockchainData } from "@/hooks/store/use-blockchain-store";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { LoadingStateKey } from "@/hooks/store/use-world-loading";
+import { rewards } from "@/ui/components/navigation/config";
+import { LoadingOroborus } from "@/ui/modules/loading-oroborus";
+import { LoadingScreen } from "@/ui/modules/loading-screen";
+import { ADMIN_BANK_ENTITY_ID, PlayerStructure } from "@bibliothecadao/eternum";
import { getComponentValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
+import { Leva } from "leva";
+import { lazy, Suspense, useEffect, useMemo, useState } from "react";
+import { Redirect } from "wouter";
import { env } from "../../../env";
-import { rewards } from "../components/navigation/Config";
import { IS_MOBILE } from "../config";
-import { LoadingOroborus } from "../modules/loading-oroborus";
-import { LoadingScreen } from "../modules/LoadingScreen";
// Lazy load components
const SelectedArmy = lazy(() =>
- import("../components/worldmap/armies/SelectedArmy").then((module) => ({ default: module.SelectedArmy })),
+ import("@/ui/components/worldmap/armies/selected-army").then((module) => ({ default: module.SelectedArmy })),
);
const ActionInfo = lazy(() =>
- import("../components/worldmap/armies/ActionInfo").then((module) => ({ default: module.ActionInfo })),
+ import("@/ui/components/worldmap/armies/action-info").then((module) => ({ default: module.ActionInfo })),
);
const ActionInstructions = lazy(() =>
- import("../components/worldmap/armies/ActionInstructions").then((module) => ({ default: module.ActionInstructions })),
+ import("@/ui/components/worldmap/armies/action-instructions").then((module) => ({
+ default: module.ActionInstructions,
+ })),
);
const ArmyInfoLabel = lazy(() =>
- import("../components/worldmap/armies/ArmyInfoLabel").then((module) => ({ default: module.ArmyInfoLabel })),
+ import("@/ui/components/worldmap/armies/army-info-label").then((module) => ({ default: module.ArmyInfoLabel })),
);
const BattleInfoLabel = lazy(() =>
- import("../components/worldmap/battles/BattleLabel").then((module) => ({ default: module.BattleInfoLabel })),
+ import("@/ui/components/worldmap/battles/battle-label").then((module) => ({ default: module.BattleInfoLabel })),
);
const BlankOverlayContainer = lazy(() =>
- import("../containers/BlankOverlayContainer").then((module) => ({ default: module.BlankOverlayContainer })),
+ import("@/ui/containers/blank-overlay-container").then((module) => ({ default: module.BlankOverlayContainer })),
);
const StructureInfoLabel = lazy(() =>
- import("../components/worldmap/structures/StructureLabel").then((module) => ({ default: module.StructureInfoLabel })),
+ import("@/ui/components/worldmap/structures/structure-label").then((module) => ({
+ default: module.StructureInfoLabel,
+ })),
);
const BattleContainer = lazy(() =>
- import("../containers/BattleContainer").then((module) => ({ default: module.BattleContainer })),
+ import("@/ui/containers/battle-container").then((module) => ({ default: module.BattleContainer })),
);
-const TopCenterContainer = lazy(() => import("../containers/TopCenterContainer"));
+const TopCenterContainer = lazy(() => import("@/ui/containers/top-center-container"));
const BottomRightContainer = lazy(() =>
- import("../containers/BottomRightContainer").then((module) => ({ default: module.BottomRightContainer })),
+ import("@/ui/containers/bottom-right-container").then((module) => ({ default: module.BottomRightContainer })),
);
-const LeftMiddleContainer = lazy(() => import("../containers/LeftMiddleContainer"));
-const RightMiddleContainer = lazy(() => import("../containers/RightMiddleContainer"));
-const TopLeftContainer = lazy(() => import("../containers/TopLeftContainer"));
-const Tooltip = lazy(() => import("../elements/Tooltip").then((module) => ({ default: module.Tooltip })));
+const LeftMiddleContainer = lazy(() => import("@/ui/containers/left-middle-container"));
+const RightMiddleContainer = lazy(() => import("@/ui/containers/right-middle-container"));
+const TopLeftContainer = lazy(() => import("@/ui/containers/top-left-container"));
+const Tooltip = lazy(() => import("@/ui/elements/tooltip").then((module) => ({ default: module.Tooltip })));
const BattleView = lazy(() =>
- import("../modules/military/battle-view/BattleView").then((module) => ({ default: module.BattleView })),
+ import("@/ui/modules/military/battle-view/battle-view").then((module) => ({ default: module.BattleView })),
);
const TopMiddleNavigation = lazy(() =>
- import("../modules/navigation/TopNavigation").then((module) => ({ default: module.TopMiddleNavigation })),
+ import("@/ui/modules/navigation/top-navigation").then((module) => ({ default: module.TopMiddleNavigation })),
);
const BottomMiddleContainer = lazy(() =>
- import("../containers/BottomMiddleContainer").then((module) => ({ default: module.BottomMiddleContainer })),
+ import("@/ui/containers/bottom-middle-container").then((module) => ({ default: module.BottomMiddleContainer })),
);
const LeftNavigationModule = lazy(() =>
- import("../modules/navigation/LeftNavigationModule").then((module) => ({ default: module.LeftNavigationModule })),
+ import("@/ui/modules/navigation/left-navigation-module").then((module) => ({ default: module.LeftNavigationModule })),
);
const RightNavigationModule = lazy(() =>
- import("../modules/navigation/RightNavigationModule").then((module) => ({ default: module.RightNavigationModule })),
+ import("@/ui/modules/navigation/right-navigation-module").then((module) => ({
+ default: module.RightNavigationModule,
+ })),
);
const TopLeftNavigation = lazy(() =>
- import("../modules/navigation/TopLeftNavigation").then((module) => ({ default: module.TopLeftNavigation })),
+ import("@/ui/modules/navigation/top-left-navigation").then((module) => ({ default: module.TopLeftNavigation })),
);
const EventStream = lazy(() =>
- import("../modules/stream/EventStream").then((module) => ({ default: module.EventStream })),
+ import("@/ui/modules/stream/event-stream").then((module) => ({ default: module.EventStream })),
);
-const Onboarding = lazy(() => import("./Onboarding").then((module) => ({ default: module.Onboarding })));
+const Onboarding = lazy(() => import("./onboarding").then((module) => ({ default: module.Onboarding })));
const OrientationOverlay = lazy(() =>
- import("../components/overlays/OrientationOverlay").then((module) => ({ default: module.OrientationOverlay })),
+ import("@/ui/components/overlays/orientation-overlay").then((module) => ({ default: module.OrientationOverlay })),
);
const MiniMapNavigation = lazy(() =>
- import("../modules/navigation/MiniMapNavigation").then((module) => ({ default: module.MiniMapNavigation })),
+ import("@/ui/modules/navigation/mini-map-navigation").then((module) => ({ default: module.MiniMapNavigation })),
);
export const World = ({ backgroundImage }: { backgroundImage: string }) => {
@@ -110,12 +114,11 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => {
const dojo = useDojo();
const structureEntityId = useUIStore((state) => state.structureEntityId);
- const { playerStructures } = useEntities();
- const structures = playerStructures();
+ const playerStructures = usePlayerStructures();
const filteredStructures = useMemo(
- () => structures.filter((structure: PlayerStructure) => !subscriptions[structure.entity_id.toString()]),
- [structures, subscriptions],
+ () => playerStructures.filter((structure: PlayerStructure) => !subscriptions[structure.entity_id.toString()]),
+ [playerStructures, subscriptions],
);
useEffect(() => {
@@ -190,7 +193,7 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => {
await debounceAddDonkeysAndArmiesSubscription(
dojo.network.toriiClient,
dojo.network.contractComponents as any,
- [...structures.map((structure) => structure.entity_id)],
+ [...playerStructures.map((structure) => structure.entity_id)],
() => setLoading(LoadingStateKey.DonkeysAndArmies, false),
);
} catch (error) {
@@ -199,7 +202,7 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => {
};
fetch();
- }, [structures.length]);
+ }, [playerStructures.length]);
useEffect(() => {
const fetch = async () => {
@@ -332,7 +335,7 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => {
)}
-
+
diff --git a/client/apps/game/src/ui/modules/chat/ChatTab.tsx b/client/apps/game/src/ui/modules/chat/chat-tab.tsx
similarity index 81%
rename from client/apps/game/src/ui/modules/chat/ChatTab.tsx
rename to client/apps/game/src/ui/modules/chat/chat-tab.tsx
index 60d553885f..e7e5ba3abe 100644
--- a/client/apps/game/src/ui/modules/chat/ChatTab.tsx
+++ b/client/apps/game/src/ui/modules/chat/chat-tab.tsx
@@ -1,28 +1,7 @@
import { AnimatePresence, motion } from "framer-motion";
import { X } from "lucide-react";
import { useMemo } from "react";
-import { useChatStore } from "./ChatState";
-import { GLOBAL_CHANNEL, GLOBAL_CHANNEL_KEY } from "./constants";
-
-export const DEFAULT_TAB: Tab = {
- name: GLOBAL_CHANNEL_KEY,
- address: "0x0",
- key: GLOBAL_CHANNEL,
- displayed: true,
- lastSeen: new Date(),
- lastMessage: undefined,
- mandatory: true,
-};
-
-export const EVENT_STREAM_TAB: Tab = {
- name: "Events",
- address: "0x1",
- key: "events",
- displayed: true,
- lastSeen: new Date(),
- lastMessage: undefined,
- mandatory: true,
-};
+import { useChatStore } from "./use-chat-store";
export interface Tab {
name: string;
diff --git a/client/apps/game/src/ui/modules/chat/Chat.tsx b/client/apps/game/src/ui/modules/chat/chat.tsx
similarity index 94%
rename from client/apps/game/src/ui/modules/chat/Chat.tsx
rename to client/apps/game/src/ui/modules/chat/chat.tsx
index ab684baebb..4875ac3265 100644
--- a/client/apps/game/src/ui/modules/chat/Chat.tsx
+++ b/client/apps/game/src/ui/modules/chat/chat.tsx
@@ -1,25 +1,24 @@
import { ReactComponent as Minimize } from "@/assets/icons/common/minimize.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useGetAllPlayers } from "@/hooks/helpers/use-get-all-players";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useGuilds } from "@/hooks/helpers/use-guilds";
+import { usePlayers } from "@/hooks/helpers/use-players";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
+import TextInput from "@/ui/elements/text-input";
+import { ChatTab } from "@/ui/modules/chat/chat-tab";
+import { CHAT_COLORS, DEFAULT_TAB, GLOBAL_CHANNEL, GLOBAL_CHANNEL_KEY } from "@/ui/modules/chat/constants";
+import { InputField } from "@/ui/modules/chat/input-field";
+import { ChatMetadata, Tab } from "@/ui/modules/chat/types";
+import { useChatStore } from "@/ui/modules/chat/use-chat-store";
+import { getMessageKey } from "@/ui/modules/chat/utils";
+import { EventStream } from "@/ui/modules/stream/event-stream";
+import { toHexString } from "@/ui/utils/utils";
+import { ContractAddress, Player } from "@bibliothecadao/eternum";
import { useEntityQuery } from "@dojoengine/react";
import { getComponentValue, Has, HasValue } from "@dojoengine/recs";
import { getEntityIdFromKeys } from "@dojoengine/utils";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { shortString } from "starknet";
-import { useGuilds } from "@/hooks/helpers/useGuilds";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/Select";
-import TextInput from "@/ui/elements/TextInput";
-import { toHexString } from "@/ui/utils/utils";
-import { ContractAddress, Player } from "@bibliothecadao/eternum";
-import { EventStream } from "../stream/EventStream";
-import { useChatStore } from "./ChatState";
-import { ChatTab, DEFAULT_TAB } from "./ChatTab";
-import { CHAT_COLORS, GLOBAL_CHANNEL, GLOBAL_CHANNEL_KEY } from "./constants";
-import { InputField } from "./InputField";
-import { ChatMetadata, Tab } from "./types";
-import { getMessageKey } from "./utils";
-
export const Chat = () => {
const {
account: { account },
@@ -45,11 +44,7 @@ export const Chat = () => {
const addTab = useChatStore((state) => state.addTab);
- const getPlayers = useGetAllPlayers();
-
- const players = useMemo(() => {
- return getPlayers().filter((player) => player.address !== BigInt(account.address));
- }, []);
+ const players = usePlayers();
useEffect(() => {
scrollToElement(bottomChatRef);
diff --git a/client/apps/game/src/ui/modules/chat/constants.tsx b/client/apps/game/src/ui/modules/chat/constants.tsx
index 09cd66dcae..a5e43cccbf 100644
--- a/client/apps/game/src/ui/modules/chat/constants.tsx
+++ b/client/apps/game/src/ui/modules/chat/constants.tsx
@@ -1,4 +1,5 @@
import { shortString } from "starknet";
+import { Tab } from "./types";
const PASTEL_PINK = "#F6C297";
const PASTEL_BLUE = "#BAE1FF";
@@ -11,3 +12,23 @@ export const CHAT_COLORS = {
export const GLOBAL_CHANNEL = shortString.encodeShortString("global");
export const CHAT_STORAGE_KEY = "chat_tabs";
export const GLOBAL_CHANNEL_KEY = "global";
+
+export const DEFAULT_TAB: Tab = {
+ name: GLOBAL_CHANNEL_KEY,
+ address: "0x0",
+ key: GLOBAL_CHANNEL,
+ displayed: true,
+ lastSeen: new Date(),
+ lastMessage: undefined,
+ mandatory: true,
+};
+
+export const EVENT_STREAM_TAB: Tab = {
+ name: "Events",
+ address: "0x1",
+ key: "events",
+ displayed: true,
+ lastSeen: new Date(),
+ lastMessage: undefined,
+ mandatory: true,
+};
diff --git a/client/apps/game/src/ui/modules/chat/InputField.tsx b/client/apps/game/src/ui/modules/chat/input-field.tsx
similarity index 90%
rename from client/apps/game/src/ui/modules/chat/InputField.tsx
rename to client/apps/game/src/ui/modules/chat/input-field.tsx
index e0f72a8e0b..4a1a8f5436 100644
--- a/client/apps/game/src/ui/modules/chat/InputField.tsx
+++ b/client/apps/game/src/ui/modules/chat/input-field.tsx
@@ -1,13 +1,13 @@
-import { useDojo } from "@/hooks/context/DojoContext";
-import TextInput from "@/ui/elements/TextInput";
+import { useDojo } from "@/hooks/context/dojo-context";
+import TextInput from "@/ui/elements/text-input";
+import { scrollToElement } from "@/ui/modules/chat/chat";
+import { GLOBAL_CHANNEL, GLOBAL_CHANNEL_KEY } from "@/ui/modules/chat/constants";
+import { Tab } from "@/ui/modules/chat/types";
import { toHexString, toValidAscii } from "@/ui/utils/utils";
import { Has, HasValue, getComponentValue, runQuery } from "@dojoengine/recs";
import { useCallback, useRef } from "react";
import { Signature } from "starknet";
import { env } from "../../../../env";
-import { scrollToElement } from "./Chat";
-import { GLOBAL_CHANNEL, GLOBAL_CHANNEL_KEY } from "./constants";
-import { Tab } from "./types";
export const InputField = ({
currentTab,
@@ -106,7 +106,7 @@ function generateMessageTypedData(
{ name: "chainId", type: "shortstring" },
{ name: "revision", type: "shortstring" },
],
- "s0_eternum-Message": [
+ "s1_eternum-Message": [
{ name: "identity", type: "ContractAddress" },
{ name: "channel", type: "shortstring" },
{ name: "content", type: "string" },
@@ -114,7 +114,7 @@ function generateMessageTypedData(
{ name: "salt", type: "felt" },
],
},
- primaryType: "s0_eternum-Message",
+ primaryType: "s1_eternum-Message",
domain: {
name: "Eternum",
version: "1",
diff --git a/client/apps/game/src/ui/modules/chat/ChatState.tsx b/client/apps/game/src/ui/modules/chat/use-chat-store.tsx
similarity index 95%
rename from client/apps/game/src/ui/modules/chat/ChatState.tsx
rename to client/apps/game/src/ui/modules/chat/use-chat-store.tsx
index 46837505e9..f8be0cc67b 100644
--- a/client/apps/game/src/ui/modules/chat/ChatState.tsx
+++ b/client/apps/game/src/ui/modules/chat/use-chat-store.tsx
@@ -1,8 +1,7 @@
+import { CHAT_STORAGE_KEY, DEFAULT_TAB, EVENT_STREAM_TAB, GLOBAL_CHANNEL_KEY } from "@/ui/modules/chat/constants";
+import { Tab } from "@/ui/modules/chat/types";
import { create } from "zustand";
import { createJSONStorage, persist } from "zustand/middleware";
-import { DEFAULT_TAB, EVENT_STREAM_TAB } from "./ChatTab";
-import { CHAT_STORAGE_KEY, GLOBAL_CHANNEL_KEY } from "./constants";
-import { Tab } from "./types";
interface ChatState {
tabs: Tab[];
diff --git a/client/apps/game/src/ui/modules/chat/utils.tsx b/client/apps/game/src/ui/modules/chat/utils.tsx
index 1b128db8ff..b0313ffa67 100644
--- a/client/apps/game/src/ui/modules/chat/utils.tsx
+++ b/client/apps/game/src/ui/modules/chat/utils.tsx
@@ -1,4 +1,5 @@
import { starknetKeccak } from "@dojoengine/torii-client";
+import { Buffer } from "buffer";
export const getMessageKey = (addressOne: string | bigint, addressTwo: string | bigint) => {
if (typeof addressOne === "string") {
diff --git a/client/apps/game/src/ui/modules/controller/Controller.tsx b/client/apps/game/src/ui/modules/controller/controller.tsx
similarity index 94%
rename from client/apps/game/src/ui/modules/controller/Controller.tsx
rename to client/apps/game/src/ui/modules/controller/controller.tsx
index c1c5e798cd..19f8fa0dfc 100644
--- a/client/apps/game/src/ui/modules/controller/Controller.tsx
+++ b/client/apps/game/src/ui/modules/controller/controller.tsx
@@ -1,9 +1,8 @@
import { ReactComponent as CartridgeSmall } from "@/assets/icons/cartridge-small.svg";
import { ReactComponent as Disconnect } from "@/assets/icons/disconnect.svg";
-import { useAccountStore } from "@/hooks/context/accountStore";
-import useUIStore from "@/hooks/store/useUIStore";
-
-import Button from "@/ui/elements/Button";
+import { useAccountStore } from "@/hooks/context/account-store";
+import useUIStore from "@/hooks/store/use-ui-store";
+import Button from "@/ui/elements/button";
import { useConnect, useDisconnect } from "@starknet-react/core";
import { useCallback, useEffect, useState } from "react";
diff --git a/client/apps/game/src/ui/modules/entity-details/Battles.tsx b/client/apps/game/src/ui/modules/entity-details/Battles.tsx
deleted file mode 100644
index c022b69d81..0000000000
--- a/client/apps/game/src/ui/modules/entity-details/Battles.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { BattleInfo } from "@/hooks/helpers/battles/useBattles";
-import { BattleListItem } from "@/ui/components/battles/BattleListItem";
-import { ArmyInfo } from "@bibliothecadao/eternum";
-
-export const Battles = ({ ownArmy, battles }: { ownArmy: ArmyInfo | undefined; battles: BattleInfo[] }) => {
- return (
-
- {battles.length > 0 && (
- <>
- Battles
- {battles.map((battle) => (
-
- ))}
- >
- )}
-
- );
-};
diff --git a/client/apps/game/src/ui/modules/entity-details/EntityDetails.tsx b/client/apps/game/src/ui/modules/entity-details/EntityDetails.tsx
deleted file mode 100644
index 0c7009f25d..0000000000
--- a/client/apps/game/src/ui/modules/entity-details/EntityDetails.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import { useQuery } from "@/hooks/helpers/useQuery";
-import { BuildingEntityDetails } from "./BuildingEntityDetails";
-import { CombatEntityDetails } from "./CombatEntityDetails";
-
-export const EntityDetails = ({ className }: { className?: string }) => {
- const { isMapView } = useQuery();
- return {isMapView ? : } ;
-};
diff --git a/client/apps/game/src/ui/modules/entity-details/battles.tsx b/client/apps/game/src/ui/modules/entity-details/battles.tsx
new file mode 100644
index 0000000000..9dd60d5cf7
--- /dev/null
+++ b/client/apps/game/src/ui/modules/entity-details/battles.tsx
@@ -0,0 +1,17 @@
+import { BattleListItem } from "@/ui/components/battles/battle-list-item";
+import { ArmyInfo, ID } from "@bibliothecadao/eternum";
+
+export const Battles = ({ ownArmy, battles }: { ownArmy: ArmyInfo | undefined; battles: ID[] }) => {
+ return (
+
+ {battles.length > 0 && (
+ <>
+ Battles
+ {battles.map((battle) => (
+
+ ))}
+ >
+ )}
+
+ );
+};
diff --git a/client/apps/game/src/ui/modules/entity-details/BuildingEntityDetails.tsx b/client/apps/game/src/ui/modules/entity-details/building-entity-details.tsx
similarity index 86%
rename from client/apps/game/src/ui/modules/entity-details/BuildingEntityDetails.tsx
rename to client/apps/game/src/ui/modules/entity-details/building-entity-details.tsx
index 9217628b20..e7f7ca60d3 100644
--- a/client/apps/game/src/ui/modules/entity-details/BuildingEntityDetails.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/building-entity-details.tsx
@@ -1,18 +1,27 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useEntities, useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import useUIStore from "@/hooks/store/useUIStore";
-import { soundSelector, useUiSounds } from "@/hooks/useUISound";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { usePlayerStructures } from "@/hooks/helpers/use-entities";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { soundSelector, useUiSounds } from "@/hooks/use-ui-sound";
import { ResourceMiningTypes } from "@/types";
-import { BuildingInfo, ResourceInfo } from "@/ui/components/construction/SelectPreviewBuilding";
-import Button from "@/ui/elements/Button";
+import { BuildingInfo, ResourceInfo } from "@/ui/components/construction/select-preview-building";
+import Button from "@/ui/elements/button";
+import { RealmDetails } from "@/ui/modules/entity-details/realm/realm-details";
+import { LeftView } from "@/ui/modules/navigation/left-navigation-module";
import { ResourceIdToMiningType, getEntityIdFromKeys } from "@/ui/utils/utils";
-import { BUILDINGS_CENTER, BuildingType, ID, ResourcesIds, StructureType, TileManager } from "@bibliothecadao/eternum";
+import { getEntityInfo } from "@/utils/entities";
+import {
+ BUILDINGS_CENTER,
+ BuildingType,
+ ContractAddress,
+ ID,
+ ResourcesIds,
+ StructureType,
+ TileManager,
+} from "@bibliothecadao/eternum";
import { useComponentValue } from "@dojoengine/react";
import { getComponentValue } from "@dojoengine/recs";
import { useCallback, useEffect, useMemo, useState } from "react";
-import { LeftView } from "../navigation/LeftNavigationModule";
-import { RealmDetails } from "./realm/RealmDetails";
export const BuildingEntityDetails = () => {
const dojo = useDojo();
@@ -31,8 +40,6 @@ export const BuildingEntityDetails = () => {
const [isOwnedByPlayer, setIsOwnedByPlayer] = useState(false);
const [showDestroyConfirm, setShowDestroyConfirm] = useState(false);
- const { getEntityInfo } = useEntitiesUtils();
-
const structureEntityId = useUIStore((state) => state.structureEntityId);
const selectedBuildingHex = useUIStore((state) => state.selectedBuildingHex);
const setLeftNavigationView = useUIStore((state) => state.setLeftNavigationView);
@@ -40,9 +47,13 @@ export const BuildingEntityDetails = () => {
const { play: playDestroyStone } = useUiSounds(soundSelector.destroyStone);
const { play: playDestroyWooden } = useUiSounds(soundSelector.destroyWooden);
- const { playerStructures } = useEntities();
+ const playerStructures = usePlayerStructures();
- const selectedStructureInfo = getEntityInfo(structureEntityId);
+ const selectedStructureInfo = getEntityInfo(
+ structureEntityId,
+ ContractAddress(dojo.account.account.address),
+ dojo.setup.components,
+ );
const isCastleSelected = useMemo(
() =>
@@ -57,8 +68,6 @@ export const BuildingEntityDetails = () => {
getEntityIdFromKeys(Object.values(selectedBuildingHex).map((v) => BigInt(v))),
);
- const structures = playerStructures();
-
useEffect(() => {
if (building) {
setBuildingState({
@@ -67,7 +76,7 @@ export const BuildingEntityDetails = () => {
ownerEntityId: building.outer_entity_id,
});
setIsPaused(building.paused);
- setIsOwnedByPlayer(structures.some((structure) => structure.entity_id === building.outer_entity_id));
+ setIsOwnedByPlayer(playerStructures.some((structure) => structure.entity_id === building.outer_entity_id));
} else {
setBuildingState({
buildingType: undefined,
diff --git a/client/apps/game/src/ui/modules/entity-details/CombatEntityDetails.tsx b/client/apps/game/src/ui/modules/entity-details/combat-entity-details.tsx
similarity index 70%
rename from client/apps/game/src/ui/modules/entity-details/CombatEntityDetails.tsx
rename to client/apps/game/src/ui/modules/entity-details/combat-entity-details.tsx
index 420e6b2bb9..e02d9ba531 100644
--- a/client/apps/game/src/ui/modules/entity-details/CombatEntityDetails.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/combat-entity-details.tsx
@@ -1,20 +1,17 @@
-import { useBattlesByPosition } from "@/hooks/helpers/battles/useBattles";
-import { useOwnArmiesByPosition } from "@/hooks/helpers/useArmies";
-import { ArmyInfo } from "@bibliothecadao/eternum";
-
-import { useEntities } from "@/hooks/helpers/useEntities";
-import { useStructureAtPosition } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import { Position } from "@/types/Position";
-import { HintSection } from "@/ui/components/hints/HintModal";
-import { ArmyChip } from "@/ui/components/military/ArmyChip";
-import { PillageHistory } from "@/ui/components/military/PillageHistory";
-import { HintModalButton } from "@/ui/elements/HintModalButton";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/Select";
+import { useArmiesAtPosition } from "@/hooks/helpers/use-armies";
+import { useBattlesAtPosition } from "@/hooks/helpers/use-battles";
+import { useStructureAtPosition } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { Position } from "@/types/position";
+import { HintSection } from "@/ui/components/hints/hint-modal";
+import { ArmyChip } from "@/ui/components/military/army-chip";
+import { PillageHistory } from "@/ui/components/military/pillage-history";
+import { HintModalButton } from "@/ui/elements/hint-modal-button";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/ui/elements/select";
import { Tabs } from "@/ui/elements/tab";
-import { ID } from "@bibliothecadao/eternum";
+import { Entities } from "@/ui/modules/entity-details/entities";
+import { ArmyInfo, ID } from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
-import { Entities } from "./Entities";
export const CombatEntityDetails = () => {
const selectedHex = useUIStore((state) => state.selectedHex);
@@ -25,25 +22,23 @@ export const CombatEntityDetails = () => {
() => new Position({ x: selectedHex?.col || 0, y: selectedHex?.row || 0 }),
[selectedHex],
);
- const { playerStructures } = useEntities();
- const ownArmiesAtPosition = useOwnArmiesByPosition({
+ const armiesAtPosition = useArmiesAtPosition({
position: hexPosition.getContract(),
- inBattle: false,
- playerStructures: playerStructures(),
});
- const userArmies = useMemo(
- () => ownArmiesAtPosition.filter((army) => army.health.current > 0),
- [ownArmiesAtPosition],
+ // player armies that are not in battle
+ const playerArmies = useMemo(
+ () => armiesAtPosition.filter((army) => army.isMine && army.battle_id === 0),
+ [armiesAtPosition],
);
const ownArmy = useMemo(() => {
- return ownArmiesAtPosition.find((army) => army.entity_id === selectedEntityId);
- }, [ownArmiesAtPosition, selectedEntityId]);
+ return playerArmies.find((army) => army.entity_id === selectedEntityId);
+ }, [playerArmies, selectedEntityId]);
const structure = useStructureAtPosition(hexPosition.getContract());
- const battles = useBattlesByPosition(hexPosition.getContract());
+ const battles = useBattlesAtPosition(hexPosition.getContract());
const tabs = useMemo(
() => [
@@ -54,7 +49,7 @@ export const CombatEntityDetails = () => {
Entities
),
- component: selectedHex && ,
+ component: selectedHex && ,
},
...(structure
? [
@@ -87,11 +82,11 @@ export const CombatEntityDetails = () => {
{tab.label}
))}
- {selectedTab !== 2 && userArmies.length > 0 && (
+ {selectedTab !== 2 && playerArmies.length > 0 && (
)}
diff --git a/client/apps/game/src/ui/modules/entity-details/EnemyArmies.tsx b/client/apps/game/src/ui/modules/entity-details/enemy-armies.tsx
similarity index 81%
rename from client/apps/game/src/ui/modules/entity-details/EnemyArmies.tsx
rename to client/apps/game/src/ui/modules/entity-details/enemy-armies.tsx
index bbcaf2342a..87bf26d8cb 100644
--- a/client/apps/game/src/ui/modules/entity-details/EnemyArmies.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/enemy-armies.tsx
@@ -1,12 +1,12 @@
import { ReactComponent as Swords } from "@/assets/icons/common/cross-swords.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useEntitiesUtils } from "@/hooks/helpers/useEntities";
-import { useIsStructureImmune, useStructureAtPosition } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import useNextBlockTimestamp from "@/hooks/useNextBlockTimestamp";
-import { Position } from "@/types/Position";
-import { ArmyChip } from "@/ui/components/military/ArmyChip";
-import { ArmyInfo, BattleManager } from "@bibliothecadao/eternum";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useIsStructureImmune, useStructureAtPosition } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import useNextBlockTimestamp from "@/hooks/use-next-block-timestamp";
+import { Position } from "@/types/position";
+import { ArmyChip } from "@/ui/components/military/army-chip";
+import { getEntityInfo } from "@/utils/entities";
+import { ArmyInfo, BattleManager, ContractAddress } from "@bibliothecadao/eternum";
import clsx from "clsx";
import React, { useCallback, useMemo } from "react";
@@ -20,7 +20,6 @@ export const EnemyArmies = ({
position: Position;
}) => {
const dojo = useDojo();
- const { getEntityInfo } = useEntitiesUtils();
const structureAtPosition = useStructureAtPosition(position.getContract());
const { nextBlockTimestamp } = useNextBlockTimestamp();
@@ -28,7 +27,11 @@ export const EnemyArmies = ({
const setBattleView = useUIStore((state) => state.setBattleView);
const setTooltip = useUIStore((state) => state.setTooltip);
- const entityInfo = getEntityInfo(ownArmySelected?.entityOwner.entity_owner_id ?? 0).structure;
+ const entityInfo = getEntityInfo(
+ ownArmySelected?.entityOwner.entity_owner_id ?? 0,
+ ContractAddress(dojo.account.account.address),
+ dojo.setup.components,
+ ).structure;
const ownArmystructure = useMemo(() => {
return ownArmySelected ? entityInfo : undefined;
@@ -42,7 +45,11 @@ export const EnemyArmies = ({
const getArmyChip = useCallback(
(army: ArmyInfo, index: number) => {
- const structure = getEntityInfo(army.entityOwner.entity_owner_id).structure;
+ const structure = getEntityInfo(
+ army.entityOwner.entity_owner_id,
+ ContractAddress(dojo.account.account.address),
+ dojo.setup.components,
+ ).structure;
const isImmune = useIsStructureImmune(structure, nextBlockTimestamp!) || ownArmyIsImmune;
const button = ownArmySelected && (
diff --git a/client/apps/game/src/ui/modules/entity-details/Entities.tsx b/client/apps/game/src/ui/modules/entity-details/entities.tsx
similarity index 57%
rename from client/apps/game/src/ui/modules/entity-details/Entities.tsx
rename to client/apps/game/src/ui/modules/entity-details/entities.tsx
index 7df8c67721..606e075b2b 100644
--- a/client/apps/game/src/ui/modules/entity-details/Entities.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/entities.tsx
@@ -1,31 +1,27 @@
-import { BattleInfo } from "@/hooks/helpers/battles/useBattles";
-import { useEnemyArmiesByPosition } from "@/hooks/helpers/useArmies";
-import { useEntities } from "@/hooks/helpers/useEntities";
-import { Position } from "@/types/Position";
-import { StructureCard } from "@/ui/components/structures/worldmap/StructureCard";
-import { Checkbox } from "@/ui/elements/Checkbox";
-import { ArmyInfo } from "@bibliothecadao/eternum";
+import { useArmiesAtPosition } from "@/hooks/helpers/use-armies";
+import { Position } from "@/types/position";
+import { StructureCard } from "@/ui/components/structures/worldmap/structure-card";
+import { Checkbox } from "@/ui/elements/checkbox";
+import { Battles } from "@/ui/modules/entity-details/battles";
+import { EnemyArmies } from "@/ui/modules/entity-details/enemy-armies";
+import { ArmyInfo, ID } from "@bibliothecadao/eternum";
import { useState } from "react";
-import { Battles } from "./Battles";
-import { EnemyArmies } from "./EnemyArmies";
export const Entities = ({
position,
ownArmy,
- battles,
+ battleEntityIds,
}: {
position: Position;
ownArmy: ArmyInfo | undefined;
- battles: BattleInfo[];
+ battleEntityIds: ID[];
}) => {
const [showStructure, setShowStructure] = useState(true);
const [showBattles, setShowBattles] = useState(true);
const [showArmies, setShowArmies] = useState(true);
- const { playerStructures } = useEntities();
- const enemyArmies = useEnemyArmiesByPosition({
+ const armiesAtPosition = useArmiesAtPosition({
position: position.getContract(),
- playerStructures: playerStructures(),
});
return (
@@ -36,9 +32,9 @@ export const Entities = ({
setShowArmies((prev) => !prev)} text="Show armies" />
{showStructure && }
- {showBattles && }
- {showArmies && enemyArmies.length > 0 && (
-
+ {showBattles && }
+ {showArmies && armiesAtPosition.length > 0 && (
+
)}
);
diff --git a/client/apps/game/src/ui/modules/entity-details/entity-details.tsx b/client/apps/game/src/ui/modules/entity-details/entity-details.tsx
new file mode 100644
index 0000000000..8037facd65
--- /dev/null
+++ b/client/apps/game/src/ui/modules/entity-details/entity-details.tsx
@@ -0,0 +1,8 @@
+import { useQuery } from "@/hooks/helpers/use-query";
+import { BuildingEntityDetails } from "@/ui/modules/entity-details/building-entity-details";
+import { CombatEntityDetails } from "@/ui/modules/entity-details/combat-entity-details";
+
+export const EntityDetails = ({ className }: { className?: string }) => {
+ const { isMapView } = useQuery();
+ return {isMapView ? : } ;
+};
diff --git a/client/apps/game/src/ui/modules/entity-details/realm/Buildings.tsx b/client/apps/game/src/ui/modules/entity-details/realm/buildings.tsx
similarity index 90%
rename from client/apps/game/src/ui/modules/entity-details/realm/Buildings.tsx
rename to client/apps/game/src/ui/modules/entity-details/realm/buildings.tsx
index c421bdb88a..382a8f8278 100644
--- a/client/apps/game/src/ui/modules/entity-details/realm/Buildings.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/realm/buildings.tsx
@@ -1,15 +1,15 @@
import { ReactComponent as ArrowRight } from "@/assets/icons/common/arrow-right.svg";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { Building, useBuildings } from "@/hooks/helpers/use-buildings";
-import { useGetRealm } from "@/hooks/helpers/useRealm";
-import useUIStore from "@/hooks/store/useUIStore";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useBuildings } from "@/hooks/helpers/use-buildings";
+import useUIStore from "@/hooks/store/use-ui-store";
import { BUILDING_IMAGES_PATH } from "@/ui/config";
-import Button from "@/ui/elements/Button";
-import { ResourceIcon } from "@/ui/elements/ResourceIcon";
-import { toHexString } from "@/ui/utils/utils";
-import { BuildingType, ResourcesIds, TileManager } from "@bibliothecadao/eternum";
+import Button from "@/ui/elements/button";
+import { ResourceIcon } from "@/ui/elements/resource-icon";
+import { getEntityIdFromKeys, toHexString } from "@/ui/utils/utils";
+import { getRealmInfo } from "@/utils/realm";
+import { Building, BuildingType, ResourcesIds, TileManager } from "@bibliothecadao/eternum";
import clsx from "clsx";
-import { useState } from "react";
+import { useMemo, useState } from "react";
export const Buildings = ({ structure }: { structure: any }) => {
const dojo = useDojo();
@@ -21,10 +21,12 @@ export const Buildings = ({ structure }: { structure: any }) => {
const [showMilitary, setShowMilitary] = useState(false);
const [isLoading, setIsLoading] = useState({ isLoading: false, innerCol: 0, innerRow: 0 });
- const realm = useGetRealm(structureEntityId).realm;
+ const realm = useMemo(
+ () => getRealmInfo(getEntityIdFromKeys([BigInt(structureEntityId)]), dojo.setup.components),
+ [structureEntityId, dojo.setup.components],
+ );
- const { getBuildings } = useBuildings();
- const buildings = getBuildings(realm.position.x, realm.position.y);
+ const buildings = useBuildings(realm?.position.x || 0, realm?.position.y || 0);
const economyBuildings = buildings.filter(
(building) =>
@@ -41,8 +43,6 @@ export const Buildings = ({ structure }: { structure: any }) => {
building.category === BuildingType[BuildingType.Stable],
);
- const isOwner = toHexString(realm.owner) === dojo.account.account.address;
-
const handlePauseResumeProduction = (paused: boolean, innerCol: number, innerRow: number) => {
setIsLoading({ isLoading: true, innerCol, innerRow });
const tileManager = new TileManager(dojo.setup.components, dojo.network.provider, {
@@ -56,6 +56,9 @@ export const Buildings = ({ structure }: { structure: any }) => {
});
};
+ if (!realm) return null;
+ const isOwner = toHexString(realm.owner) === dojo.account.account.address;
+
return (
{/* Economy Section */}
diff --git a/client/apps/game/src/ui/modules/entity-details/realm/Castle.tsx b/client/apps/game/src/ui/modules/entity-details/realm/castle.tsx
similarity index 62%
rename from client/apps/game/src/ui/modules/entity-details/realm/Castle.tsx
rename to client/apps/game/src/ui/modules/entity-details/realm/castle.tsx
index b143fc1af8..7038ea61d4 100644
--- a/client/apps/game/src/ui/modules/entity-details/realm/Castle.tsx
+++ b/client/apps/game/src/ui/modules/entity-details/realm/castle.tsx
@@ -1,35 +1,42 @@
import { configManager } from "@/dojo/setup";
-import { useDojo } from "@/hooks/context/DojoContext";
-import { useGetRealm } from "@/hooks/helpers/useRealm";
-import { useResourceBalance } from "@/hooks/helpers/useResources";
-import { useStructureByEntityId } from "@/hooks/helpers/useStructures";
-import useUIStore from "@/hooks/store/useUIStore";
-import { RealmResourcesIO } from "@/ui/components/resources/RealmResourcesIO";
-import Button from "@/ui/elements/Button";
-import { ResourceCost } from "@/ui/elements/ResourceCost";
-import { divideByPrecision, toHexString } from "@/ui/utils/utils";
-import { LEVEL_DESCRIPTIONS, REALM_MAX_LEVEL, RealmLevels, StructureType } from "@bibliothecadao/eternum";
+import { useDojo } from "@/hooks/context/dojo-context";
+import { useStructureByEntityId } from "@/hooks/helpers/use-structures";
+import useUIStore from "@/hooks/store/use-ui-store";
+import { RealmResourcesIO } from "@/ui/components/resources/realm-resources-io";
+import Button from "@/ui/elements/button";
+import { ResourceCost } from "@/ui/elements/resource-cost";
+import { divideByPrecision, getEntityIdFromKeys } from "@/ui/utils/utils";
+import { ETERNUM_CONFIG } from "@/utils/config";
+import { getRealmInfo } from "@/utils/realm";
+import { getBalance } from "@/utils/resources";
+import {
+ ContractAddress,
+ LEVEL_DESCRIPTIONS,
+ RealmLevels,
+ StructureType
+} from "@bibliothecadao/eternum";
import { useMemo, useState } from "react";
+const eternumConfig = await ETERNUM_CONFIG();
export const Castle = () => {
const dojo = useDojo();
const structureEntityId = useUIStore((state) => state.structureEntityId);
- const { getBalance } = useResourceBalance();
-
const [isLoading, setIsLoading] = useState(false);
- const realm = useGetRealm(structureEntityId).realm;
-
- const isOwner = toHexString(realm.owner) === dojo.account.account.address;
+ const realmInfo = useMemo(
+ () => getRealmInfo(getEntityIdFromKeys([BigInt(structureEntityId)]), dojo.setup.components),
+ [structureEntityId, dojo.setup.components],
+ );
const structure = useStructureByEntityId(structureEntityId);
const getNextRealmLevel = useMemo(() => {
- const nextLevel = realm.level + 1;
- return nextLevel < REALM_MAX_LEVEL ? nextLevel : null;
- }, [realm.level]);
+ if (!realmInfo) return null;
+ const nextLevel = realmInfo.level + 1;
+ return nextLevel < eternumConfig.realmMaxLevel ? nextLevel : null;
+ }, [realmInfo]);
const checkBalance = useMemo(() => {
if (!getNextRealmLevel) return false;
@@ -38,21 +45,25 @@ export const Castle = () => {
return Object.keys(cost).every((resourceId) => {
const resourceCost = cost[Number(resourceId)];
- const balance = getBalance(structureEntityId, resourceCost.resource);
+ const balance = getBalance(structureEntityId, resourceCost.resource, dojo.setup.components);
return divideByPrecision(balance.balance) >= resourceCost.amount;
});
}, [getBalance, structureEntityId]);
const levelUpRealm = async () => {
setIsLoading(true);
+ if (!realmInfo) return;
await dojo.setup.systemCalls.upgrade_realm({
signer: dojo.account.account,
- realm_entity_id: realm.entityId,
+ realm_entity_id: realmInfo.entityId,
});
setIsLoading(false);
};
+ if (!realmInfo) return null;
+ const isOwner = realmInfo.owner === ContractAddress(dojo.account.account.address);
+
return (
structure && (
@@ -60,7 +71,7 @@ export const Castle = () => {
- {RealmLevels[realm.level]}
+ {RealmLevels[realmInfo.level]}
{getNextRealmLevel && isOwner && (
|