From 0476376281499d514530a8b59381ed3b1fa3088f Mon Sep 17 00:00:00 2001 From: Alexandr Date: Wed, 11 Dec 2024 22:37:27 +0300 Subject: [PATCH 1/2] add route to matrix get all regs addresses, add links to connection btns, add in matrix section --- server/server.ts | 53 ++++++++++++++++++++++++++++- server/utils/utils.ts | 1 + src/components/UI/Switch/Switch.tsx | 46 ++++++++++++------------- src/pages/aliases/index.tsx | 26 +++++++++++--- src/pages/assets/index.tsx | 11 +++--- src/utils/methods.ts | 11 ++++++ 6 files changed, 113 insertions(+), 35 deletions(-) diff --git a/server/server.ts b/server/server.ts index d309f36..9188aa7 100644 --- a/server/server.ts +++ b/server/server.ts @@ -1166,7 +1166,58 @@ const requestsLimiter = rateLimit({ } else { return res.json({ success: true, asset: dbAsset }); } - })); + }) +); + + + app.post('/api/get_assets_price_rates', exceptionHandler(async (req, res) => { + const { assetsIds } = req.body; + if (!assetsIds) { + return res.json({ success: false, data: "Asset id not provided" }); + } + const assetsPricesResponse = await axios({ + method: 'post', + url: config.trade_api_url + '/dex/get-assets-price-rates', + data: { assetsIds }, + }); + + const assetsPrices = assetsPricesResponse.data; + + if (assetsPricesResponse?.data?.success) { + return res.json({ success: true, priceRates: assetsPrices.priceRates }); + } else { + return res.json({ success: false, data: "Assets not found" }) + } + + })) + + app.get('/api/get_matrix_addresses', exceptionHandler(async (req, res) => { + const {page, items} = req.query; + + if (!page || !items) { + return res.status(200).send({ + success: false, + data: "no page or items provided" + }) + } + + const matrixAddressesResponse = await fetch(`${config.matrix_api_url}/get-registered-addresses/?page=${page}&items=${items}`) + .then(res => res.json()) + + const {addresses} = matrixAddressesResponse; + + if (matrixAddressesResponse?.success && addresses) { + return res.status(200).send({ + success: true, + addresses + }) + } else { + return res.status(200).send({ + success: false, + }) + } + })) + io.on('connection', async (socket) => { diff --git a/server/utils/utils.ts b/server/utils/utils.ts index 86c3f5d..19d61d4 100644 --- a/server/utils/utils.ts +++ b/server/utils/utils.ts @@ -15,6 +15,7 @@ export const config = { }, "enableVisibilityInfo": process.env.ENABLE_VISIBILITY_INFO === "true", "maxDaemonRequestCount": parseInt(process.env.MAX_DAEMON_REQUEST_COUNT || "", 10) || 1000, + "trade_api_url": process.env.TRADE_API_URL, "matrix_api_url": process.env.MATRIX_API_URL } diff --git a/src/components/UI/Switch/Switch.tsx b/src/components/UI/Switch/Switch.tsx index 9ac12b3..bf443ca 100644 --- a/src/components/UI/Switch/Switch.tsx +++ b/src/components/UI/Switch/Switch.tsx @@ -3,34 +3,32 @@ import styles from "./Switch.module.scss"; import { Dispatch, SetStateAction } from "react"; interface SwitchProps { - firstTitle: string; - secondTitle: string; - isFirstSelected: boolean; - setIsFirstSelected: Dispatch>; + titles: string[]; + selectedTitleIdx: number; + setSelectedTitleIdx: Dispatch>; } export default function Switch({ - firstTitle, - secondTitle, - isFirstSelected, - setIsFirstSelected + titles, + selectedTitleIdx, + setSelectedTitleIdx }: SwitchProps) { - return ( -
+ return ( +
+ {titles.map((title, idx) => { + + return ( - -
- ) + className={`${styles["switch__item"]} ${(idx === selectedTitleIdx) && styles["switch__item_selected"] }`} + onClick={() => setSelectedTitleIdx(idx)} + > +

{title}

+ + ) + + })} +
+ ) } \ No newline at end of file diff --git a/src/pages/aliases/index.tsx b/src/pages/aliases/index.tsx index c766a87..4bc04e4 100644 --- a/src/pages/aliases/index.tsx +++ b/src/pages/aliases/index.tsx @@ -30,7 +30,11 @@ function Aliases(props: AliasesPageProps) { aliasesAmount: props.aliasesAmount, premiumAliasesAmount: props.premiumAliasesAmount }); - const [isPremiumOnly, setIsPremiumOnly] = useState(false); + const [selectedTitleIdx, setSelectedTitleIdx] = useState(0); + + const isPremiumOnly = selectedTitleIdx === 0; + + const isInMatrix = selectedTitleIdx === 2; const fetchIdRef = useRef(nanoid()); @@ -54,6 +58,7 @@ function Aliases(props: AliasesPageProps) { if (result.sucess === false) return; if (!(result instanceof Array)) return; + if (isInMatrix) return; setAliases( result.map((e: any) => ({ alias: e.alias || "", @@ -63,10 +68,22 @@ function Aliases(props: AliasesPageProps) { ); }, [itemsOnPage, page, searchState, isPremiumOnly]); + const fetchMatrixAliases = useCallback(async () => { + const result = await Fetch.getMatrixAddresses(page, itemsOnPage); + if(!result.success || !(result.addresses instanceof Array)) return; + setAliases(result.addresses); + },[itemsOnPage, page]) + useEffect(() => { setPage("1"); }, [isPremiumOnly, searchState]); + useEffect(() => { + if (isInMatrix) { + fetchMatrixAliases(); + } + }, [isInMatrix, fetchMatrixAliases]) + useEffect(() => { fetchAliases(); @@ -164,10 +181,9 @@ function Aliases(props: AliasesPageProps) { }} content={ } /> diff --git a/src/pages/assets/index.tsx b/src/pages/assets/index.tsx index 5b06040..8e10b18 100644 --- a/src/pages/assets/index.tsx +++ b/src/pages/assets/index.tsx @@ -60,6 +60,8 @@ function Assets(props: AssetsPageProps) { const searchParams = useSearchParams(); const router = useRouter(); + const [selectedTitleIdx, setSelectedTitleIdx] = useState(0); + const [burgerOpened, setBurgerOpened] = useState(false); const [assets, setAssets] = useState(props.assets); @@ -72,7 +74,7 @@ function Assets(props: AssetsPageProps) { const [itemsOnPage, setItemsOnPage] = useState(DEFAULT_ASSETS_ON_PAGE); const [page, setPage] = useState("1"); - const [isWhitelist, setIsWhitelist] = useState(true); + const isWhitelist = selectedTitleIdx === 0; const [inputState, setInputState] = useState(""); const [initFetched, setInitFetched] = useState(false); @@ -234,10 +236,9 @@ function Assets(props: AssetsPageProps) { }} content={ } /> diff --git a/src/utils/methods.ts b/src/utils/methods.ts index 6a79d1e..e00dc67 100644 --- a/src/utils/methods.ts +++ b/src/utils/methods.ts @@ -102,6 +102,17 @@ class Fetch { static async getTxPoolInfo(count: number) { return await fetch(this.proxyPath + `/get_tx_pool_details/${encodeURIComponent(count)}`).then(res => res.json()); } + + static async getAssetsPriceRates(assetsIds: string[]){ + return await postFetch( + this.proxyPath + `/get_assets_price_rates`, + { assetsIds }, + ).then(res => res.json()); + } + + static async getMatrixAddresses(page: string, items:string){ + return await fetch(this.proxyPath + `/get_matrix_addresses/?page=${page}&items=${items}`,).then((res) => res.json()); + } } export default Fetch; \ No newline at end of file From 5032beabe3f8f30fe41901a7b1c8fcc01dcd9259 Mon Sep 17 00:00:00 2001 From: Alexandr Date: Wed, 11 Dec 2024 22:37:47 +0300 Subject: [PATCH 2/2] . --- src/components/default/Table/Table.tsx | 100 +++++++++++++------------ src/pages/aliases/index.tsx | 16 ++-- src/styles/Aliases.module.scss | 2 +- 3 files changed, 63 insertions(+), 55 deletions(-) diff --git a/src/components/default/Table/Table.tsx b/src/components/default/Table/Table.tsx index 312d584..4fa33dc 100644 --- a/src/components/default/Table/Table.tsx +++ b/src/components/default/Table/Table.tsx @@ -68,57 +68,59 @@ function Table(props: TableProps) { - {pagination && -
-
-

Pages:

-
- - -
- onNumberInput(e, setPage)} - /> -
- {pagesTotal &&

Pages total: {pagesTotal}

} -
-
-

Items on page:

- onNumberInput(e, setItemsOnPage, 50)} - /> -
- {!hidePaginationBlock && -
-

Go to block:

- onNumberInput(e, setGoToBlock)} - onEnterPress={goToBlockEnter} - /> -
- } -
-
- } - + ) + + function Pagination ({pagination}:{pagination:boolean | undefined}) { + if (!pagination) return null + return
+
+

Pages:

+
+ + +
+ onNumberInput(e, setPage)} + /> +
+ {pagesTotal &&

Pages total: {pagesTotal}

} +
+
+

Items on page:

+ onNumberInput(e, setItemsOnPage, 50)} + /> +
+ {!hidePaginationBlock && +
+

Go to block:

+ onNumberInput(e, setGoToBlock)} + onEnterPress={goToBlockEnter} + /> +
+ } +
+
+ } } export default Table; \ No newline at end of file diff --git a/src/pages/aliases/index.tsx b/src/pages/aliases/index.tsx index 4bc04e4..def1c23 100644 --- a/src/pages/aliases/index.tsx +++ b/src/pages/aliases/index.tsx @@ -66,12 +66,15 @@ function Aliases(props: AliasesPageProps) { hasMatrixConnection: e.hasMatrixConnection || false })) ); - }, [itemsOnPage, page, searchState, isPremiumOnly]); + }, [itemsOnPage, page, searchState, isPremiumOnly, isInMatrix]); const fetchMatrixAliases = useCallback(async () => { const result = await Fetch.getMatrixAddresses(page, itemsOnPage); if(!result.success || !(result.addresses instanceof Array)) return; - setAliases(result.addresses); + const aliases = result.addresses.map((e :any)=>{ + return {...e, hasMatrixConnection: true} + }) + setAliases(aliases); },[itemsOnPage, page]) useEffect(() => { @@ -121,23 +124,25 @@ function Aliases(props: AliasesPageProps) { - {hasMatrixConnection && } + {hasMatrixConnection && } :
<> {alias} - {hasMatrixConnection && } + {hasMatrixConnection && }
); } - function ConnectionIcon(){ + function ConnectionIcon({alias}:{alias: string}){ const [hovered, setHovered] = useState(false); + const link = `https://matrix.to/#/@${alias}:zano.org` return ( +
setHovered(true)} onMouseLeave={ ()=> setHovered(false)} > <> @@ -149,6 +154,7 @@ function Aliases(props: AliasesPageProps) {
} + ) } diff --git a/src/styles/Aliases.module.scss b/src/styles/Aliases.module.scss index 1d55a69..c7c392a 100644 --- a/src/styles/Aliases.module.scss +++ b/src/styles/Aliases.module.scss @@ -20,7 +20,7 @@ .connection_icon__tooltip__arrow { z-index: 1; position: absolute; - top:0px; + top: 0px; transform: rotate(45deg) translateY(-5px); height: 10px; width: 10px;