rafactor: modify members as prop, #5271

opensquare-network · Jan 20, 2025 · e010c7d · e010c7d
1 parent 5418010
commit e010c7d
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 34 deletions.
diff --git a/packages/next-common/components/fellowshipMemberSelector/index.jsx b/packages/next-common/components/fellowshipMemberSelector/index.jsx
@@ -1,5 +1,4 @@
 import { useEffect, useMemo, useRef, useState } from "react";
-import useFellowshipCoreMembers from "next-common/hooks/fellowship/core/useFellowshipCoreMembers";
 import { isAddress, isEthereumAddress } from "@polkadot/util-crypto";
 import Caret from "../icons/caret";
 import { cn } from "next-common/utils";
@@ -18,13 +17,13 @@ function SelectHeader({
   setInputAddress,
   onBlur,
   placeholder,
-  accounts,
+  members,
   address,
   edit,
 }) {
   const selectedAccount = useMemo(
-    () => accounts.find((item) => normalizeAddress(item.address) === address),
-    [accounts, address],
+    () => members.find((item) => normalizeAddress(item.address) === address),
+    [members, address],
   );
 
   if (edit) {
@@ -50,10 +49,10 @@ function SelectHeader({
   return <AddressComboCustomAddress address={address} />;
 }
 
-function SelectOptions({ accounts, address, onSelect }) {
+function SelectOptions({ members, address, onSelect }) {
   return (
     <div className="absolute w-full mt-1 bg-neutral100 shadow-200 border border-neutral300 rounded-md max-h-80 overflow-y-auto z-10 py-2">
-      {accounts.map((item) => (
+      {members.map((item) => (
         <div
           key={item.address}
           className={cn(
@@ -78,22 +77,9 @@ export default function FellowshipMemberSelector({
   address,
   setAddress,
   setIsAvailableMember,
-  type,
+  members,
   placeholder = "Please fill the address or select another one...",
 }) {
-  const { members, loading } = useFellowshipCoreMembers();
-
-  const accounts = useMemo(() => {
-    if (loading || !members) {
-      return [];
-    }
-
-    const filterCondition = (m) =>
-      type === "toRank" ? m.rank >= 0 && m.rank < 6 : m.rank > 0 && m.rank <= 6;
-
-    return members.filter(filterCondition).sort((a, b) => b.rank - a.rank);
-  }, [members, loading, type]);
-
   const [show, setShow] = useState(false);
   const [inputAddress, setInputAddress] = useState(
     () => tryConvertToEvmAddress(address) || "",
@@ -113,8 +99,8 @@ export default function FellowshipMemberSelector({
   const [edit, setEdit] = useState(!isValidAddress);
 
   const isFellowshipMember = useMemo(
-    () => isFellowshipMemberAddress(accounts, address),
-    [accounts, address],
+    () => isFellowshipMemberAddress(members, address),
+    [members, address],
   );
 
   useEffect(() => {
@@ -160,11 +146,11 @@ export default function FellowshipMemberSelector({
           setInputAddress={setInputAddress}
           onBlur={onBlur}
           placeholder={placeholder}
-          accounts={accounts}
+          members={members}
           address={address}
           edit={edit}
         />
-        {accounts.length > 0 && (
+        {members.length > 0 && (
           <span
             onClick={(e) => {
               setShow((prevShow) => !prevShow);
@@ -175,9 +161,9 @@ export default function FellowshipMemberSelector({
           </span>
         )}
       </div>
-      {show && accounts.length > 0 && (
+      {show && members.length > 0 && (
         <SelectOptions
-          accounts={accounts}
+          members={members}
           address={address}
           onSelect={onSelect}
         />

diff --git a/packages/next-common/components/popup/fields/fellowshipMemberFiled.jsx b/packages/next-common/components/popup/fields/fellowshipMemberFiled.jsx
@@ -7,7 +7,8 @@ export default function FellowshipMemberFiled({
   defaultAddress,
   setAddress,
   setIsAvailableMember,
-  type,
+  loading,
+  members,
 }) {
   const [targetAddress, setTargetAddress] = useState(defaultAddress);
 
@@ -22,7 +23,8 @@ export default function FellowshipMemberFiled({
         address={targetAddress}
         setAddress={setTargetAddress}
         setIsAvailableMember={setIsAvailableMember}
-        type={type}
+        members={members}
+        loading={loading}
       />
     </div>
   );

diff --git a/...s/next-common/components/preImages/createPreimagePopup/fields/useFellowshipMemberFiled.js b/...s/next-common/components/preImages/createPreimagePopup/fields/useFellowshipMemberFiled.js
@@ -4,7 +4,8 @@ import FellowshipMemberFiled from "next-common/components/popup/fields/fellowshi
 export default function useFellowshipMemberFiled({
   title = "Who",
   defaultAddress = "",
-  type = "toRank",
+  loading,
+  members,
 } = {}) {
   const [beneficiary, setBeneficiary] = useState(defaultAddress);
   const [isAvailableMember, setIsAvailableMember] = useState(true);
@@ -15,7 +16,8 @@ export default function useFellowshipMemberFiled({
     component: (
       <FellowshipMemberFiled
         title={title}
-        type={type}
+        members={members}
+        loading={loading}
         setAddress={setBeneficiary}
         setIsAvailableMember={setIsAvailableMember}
         defaultAddress={defaultAddress}

diff --git a/...kStart/createFellowshipCoreMemberProposalPopup/createFellowshipCoreMemberPromotePopup.jsx b/...kStart/createFellowshipCoreMemberProposalPopup/createFellowshipCoreMemberPromotePopup.jsx
@@ -1,3 +1,4 @@
+import { useMemo } from "react";
 import RankField from "next-common/components/popup/fields/rankField";
 import Popup from "next-common/components/popup/wrapper/Popup";
 import { usePopupParams } from "next-common/components/popupWithSigner/context";
@@ -13,6 +14,7 @@ import { ReferendaWarningMessage } from "./common";
 import WarningInfoPanel from "next-common/components/summary/styled/warningInfoPanel";
 import useFellowshipCoreMembers from "next-common/hooks/fellowship/core/useFellowshipCoreMembers";
 import { find } from "lodash-es";
+import { CollectivesPromoteTracks } from "next-common/components/fellowship/core/members/actions/promote/constants";
 
 export function NotAvailableMemberPrompt() {
   return (
@@ -24,15 +26,29 @@ export function NotAvailableMemberPrompt() {
 }
 
 function NewFellowshipCoreMemberPromoteReferendumInnerPopupImpl() {
-  const { members } = useFellowshipCoreMembers();
+  const { members, loading } = useFellowshipCoreMembers();
+  const filteredMembers = useMemo(() => {
+    if (loading || !members) {
+      return [];
+    }
+
+    return members
+      .filter(
+        (member) =>
+          member.rank < 6 && CollectivesPromoteTracks[member.rank + 1],
+      )
+      .sort((a, b) => b.rank - a.rank);
+  }, [members, loading]);
+
   const { onClose } = usePopupParams();
   const {
     value: who,
     isAvailableMember,
     component: whoField,
   } = useFellowshipMemberFiled({
     title: "Who",
-    type: "toRank",
+    members: filteredMembers,
+    loading,
   });
   const { value: enactment, component: enactmentField } =
     useEnactmentBlocksField();

diff --git a/...ckStart/createFellowshipCoreMemberProposalPopup/createFellowshipCoreMemberRetainPopup.jsx b/...ckStart/createFellowshipCoreMemberProposalPopup/createFellowshipCoreMemberRetainPopup.jsx
@@ -1,3 +1,4 @@
+import { useMemo } from "react";
 import RankField from "next-common/components/popup/fields/rankField";
 import Popup from "next-common/components/popup/wrapper/Popup";
 import { usePopupParams } from "next-common/components/popupWithSigner/context";
@@ -13,9 +14,21 @@ import { useReferendaFellowshipPallet } from "next-common/context/collectives/co
 import useRelatedRetentionReferenda from "next-common/hooks/fellowship/useRelatedRetentionReferenda";
 import { ReferendaWarningMessage } from "./common";
 import { NotAvailableMemberPrompt } from "./createFellowshipCoreMemberPromotePopup";
+import { CollectivesRetainTracks } from "next-common/components/fellowship/core/members/actions/approve/constants";
 
 function NewFellowshipCoreMemberRetainReferendumInnerPopupImpl() {
-  const { members } = useFellowshipCoreMembers();
+  const { members, loading } = useFellowshipCoreMembers();
+  const filteredMembers = useMemo(() => {
+    if (loading || !members) {
+      return [];
+    }
+
+    return members
+      .filter(
+        (member) => member.rank > 0 && CollectivesRetainTracks[member.rank],
+      )
+      .sort((a, b) => b.rank - a.rank);
+  }, [members, loading]);
 
   const { onClose } = usePopupParams();
   const {
@@ -24,7 +37,8 @@ function NewFellowshipCoreMemberRetainReferendumInnerPopupImpl() {
     component: whoField,
   } = useFellowshipMemberFiled({
     title: "Who",
-    type: "atRank",
+    members: filteredMembers,
+    loading,
   });
   const { value: enactment, component: enactmentField } =
     useEnactmentBlocksField();