From 43b2d043982cb27c28a505220277eaeab950cae3 Mon Sep 17 00:00:00 2001 From: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> Date: Wed, 11 Sep 2024 14:45:13 +0600 Subject: [PATCH 1/5] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=F0=9F=93=95actual=20r?= =?UTF-8?q?ank=20added=20instead=20of=20index,=20sorting=20added?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/AllValidators.jsx | 58 ++++++++++-- components/DelegatedValidators.jsx | 13 ++- pages/stake.jsx | 142 +++++++++++++++++++++-------- 3 files changed, 160 insertions(+), 53 deletions(-) diff --git a/components/AllValidators.jsx b/components/AllValidators.jsx index f92eb614..b6e413c8 100644 --- a/components/AllValidators.jsx +++ b/components/AllValidators.jsx @@ -14,31 +14,69 @@ const AllValidators = ({ stakeDispatch, totalTokens, delegatedValidators, + sortParam = "tokens", }) => { const { allValidatorsBonded, - isLoadingValidatorsBonded, - errorValidatorsBonded, + // isLoadingValidatorsBonded, + // errorValidatorsBonded, } = useAllValidatorsBonded(); const { allValidatorsUnbonded, - isLoadingValidatorsUnbonded, - errorValidatorsUnbonded, + // isLoadingValidatorsUnbonded, + // errorValidatorsUnbonded, } = useAllValidatorsUnbonded(); // controller for onError + const allValidatorsBondedUsable = allValidatorsBonded.map((el, index) => ({ + ...el, + rank: index + 1, + })); + const allValidatorsBondedUsableSorted = (sortBy) => { + let ascending = true; + let sortStr = `${sortBy}`; + if (sortBy[0] === "-") { + ascending = false; + let temp = sortBy.split(""); + sortStr = ""; + for (let i = 1; i < temp.length; i++) sortStr += temp[i]; + } + + switch (sortStr) { + case "name": + return allValidatorsBondedUsable?.sort((a, b) => { + let av = a?.description?.moniker.trim(); + let bv = b?.description?.moniker.trim(); + return ascending ? av?.localeCompare(bv) : bv?.localeCompare(av); + }); + case "commission": + return allValidatorsBondedUsable?.sort((a, b) => { + let av = + !isNaN(a?.commission?.commissionRates?.rate) && + Number(a?.commission?.commissionRates?.rate); + let bv = + !isNaN(b?.commission?.commissionRates?.rate) && + Number(b?.commission?.commissionRates?.rate); + return ascending ? av - bv : bv - av; + }); + case "tokens": + default: + return allValidatorsBondedUsable?.sort((a, b) => + ascending ? b?.tokens - a?.tokens : a?.tokens - b?.tokens + ); + } + }; + const handleOnError = (e) => { e.preventDefault(); - // console.log("e: ", e); e.target.src = "/validatorAvatars/alt.png"; }; - const statusArray = [0, 1, 2, -1]; + // const statusArray = [0, 1, 2, -1]; return ( <> {activeValidators - ? allValidatorsBonded - ?.sort((a, b) => b.tokens - a.tokens) + ? allValidatorsBondedUsableSorted(sortParam) ?.filter((item) => item?.description?.moniker .toLowerCase() @@ -68,7 +106,7 @@ const AllValidators = ({ }} > - {index < 10 ? ( + {item?.rank <= 10 ? ( )} - {activeValidators ? {index + 1} : null} + {activeValidators ? {item?.rank} : null}
{ const { allValidatorsBonded, - isLoadingValidatorsBonded, - errorValidatorsBonded, + // isLoadingValidatorsBonded, + // errorValidatorsBonded, } = useAllValidatorsBonded(); const { allValidatorsUnbonded, - isLoadingValidatorsUnbonded, - errorValidatorsUnbonded, + // isLoadingValidatorsUnbonded, + // errorValidatorsUnbonded, } = useAllValidatorsUnbonded(); // controller for onError const handleOnError = (e) => { e.preventDefault(); - // console.log("e: ", e); e.target.src = "/validatorAvatars/alt.png"; }; - const statusArray = [0, 1, 2, -1]; + // const statusArray = [0, 1, 2, -1]; return ( <> @@ -73,7 +72,7 @@ const DelegatedValidators = ({ }} > - {activeValidators ? {index + 1} : null} + {activeValidators ? {item?.rank} : null}
b.tokens - a.tokens); + let validatorsArray = allValidators + .sort((a, b) => b.tokens - a.tokens) + .map((el, index) => ({ ...el, rank: index + 1 })); + + const rankedDelegatedValidators = delegatedValidators?.map((el) => { + for (let item of validatorsArray) { + if (el?.description?.moniker === item?.description?.moniker) + return { ...el, rank: item?.rank }; + } + }); //Calculate total tokens to calculate voting power const totalTokens = validatorsArray.reduce( @@ -60,30 +70,46 @@ export default function Stake() { }; // transaction manifest modal states and functions - const GasOptions = [ - { - name: "Zero", - usd: "0.0000", - mntl: "0.0000", - }, - { - name: "Low", - usd: "0.0000", - mntl: "0.0000", - }, - { - name: "High", - usd: "0.0000", - mntl: "0.0000", - }, - ]; - const [SelectedGasFee, setSelectedGasFee] = useState(GasOptions[0].name); - const [ManifestShowAdvanced, setManifestShowAdvanced] = useState(false); - const [ManifestKeystorePassword, setManifestKeystorePassword] = useState(); - const [ManifestCustomGas, setManifestCustomGas] = useState(); - const handleManifestConfirm = () => { - console.log("Confirming transaction manifest"); - }; + // const GasOptions = [ + // { + // name: "Zero", + // usd: "0.0000", + // mntl: "0.0000", + // }, + // { + // name: "Low", + // usd: "0.0000", + // mntl: "0.0000", + // }, + // { + // name: "High", + // usd: "0.0000", + // mntl: "0.0000", + // }, + // ]; + // const [SelectedGasFee, setSelectedGasFee] = useState(GasOptions[0].name); + // const [ManifestShowAdvanced, setManifestShowAdvanced] = useState(false); + // const [ManifestKeystorePassword, setManifestKeystorePassword] = useState(); + // const [ManifestCustomGas, setManifestCustomGas] = useState(); + // const handleManifestConfirm = () => { + // console.log("Confirming transaction manifest"); + // }; + + const THRank = ( + + SortTableByField === "tokens" + ? setSortTableByField("-tokens") + : setSortTableByField("tokens") + } + > + Rank + + ); return ( <> @@ -187,18 +213,14 @@ export default function Stake() { {activeValidators ? ( delegated ? ( - - Rank - + THRank ) : ( <> - - Rank - + {THRank} ) ) : delegated ? null : ( @@ -208,21 +230,68 @@ export default function Stake() { colSpan="2" scope="col" style={{ whiteSpace: "nowrap", marginRight: "20px" }} + role="button" + tabIndex={0} + onClick={() => + SortTableByField === "name" + ? setSortTableByField("-name") + : setSortTableByField("name") + } > Validator Name - + + SortTableByField === "tokens" + ? setSortTableByField("-tokens") + : setSortTableByField("tokens") + } + > Voting Power - + + SortTableByField === "commission" + ? setSortTableByField("-commission") + : setSortTableByField("commission") + } + > Commission {delegated ? null : ( - + + SortTableByField === "tokens" + ? setSortTableByField("-tokens") + : setSortTableByField("tokens") + } + > Delegations )} - + + // SortTableByField === "delegatedAmount" + // ? setSortTableByField("-delegatedAmount") + // : setSortTableByField("delegatedAmount") + // } + > Delegated Amount {activeValidators ? null : ( @@ -235,7 +304,7 @@ export default function Stake() { {delegated ? ( ) )} From c602a13824f6d43ececa7a3bf9fb99e66a7ae5d8 Mon Sep 17 00:00:00 2001 From: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> Date: Thu, 12 Sep 2024 19:15:29 +0600 Subject: [PATCH 2/5] Update stake.jsx Signed-off-by: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> --- pages/stake.jsx | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/pages/stake.jsx b/pages/stake.jsx index e7a5ff1e..5a9b741b 100644 --- a/pages/stake.jsx +++ b/pages/stake.jsx @@ -284,13 +284,13 @@ export default function Stake() { - // SortTableByField === "delegatedAmount" - // ? setSortTableByField("-delegatedAmount") - // : setSortTableByField("delegatedAmount") - // } + role="button" + tabIndex={0} + onClick={() => + SortTableByField === "delegatedAmount" + ? setSortTableByField("-delegatedAmount") + : setSortTableByField("delegatedAmount") + } > Delegated Amount @@ -311,6 +311,7 @@ export default function Stake() { stakeState={stakeState} activeValidators={activeValidators} totalTokens={totalTokens} + sortParam={SortTableByField} /> ) : ( allValidators.length !== 1 && From a1609134b1a532024695ccfeff75dc515b901a4b Mon Sep 17 00:00:00 2001 From: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> Date: Fri, 13 Sep 2024 14:45:39 +0600 Subject: [PATCH 3/5] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8Fsorting=20added?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/stake.jsx | 119 ++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 109 insertions(+), 10 deletions(-) diff --git a/pages/stake.jsx b/pages/stake.jsx index 5a9b741b..27daafc3 100644 --- a/pages/stake.jsx +++ b/pages/stake.jsx @@ -107,7 +107,19 @@ export default function Stake() { : setSortTableByField("tokens") } > - Rank + Rank{" "} + {(activeValidators || (activeValidators && delegated)) && ( + + {SortTableByField === "tokens" ? ( + + ) : ( + + )} + + )} ); @@ -238,7 +250,24 @@ export default function Stake() { : setSortTableByField("name") } > - Validator Name + Validator Name{" "} + {(activeValidators || + (activeValidators && delegated)) && ( + + {SortTableByField === "name" ? ( + + ) : ( + + )} + + )} - Voting Power + Voting Power{" "} + {(activeValidators || + (activeValidators && delegated)) && ( + + {SortTableByField === "tokens" ? ( + + ) : ( + + )} + + )} - Commission + Commission{" "} + {(activeValidators || + (activeValidators && delegated)) && ( + + {SortTableByField === "commission" ? ( + + ) : ( + + )} + + )} {delegated ? null : ( - Delegations + Delegations{" "} + {(activeValidators || + (activeValidators && delegated)) && ( + + {SortTableByField === "tokens" ? ( + + ) : ( + + )} + + )} )} - SortTableByField === "delegatedAmount" - ? setSortTableByField("-delegatedAmount") - : setSortTableByField("delegatedAmount") - } + SortTableByField === "delegatedAmount" + ? setSortTableByField("-delegatedAmount") + : setSortTableByField("delegatedAmount") + } > - Delegated Amount + Delegated Amount{" "} + {(activeValidators || + (activeValidators && delegated)) && ( + + {SortTableByField === "delegatedAmount" ? ( + + ) : ( + + )} + + )} {activeValidators ? null : ( From 8bb55bcb68b488a10cae410b0040f15c628fb6c3 Mon Sep 17 00:00:00 2001 From: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> Date: Fri, 13 Sep 2024 14:45:57 +0600 Subject: [PATCH 4/5] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8Fdelegated=20amount=20s?= =?UTF-8?q?orting=20added?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/AllValidators.jsx | 24 ++++++++++++++---------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/components/AllValidators.jsx b/components/AllValidators.jsx index b6e413c8..d55dc185 100644 --- a/components/AllValidators.jsx +++ b/components/AllValidators.jsx @@ -30,7 +30,11 @@ const AllValidators = ({ const allValidatorsBondedUsable = allValidatorsBonded.map((el, index) => ({ ...el, rank: index + 1, + am_delegatedAmount: delegatedValidators?.find( + (element) => element?.operatorAddress == el?.operatorAddress + )?.delegatedAmount, })); + const allValidatorsBondedUsableSorted = (sortBy) => { let ascending = true; let sortStr = `${sortBy}`; @@ -58,6 +62,14 @@ const AllValidators = ({ Number(b?.commission?.commissionRates?.rate); return ascending ? av - bv : bv - av; }); + case "delegatedAmount": + return allValidatorsBondedUsable?.sort((a, b) => { + let av = + !isNaN(a?.am_delegatedAmount) && Number(a?.am_delegatedAmount); + let bv = + !isNaN(b?.am_delegatedAmount) && Number(b?.am_delegatedAmount); + return ascending ? av - bv : bv - av; + }); case "tokens": default: return allValidatorsBondedUsable?.sort((a, b) => @@ -163,17 +175,9 @@ const AllValidators = ({ )} - {delegatedValidators?.find( - (element) => - element?.operatorAddress == item?.operatorAddress - ) + {item?.am_delegatedAmount ? getBalanceStyle( - fromChainDenom( - delegatedValidators?.find( - (element) => - element?.operatorAddress == item?.operatorAddress - )?.delegatedAmount - ), + fromChainDenom(item?.am_delegatedAmount), "caption2 text-white-300", "small text-white-300" ) From 7b19fedd2119c7a3613e5afadfc056aede144dae Mon Sep 17 00:00:00 2001 From: Akhlak Hossain Jim <73884856+Akhlak-Hossain-Jim@users.noreply.github.com> Date: Fri, 13 Sep 2024 14:46:12 +0600 Subject: [PATCH 5/5] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8Famount=20sorting=20add?= =?UTF-8?q?ed?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/DelegatedValidators.jsx | 215 +++++++++++++++++------------ 1 file changed, 130 insertions(+), 85 deletions(-) diff --git a/components/DelegatedValidators.jsx b/components/DelegatedValidators.jsx index 3365abfa..ec2eb46b 100644 --- a/components/DelegatedValidators.jsx +++ b/components/DelegatedValidators.jsx @@ -15,6 +15,7 @@ const DelegatedValidators = ({ stakeDispatch, setShowClaimError, delegatedValidators, + sortParam, }) => { const { allValidatorsBonded, @@ -32,97 +33,142 @@ const DelegatedValidators = ({ e.target.src = "/validatorAvatars/alt.png"; }; + const allDelegatedValidatorFiltered = delegatedValidators + ?.sort((a, b) => b.tokens - a.tokens) + ?.filter( + (item) => + allValidatorsBonded?.find( + (e) => item?.operatorAddress == e?.operatorAddress + ) && + item?.description?.moniker + ?.toLowerCase() + ?.includes(searchValue.toLowerCase()) + ); + + const allDelegatedValidatorUsable = allDelegatedValidatorFiltered?.map( + (el) => ({ + ...el, + am_delegatedAmount: delegatedValidators?.find( + (element) => element?.operatorAddress == el?.operatorAddress + )?.delegatedAmount, + }) + ); + + const allDelegatedValidatorsUsableSorted = (sortBy) => { + let ascending = true; + let sortStr = `${sortBy}`; + if (sortBy[0] === "-") { + ascending = false; + let temp = sortBy.split(""); + sortStr = ""; + for (let i = 1; i < temp.length; i++) sortStr += temp[i]; + } + + switch (sortStr) { + case "name": + return allDelegatedValidatorUsable?.sort((a, b) => { + let av = a?.description?.moniker.trim(); + let bv = b?.description?.moniker.trim(); + return ascending ? av?.localeCompare(bv) : bv?.localeCompare(av); + }); + case "commission": + return allDelegatedValidatorUsable?.sort((a, b) => { + let av = + !isNaN(a?.commission?.commissionRates?.rate) && + Number(a?.commission?.commissionRates?.rate); + let bv = + !isNaN(b?.commission?.commissionRates?.rate) && + Number(b?.commission?.commissionRates?.rate); + return ascending ? av - bv : bv - av; + }); + case "delegatedAmount": + return allDelegatedValidatorUsable?.sort((a, b) => { + let av = + !isNaN(a?.am_delegatedAmount) && Number(a?.am_delegatedAmount); + let bv = + !isNaN(b?.am_delegatedAmount) && Number(b?.am_delegatedAmount); + return ascending ? av - bv : bv - av; + }); + case "tokens": + default: + return allDelegatedValidatorUsable?.sort((a, b) => + ascending ? b?.tokens - a?.tokens : a?.tokens - b?.tokens + ); + } + }; + // const statusArray = [0, 1, 2, -1]; return ( <> {activeValidators - ? delegatedValidators - ?.sort((a, b) => b.tokens - a.tokens) - ?.filter( - (item) => - allValidatorsBonded?.find( - (e) => item?.operatorAddress == e?.operatorAddress - ) && - item?.description?.moniker - ?.toLowerCase() - ?.includes(searchValue.toLowerCase()) - ) - ?.map((item, index) => ( - - - ( + + + { + setShowClaimError(false); + stakeState?.selectedValidators?.includes( item?.operatorAddress - )} - onChange={() => { - setShowClaimError(false); - stakeState?.selectedValidators?.includes( - item?.operatorAddress - ) - ? stakeDispatch({ - type: "REMOVE_FROM_SELECTED_VALIDATORS", - payload: item?.operatorAddress, - }) - : stakeDispatch({ - type: "SET_SELECTED_VALIDATORS", - payload: item?.operatorAddress, - }); - }} - > - - {activeValidators ? {item?.rank} : null} - -
- {item?.description?.moniker} -
- - - - {" "} - {item?.description?.moniker}{" "} - - - - {((item?.tokens * 100) / totalTokens).toFixed(2)}% - - - {shiftDecimalPlaces( - item?.commission?.commissionRates?.rate, - 2 - )}{" "} - % - - + ) + ? stakeDispatch({ + type: "REMOVE_FROM_SELECTED_VALIDATORS", + payload: item?.operatorAddress, + }) + : stakeDispatch({ + type: "SET_SELECTED_VALIDATORS", + payload: item?.operatorAddress, + }); + }} + > + + {activeValidators ? {item?.rank} : null} + +
+ {item?.description?.moniker} +
+ + + {" "} - {getBalanceStyle( - fromChainDenom( - delegatedValidators?.find( - (element) => - element?.operatorAddress == item?.operatorAddress - )?.delegatedAmount - ), - "caption2 text-white-300", - "small text-white-300" - ) || "-"} - - - )) + {item?.description?.moniker}{" "} + + + + {((item?.tokens * 100) / totalTokens).toFixed(2)}% + + + {shiftDecimalPlaces(item?.commission?.commissionRates?.rate, 2)}{" "} + % + + + {" "} + {getBalanceStyle( + fromChainDenom(item?.am_delegatedAmount), + "caption2 text-white-300", + "small text-white-300" + ) || "-"} + + + )) : delegatedValidators ?.filter( (item) => @@ -133,7 +179,6 @@ const DelegatedValidators = ({ ?.toLowerCase() ?.includes(searchValue.toLowerCase()) ) - ?.map((item, index) => (