diff --git a/site/src/components/TreasurySpendsFilter/index.jsx b/site/src/components/TreasurySpendsFilter/index.jsx index 80ae1d38d..135ddff8f 100644 --- a/site/src/components/TreasurySpendsFilter/index.jsx +++ b/site/src/components/TreasurySpendsFilter/index.jsx @@ -2,7 +2,7 @@ import styled from "styled-components"; import { StatusSelect, FormWrapper, Divider } from "../../components/Filter"; import Range, { RangeTypes } from "../../components/Filter/Range"; import Select from "../../components/Select"; -import { treasurySpendsAssetsFilterOptions } from "../../constants"; +import { useTreasurySpendAssetsFilterOptions } from "../../hooks/useTreasurySpendsAssetsFilterOptions"; const AssetsSelect = styled(Select)` width: 160px; @@ -23,6 +23,9 @@ export default function TreasurySpendsFilter({ setMax, statusMap, }) { + const treasurySpendAssetsFilterOptions = + useTreasurySpendAssetsFilterOptions(); + const statusOptions = [ { key: "all", value: "-1", text: "All status" }, ...Array.from(new Set(Object.values(statusMap))).map((key) => ({ @@ -49,7 +52,7 @@ export default function TreasurySpendsFilter({ { setAsset(value); diff --git a/site/src/constants/index.js b/site/src/constants/index.js index 4218017d4..4e942901a 100644 --- a/site/src/constants/index.js +++ b/site/src/constants/index.js @@ -100,14 +100,19 @@ export const treasurySpendStatusMap = { Voided: "Voided", }; -export const treasurySpendsAssetsFilterOptions = [ +export const polkadotTreasurySpendsAssetsFilterOptions = [ { key: "all", value: "-1", text: "All assets" }, - { key: "dot", value: "dot", text: "DOT", asset: "native" }, + { key: "native", value: "native", text: "DOT", asset: "native" }, { key: "usdc", value: "usdc", text: USDC.name, asset: USDC.symbol }, { key: "usdt", value: "usdt", text: USDt.name, asset: USDt.symbol }, { key: "myth", value: "myth", text: MYTH.name, asset: MYTH.symbol }, ]; +export const kusamaTreasurySpendsAssetsFilterOptions = [ + { key: "all", value: "-1", text: "All assets" }, + { key: "native", value: "native", text: "KSM", asset: "native" }, +]; + export const TreasuryAccount = "F3opxRbN5ZbjJNU511Kj2TLuzFcDq9BGduA9TgiECafpg29"; diff --git a/site/src/hooks/useTreasurySpendsAssetsFilterOptions.js b/site/src/hooks/useTreasurySpendsAssetsFilterOptions.js new file mode 100644 index 000000000..4942873ce --- /dev/null +++ b/site/src/hooks/useTreasurySpendsAssetsFilterOptions.js @@ -0,0 +1,13 @@ +import { useSelector } from "react-redux"; +import { chainSelector } from "../store/reducers/chainSlice"; +import { + polkadotTreasurySpendsAssetsFilterOptions, + kusamaTreasurySpendsAssetsFilterOptions, +} from "../constants"; + +export function useTreasurySpendAssetsFilterOptions() { + const chain = useSelector(chainSelector); + return chain === "polkadot" + ? polkadotTreasurySpendsAssetsFilterOptions + : kusamaTreasurySpendsAssetsFilterOptions; +} diff --git a/site/src/pages/Header/ReferendaMenu.jsx b/site/src/pages/Header/ReferendaMenu.jsx index d310e1fc7..18a45502c 100644 --- a/site/src/pages/Header/ReferendaMenu.jsx +++ b/site/src/pages/Header/ReferendaMenu.jsx @@ -4,7 +4,7 @@ import { Label, Menu } from "semantic-ui-react"; import { useSelector } from "react-redux"; import { totalOpenGovApplicationCountSelector } from "../../store/reducers/overviewSlice"; import { ReactComponent as ApplicationSVG } from "./applications.svg"; -import { isPolkadot } from "../../utils/chains"; +import { isKusama, isPolkadot } from "../../utils/chains"; import useFetchReferendumCount from "../../hooks/applications/polkadot/useFetchReferendumCount"; const Divider = styled.div` @@ -35,7 +35,7 @@ function PolkadotReferendaMenu() { function ReferendaMenu() { const applicationCount = useSelector(totalOpenGovApplicationCountSelector); - if (isPolkadot) { + if (isPolkadot || isKusama) { return ; } diff --git a/site/src/pages/Overview/BeneficiaryTable.jsx b/site/src/pages/Overview/BeneficiaryTable.jsx index 6e613d8b1..2bdbb1340 100644 --- a/site/src/pages/Overview/BeneficiaryTable.jsx +++ b/site/src/pages/Overview/BeneficiaryTable.jsx @@ -13,7 +13,6 @@ import { NavLink } from "react-router-dom"; import TextMinor from "../../components/TextMinor"; import GrayImage from "../../components/GrayImage"; import { USER_ROLES } from "../../constants"; -import { chainSymbolSelector } from "../../store/reducers/chainSlice"; export const CardWrapper = styled(Card)` overflow-x: hidden; @@ -65,7 +64,6 @@ export const TableCell = styled(Table.Cell)` `; const BeneficiaryTable = () => { - const symbol = useSelector(chainSymbolSelector)?.toLowerCase(); const overview = useSelector(overviewSelector); const data = overview.bestProposalBeneficiaries || []; diff --git a/site/src/pages/Referenda/index.jsx b/site/src/pages/Referenda/index.jsx index 538c54c27..1a15a39e5 100644 --- a/site/src/pages/Referenda/index.jsx +++ b/site/src/pages/Referenda/index.jsx @@ -1,13 +1,13 @@ import styled from "styled-components"; import ReferendaTable from "./ReferendaTable"; import Summary from "./Summary"; -import { isPolkadot } from "../../utils/chains"; +import { isKusama, isPolkadot } from "../../utils/chains"; import PolkadotReferenda from "./polkadot"; const Wrapper = styled.div``; export default function Referenda() { - if (isPolkadot) { + if (isPolkadot || isKusama) { return ; } diff --git a/site/src/pages/Referenda/polkadot/table/columns.jsx b/site/src/pages/Referenda/polkadot/table/columns.jsx index 31de7239a..ab325d346 100644 --- a/site/src/pages/Referenda/polkadot/table/columns.jsx +++ b/site/src/pages/Referenda/polkadot/table/columns.jsx @@ -8,6 +8,8 @@ import TreasurySpendValueDisplay from "../../../../components/treasurySpendValue import styled from "styled-components"; import PairTextVertical from "../../../../components/PairTextVertical"; import startCase from "lodash.startcase"; +import { getChainSettings } from "../../../../utils/chains"; +import { toPrecision } from "../../../../utils"; const Wrapper = styled.div` width: 112px; @@ -88,6 +90,19 @@ const Columns = ({ ); } + + if (item?.onchainData?.treasuryInfo) { + const { decimals, symbol } = getChainSettings(chain); + const { amount } = item.onchainData.treasuryInfo; + return ( + + ); + } + return -; }, }; diff --git a/site/src/pages/Referenda/polkadot/table/filter.jsx b/site/src/pages/Referenda/polkadot/table/filter.jsx index 95df1cf6d..505c5fe26 100644 --- a/site/src/pages/Referenda/polkadot/table/filter.jsx +++ b/site/src/pages/Referenda/polkadot/table/filter.jsx @@ -4,9 +4,9 @@ import { StatusSelector, } from "../../../../components/OpenGovFilter"; import Select from "../../../../components/Select"; -import { treasurySpendsAssetsFilterOptions } from "../../../../constants"; import styled from "styled-components"; import { usePolkadotApplicationsTrackOptions } from "../../../../context/PolkadotApplications"; +import { useTreasurySpendAssetsFilterOptions } from "../../../../hooks/useTreasurySpendsAssetsFilterOptions"; const AssetsSelect = styled(Select)` width: 160px; @@ -49,6 +49,8 @@ function TrackSelector({ track, setTrack }) { } function AssetsSelector({ assets, setAssets }) { + const treasurySpendsAssetsFilterOptions = + useTreasurySpendAssetsFilterOptions(); return ( ))} - + View All { if (filterAssets === "-1") return true; + if (!Array.isArray(item?.allSpends) && filterAssets === "native") { + return true; + } + if (!Array.isArray(item?.allSpends)) return false; return item.allSpends.some((asset) => { diff --git a/site/src/store/reducers/treasurySpendsSlice.js b/site/src/store/reducers/treasurySpendsSlice.js index ec4d03584..d9dbd0b72 100644 --- a/site/src/store/reducers/treasurySpendsSlice.js +++ b/site/src/store/reducers/treasurySpendsSlice.js @@ -2,7 +2,10 @@ import { createSlice } from "@reduxjs/toolkit"; import api from "../../services/scanApi"; import { RangeTypes } from "../../components/Filter/Range"; import { find } from "lodash-es"; -import { treasurySpendsAssetsFilterOptions } from "../../constants"; +import { + kusamaTreasurySpendsAssetsFilterOptions, + polkadotTreasurySpendsAssetsFilterOptions, +} from "../../constants"; const name = "treasurySpends"; @@ -45,9 +48,18 @@ export const fetchTreasurySpendsList = ( filterData = {}, sort = {}, ) => { - return async (dispatch) => { + return async (dispatch, getState) => { + const { + chain: { chain }, + } = getState(); + dispatch(setLoadingTreasurySpendsList(true)); + const treasurySpendsAssetsFilterOptions = + chain === "polkadot" + ? polkadotTreasurySpendsAssetsFilterOptions + : kusamaTreasurySpendsAssetsFilterOptions; + const filterAsset = filterData?.asset; const asset = find(treasurySpendsAssetsFilterOptions, { value: filterAsset })?.asset ||