clean guild (#2650)

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

@@ -12,13 +12,13 @@ import {
   configManager,
   ContractAddress,
   getAddressNameFromEntity,
+  getGuildFromPlayerAddress,
   LeaderboardManager,
   MAX_NAME_LENGTH,
 } from "@bibliothecadao/eternum";
 import {
   ProgressWithPercentage,
   useDojo,
-  useGuilds,
   useHyperstructureData,
   useHyperstructureProgress,
   useHyperstructureUpdates,
@@ -52,8 +52,6 @@ export const HyperstructurePanel = ({ entity }: any) => {
     },
   } = dojo;
 
-  const { getGuildFromPlayerAddress } = useGuilds();
-
   const updateLeaderboard = useHyperstructureData();
 
   const [isLoading, setIsLoading] = useState<Loading>(Loading.None);
@@ -76,7 +74,10 @@ export const HyperstructurePanel = ({ entity }: any) => {
 
   const hyperstructure = useComponentValue(components.Hyperstructure, getEntityIdFromKeys([BigInt(entity.entity_id)]));
 
-  const playerGuild = useMemo(() => getGuildFromPlayerAddress(ContractAddress(account.address)), []);
+  const playerGuild = useMemo(
+    () => getGuildFromPlayerAddress(ContractAddress(account.address), dojo.setup.components),
+    [],
+  );
 
   const contributeToConstruction = async () => {
     const formattedContributions = Object.entries(newContributions).map(([resourceId, amount]) => ({
@@ -123,7 +124,7 @@ export const HyperstructurePanel = ({ entity }: any) => {
   }, [progresses, myContributions]);
 
   const canContribute = useMemo(() => {
-    const hyperstructureOwnerGuild = getGuildFromPlayerAddress(BigInt(entity?.owner || 0));
+    const hyperstructureOwnerGuild = getGuildFromPlayerAddress(BigInt(entity?.owner || 0), components);
     return (
       entity.isOwner ||
       (hyperstructure?.access === Access[Access.GuildOnly] &&

client/apps/game/src/ui/components/structures/worldmap/structure-card.tsx

@@ -16,11 +16,12 @@ import {
   configManager,
   ContractAddress,
   getArmy,
+  getGuildFromPlayerAddress,
   getStructureAtPosition,
   ID,
   ResourcesIds,
 } from "@bibliothecadao/eternum";
-import { useDojo, useGuilds, useQuery } from "@bibliothecadao/react";
+import { useDojo, useQuery } from "@bibliothecadao/react";
 import { useComponentValue } from "@dojoengine/react";
 import { getEntityIdFromKeys } from "@dojoengine/utils";
 import clsx from "clsx";
@@ -44,8 +45,6 @@ export const StructureCard = ({
 
   const { handleUrlChange } = useQuery();
 
-  const { getGuildFromPlayerAddress } = useGuilds();
-
   const structure = useMemo(
     () =>
       getStructureAtPosition(
@@ -57,7 +56,7 @@ export const StructureCard = ({
   );
 
   const playerGuild = useMemo(
-    () => getGuildFromPlayerAddress(ContractAddress(structure?.owner.address || 0n)),
+    () => getGuildFromPlayerAddress(ContractAddress(structure?.owner.address || 0n), dojo.setup.components),
     [structure?.owner.address],
   );
 

client/apps/game/src/ui/components/trading/transfer-view.tsx

@@ -5,9 +5,10 @@ import {
   RealmWithPosition,
   StructureType,
   getEntityName,
+  getGuildMembersFromPlayerAddress,
   getRealmNameById,
 } from "@bibliothecadao/eternum";
-import { useDojo, useGuilds, usePlayerRealms, usePlayerStructures } from "@bibliothecadao/react";
+import { useDojo, usePlayerRealms, usePlayerStructures } from "@bibliothecadao/react";
 import { useEntityQuery } from "@dojoengine/react";
 import { Has, NotValue, getComponentValue } from "@dojoengine/recs";
 import { useMemo, useState } from "react";
@@ -24,10 +25,11 @@ export const TransferView = () => {
 
   const [guildOnly, setGuildOnly] = useState(false);
 
-  const { getPlayersInPlayersGuild } = useGuilds();
-
   const playersInPlayersGuildAddress = useMemo(() => {
-    return getPlayersInPlayersGuild(BigInt(account.address)).map((a) => BigInt(a.address));
+    return (
+      getGuildMembersFromPlayerAddress(ContractAddress(account.address), components)?.map((a) => BigInt(a.address)) ||
+      []
+    );
   }, [account.address]);
 
   const otherStructuresQuery = useEntityQuery([

client/apps/game/src/ui/components/worldmap/guilds/guild-invites-list.tsx

@@ -2,20 +2,20 @@ import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
 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 { sortItems } from "@/ui/utils/utils";
+import { ContractAddress, GuildMemberInfo } from "@bibliothecadao/eternum";
 import clsx from "clsx";
 import { useMemo, useState } from "react";
 
 interface GuildInviteListProps {
-  invitedPlayers: GuildWhitelistInfo[];
+  invitedPlayers: GuildMemberInfo[];
   isLoading: boolean;
   viewPlayerInfo: (playerAddress: ContractAddress) => void;
   removePlayerFromWhitelist: (playerAddress: ContractAddress) => void;
 }
 
 interface InviteRowProps {
-  player: GuildWhitelistInfo;
+  player: GuildMemberInfo;
   isLoading: boolean;
   viewPlayerInfo: (playerAddress: ContractAddress) => void;
   removePlayerFromWhitelist: (playerAddress: ContractAddress) => void;
@@ -92,18 +92,15 @@ const GuildInviteListHeader = ({ activeSort, setActiveSort }: ListHeaderProps) =
 const InviteRow = ({ player, isLoading, viewPlayerInfo, removePlayerFromWhitelist }: InviteRowProps) => {
   const setTooltip = useUIStore((state) => state.setTooltip);
 
-  console.log(player);
   return (
     <div className="flex grid grid-cols-5">
       <div
-        className="col-span-4 grid grid-cols-4 text-md hover:opacity-70 hover:border p-1 rounded-xl"
+        className="col-span-4 grid grid-cols-1 text-md hover:opacity-70 hover:border p-1 rounded-xl"
         onClick={() => {
           viewPlayerInfo(ContractAddress(player.address!));
         }}
       >
-        <p className="italic">{player.rank === Number.MAX_SAFE_INTEGER ? `☠️` : `#${player.rank}`}</p>
-        <p className="col-span-2 truncate font-bold h6">{player.name}</p>
-        <p className="text-center">{currencyIntlFormat(player.points!)}</p>
+        <p className="truncate font-bold h6">{player.name}</p>
       </div>
 
       <Trash

client/apps/game/src/ui/components/worldmap/guilds/guild-list.tsx

@@ -90,9 +90,7 @@ export const GuildRow = ({
       <p className="col-span-1 text-center font-medium px-1">{guild.mines}</p>
       <p className="col-span-1 text-center font-medium px-1">{guild.hyperstructures}</p>
       <p className="col-span-1 text-center font-medium px-1">{guild.memberCount}</p>
-      <p className="col-span-2 font-medium text-amber-200/90 px-1 text-center">
-        {currencyIntlFormat(guild?.points || 0)}
-      </p>
+      <p className="col-span-2 font-medium text-amber-200/90 px-1 text-center">{0}</p>
       <div className="col-span-2 font-medium text-gold/90 px-1 flex items-center gap-1 justify-center">
         {currencyIntlFormat(guild.lords)}
         <ResourceIcon size="md" resource={ResourcesIds[ResourcesIds.Lords]} className="w-5 h-5" />

client/apps/game/src/ui/components/worldmap/guilds/guild-member-list.tsx

@@ -2,7 +2,7 @@ import { ReactComponent as Trash } from "@/assets/icons/common/trashcan.svg";
 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 { sortItems } from "@/ui/utils/utils";
 import { ContractAddress, GuildMemberInfo } from "@bibliothecadao/eternum";
 import clsx from "clsx";
 import { useMemo, useState } from "react";
@@ -39,7 +39,7 @@ export const GuildMemberList = ({
     <div className="flex flex-col p-2 border rounded-xl h-full">
       <GuildMemberListHeader activeSort={activeSort} setActiveSort={setActiveSort} />
       <div className="space-y-2 overflow-y-auto">
-        {sortItems(guildMembers, activeSort, { sortKey: "rank", sort: "asc" }).map((guildMember) => (
+        {sortItems(guildMembers, activeSort, { sortKey: "name", sort: "asc" }).map((guildMember) => (
           <GuildMemberRow
             key={guildMember.address}
             guildMember={guildMember}
@@ -62,18 +62,13 @@ const GuildMemberListHeader = ({
   setActiveSort: (sort: SortInterface) => void;
 }) => {
   const sortingParams = useMemo(() => {
-    return [
-      { label: "Rank", sortKey: "rank", className: "col-span-1 text-center px-1" },
-      { label: "Name", sortKey: "name", className: "col-span-2 px-1" },
-      { label: "Points", sortKey: "points", className: "col-span-2 text-center px-1" },
-      { label: "Age", sortKey: "age", className: "col-span-1 text-center px-1" },
-    ];
+    return [{ label: "Name", sortKey: "name", className: "col-span-2 px-1" }];
   }, []);
 
   const textStyle = "text-sm font-semibold tracking-wide text-gold/90 uppercase w-full";
 
   return (
-    <SortPanel className="grid grid-cols-6 pb-3 border-b border-gold/20">
+    <SortPanel className="grid grid-cols-2 pb-3 border-b border-gold/20">
       {sortingParams.map(({ label, sortKey, className }) => (
         <SortButton
           key={sortKey}
@@ -106,27 +101,22 @@ const GuildMemberRow = ({
   return (
     <div
       className={clsx(
-        "grid grid-cols-6 w-full py-1 cursor-pointer items-center hover:bg-gold/5 rounded-lg transition-colors duration-200 mb-1",
+        "grid grid-cols-2 w-full py-1 cursor-pointer items-center hover:bg-gold/5 rounded-lg transition-colors duration-200 mb-1",
         {
           "bg-blueish/20 hover:bg-blueish/30": guildMember.isUser,
         },
       )}
     >
       <div
-        className="col-span-6 grid grid-cols-6 items-center"
+        className="col-span-2 grid grid-cols-2 items-center"
         onClick={() => {
           viewPlayerInfo(ContractAddress(guildMember.address));
         }}
       >
-        <p className="col-span-1 text-center font-medium italic px-1">
-          {guildMember.rank === Number.MAX_SAFE_INTEGER ? `☠️` : `#${guildMember.rank}`}
-        </p>
         <p className="col-span-2 flex flex-row items-center truncate font-semibold text-gold/90 px-1">
           {guildMember.isGuildMaster && <Crown className="w-6 fill-gold" />}
           <span className="truncate">{guildMember.name}</span>
         </p>
-        <p className="col-span-2 font-medium text-amber-200/90 px-1">{currencyIntlFormat(guildMember.points)}</p>
-        <p className="col-span-1 font-medium px-1">{guildMember.age}</p>
       </div>
 
       <div className="flex justify-center">

client/apps/game/src/ui/components/worldmap/guilds/guild-members.tsx

@@ -1,14 +1,13 @@
 import { ReactComponent as Pen } from "@/assets/icons/common/pen.svg";
-import { useUIStore } from "@/hooks/store/use-ui-store";
 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, PlayerInfo } from "@bibliothecadao/eternum";
-import { useDojo, useGuilds } from "@bibliothecadao/react";
-import { useCallback, useState } from "react";
+import { ContractAddress, getGuild, getGuildFromPlayerAddress, ID, PlayerInfo } from "@bibliothecadao/eternum";
+import { useDojo, useGuildMembers, useGuildWhitelist, usePlayerWhitelist } from "@bibliothecadao/react";
+import { useCallback, useMemo, useState } from "react";
 import { env } from "../../../../../env";
 
 interface GuildMembersProps {
@@ -29,20 +28,17 @@ export const GuildMembers = ({ players, selectedGuildEntityId, viewPlayerInfo, s
     account: { account },
   } = useDojo();
 
-  const { useGuildMembers, getGuildFromPlayerAddress, useGuildWhitelist, usePlayerWhitelist, getGuildFromEntityId } =
-    useGuilds();
-
-  const nextBlockTimestamp = useUIStore.getState().nextBlockTimestamp;
-
-  const { guildMembers } = useGuildMembers(selectedGuildEntityId, players, nextBlockTimestamp || 0);
-  const invitedPlayers = useGuildWhitelist(selectedGuildEntityId, players);
+  const guildMembers = useGuildMembers(selectedGuildEntityId);
+  const invitedPlayers = useGuildWhitelist(selectedGuildEntityId);
   const userWhitelist = usePlayerWhitelist(ContractAddress(account.address));
-  const userGuild = getGuildFromPlayerAddress(ContractAddress(account.address));
-  const selectedGuild = getGuildFromEntityId(
-    selectedGuildEntityId,
-    ContractAddress(account.address),
-    components,
-    nextBlockTimestamp || 0,
+  const userGuild = useMemo(
+    () => getGuildFromPlayerAddress(ContractAddress(account.address), components),
+    [account.address, components],
+  );
+
+  const selectedGuild = useMemo(
+    () => getGuild(selectedGuildEntityId, ContractAddress(account.address), components),
+    [selectedGuildEntityId, account.address, components],
   );
 
   const playerName = players.find((player) => player.address === ContractAddress(account?.address))?.name;
@@ -53,7 +49,7 @@ export const GuildMembers = ({ players, selectedGuildEntityId, viewPlayerInfo, s
   const [viewGuildInvites, setViewGuildInvites] = useState(false);
 
   const userIsGuildMaster = userGuild?.isOwner ? userGuild.entityId === selectedGuildEntityId : false;
-  const userIsInvited = userWhitelist.find((list) => list.guildEntityId === selectedGuildEntityId);
+  const userIsInvited = userWhitelist.find((list) => list.entityId === selectedGuildEntityId);
 
   const removeGuildMember = useCallback((address: ContractAddress) => {
     setIsLoading(true);
@@ -181,7 +177,7 @@ export const GuildMembers = ({ players, selectedGuildEntityId, viewPlayerInfo, s
             {userGuild.isOwner ? "Disband Tribe" : "Leave Tribe"}
           </Button>
         )}
-        {!userGuild?.entityId && (!selectedGuild?.guild.isPublic ? userIsInvited : true) && (
+        {!userGuild?.entityId && (!selectedGuild?.isPublic ? userIsInvited : true) && (
           <Button
             className="w-full"
             isLoading={isLoading}

client/apps/game/src/ui/components/worldmap/guilds/guilds.tsx

@@ -1,13 +1,18 @@
-import { useUIStore } from "@/hooks/store/use-ui-store";
 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/sort-button";
 import TextInput from "@/ui/elements/text-input";
 import { sortItems } from "@/ui/utils/utils";
-import { calculateGuildLordsPrize, ContractAddress, ID, PlayerInfo } from "@bibliothecadao/eternum";
-import { useDojo, useGuilds } from "@bibliothecadao/react";
+import {
+  calculateGuildLordsPrize,
+  ContractAddress,
+  getGuildFromPlayerAddress,
+  ID,
+  PlayerInfo,
+} from "@bibliothecadao/eternum";
+import { useDojo, useGuilds, usePlayerWhitelist } from "@bibliothecadao/react";
 import { ChevronRight } from "lucide-react";
 import { useMemo, useState } from "react";
 
@@ -20,18 +25,18 @@ export const Guilds = ({
 }) => {
   const {
     setup: {
+      components,
       systemCalls: { create_guild },
     },
     account: { account },
   } = useDojo();
 
-  const nextBlockTimestamp = useUIStore.getState().nextBlockTimestamp;
-
-  const { useGuildQuery, getGuildFromPlayerAddress, usePlayerWhitelist } = useGuilds();
-
-  const { guilds } = useGuildQuery(nextBlockTimestamp || 0);
+  const guilds = useGuilds();
   const guildInvites = usePlayerWhitelist(ContractAddress(account.address));
-  const playerGuild = getGuildFromPlayerAddress(ContractAddress(account.address));
+  const playerGuild = useMemo(
+    () => getGuildFromPlayerAddress(ContractAddress(account.address), components),
+    [account.address, components],
+  );
 
   const showGuildButton = playerGuild?.entityId;
 
@@ -60,7 +65,7 @@ export const Guilds = ({
     >();
 
     players.forEach((player) => {
-      const guild = getGuildFromPlayerAddress(player.address);
+      const guild = getGuildFromPlayerAddress(player.address, components);
       if (guild) {
         const stats = guildStats.get(guild.entityId.toString()) || {
           totalPoints: 0,
@@ -115,7 +120,7 @@ export const Guilds = ({
         guildsWithStats.filter((guild) => {
           const nameMatch = guild.name.toLowerCase().startsWith(guildSearchTerm.toLowerCase());
           if (viewGuildInvites) {
-            return nameMatch && guildInvites.some((invite) => invite.guildEntityId === guild.entityId);
+            return nameMatch && guildInvites.some((invite) => invite.entityId === guild.entityId);
           }
           return nameMatch;
         }),

client/apps/game/src/ui/components/worldmap/players/players-panel.tsx

@@ -2,8 +2,14 @@ import { PlayerCustom, PlayerList } from "@/ui/components/worldmap/players/playe
 import Button from "@/ui/elements/button";
 import TextInput from "@/ui/elements/text-input";
 import { getEntityIdFromKeys, normalizeDiacriticalMarks } from "@/ui/utils/utils";
-import { ContractAddress, getEntityName, PlayerInfo, toHexString } from "@bibliothecadao/eternum";
-import { useDojo, useGuilds } from "@bibliothecadao/react";
+import {
+  ContractAddress,
+  getEntityName,
+  getGuildFromPlayerAddress,
+  PlayerInfo,
+  toHexString,
+} from "@bibliothecadao/eternum";
+import { useDojo } from "@bibliothecadao/react";
 import { getComponentValue, Has, HasValue, runQuery } from "@dojoengine/recs";
 import { KeyboardEvent, useMemo, useState } from "react";
 
@@ -24,8 +30,7 @@ export const PlayersPanel = ({
 
   const { Structure, Owner, GuildWhitelist } = components;
 
-  const { getGuildFromPlayerAddress } = useGuilds();
-  const userGuild = getGuildFromPlayerAddress(ContractAddress(account.address));
+  const userGuild = getGuildFromPlayerAddress(ContractAddress(account.address), components);
 
   const [isLoading, setIsLoading] = useState(false);
   const [inputValue, setInputValue] = useState("");
@@ -50,7 +55,7 @@ export const PlayersPanel = ({
         })
         .filter((structure): structure is string => structure !== undefined);
 
-      const guild = getGuildFromPlayerAddress(player.address);
+      const guild = getGuildFromPlayerAddress(player.address, components);
 
       let isInvited = false;
       if (userGuild) {