From 0e57120745d57fa35aa17569aa2db4677c4e47ea Mon Sep 17 00:00:00 2001 From: Max Alekseenko Date: Thu, 15 Feb 2024 17:54:55 +0100 Subject: [PATCH 1/2] sort dapps by favorite --- ui/marketplace/useMarketplaceApps.tsx | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/ui/marketplace/useMarketplaceApps.tsx b/ui/marketplace/useMarketplaceApps.tsx index 07c3d1f383..d168541aa0 100644 --- a/ui/marketplace/useMarketplaceApps.tsx +++ b/ui/marketplace/useMarketplaceApps.tsx @@ -22,11 +22,15 @@ function isAppCategoryMatches(category: string, app: MarketplaceAppOverview, fav app.categories.includes(category); } -function sortApps(apps: Array) { +function sortApps(apps: Array, favoriteApps: Array) { return apps.sort((a, b) => { const priorityA = a.priority || 0; const priorityB = b.priority || 0; - // First, sort by priority (descending) + // First, sort by favorite apps + if (favoriteApps.includes(a.id) !== favoriteApps.includes(b.id)) { + return favoriteApps.includes(a.id) ? -1 : 1; + } + // Then sort by priority (descending) if (priorityB !== priorityA) { return priorityB - priorityA; } @@ -47,6 +51,11 @@ export default function useMarketplaceApps(filter: string, selectedCategoryId: s const fetch = useFetch(); const apiFetch = useApiFetch(); + const lastFavoriteAppsRef = React.useRef(favoriteApps); + React.useEffect(() => { + lastFavoriteAppsRef.current = favoriteApps; + }, [ selectedCategoryId ]); // eslint-disable-line react-hooks/exhaustive-deps + const { isPlaceholderData, isError, error, data } = useQuery, Array>({ queryKey: [ 'marketplace-dapps' ], queryFn: async() => { @@ -58,7 +67,7 @@ export default function useMarketplaceApps(filter: string, selectedCategoryId: s return apiFetch('marketplace_dapps', { pathParams: { chainId: config.chain.id } }); } }, - select: (data) => sortApps(data as Array), + select: (data) => sortApps(data as Array, lastFavoriteAppsRef.current), placeholderData: feature.isEnabled ? Array(9).fill(MARKETPLACE_APP) : undefined, staleTime: Infinity, enabled: feature.isEnabled, From 2d3066fc94f64c811b4d78bb3198e05834366f86 Mon Sep 17 00:00:00 2001 From: Max Alekseenko Date: Fri, 16 Feb 2024 16:59:46 +0100 Subject: [PATCH 2/2] add an explanatory comment --- ui/marketplace/useMarketplaceApps.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/marketplace/useMarketplaceApps.tsx b/ui/marketplace/useMarketplaceApps.tsx index d168541aa0..360b5f0bca 100644 --- a/ui/marketplace/useMarketplaceApps.tsx +++ b/ui/marketplace/useMarketplaceApps.tsx @@ -51,6 +51,7 @@ export default function useMarketplaceApps(filter: string, selectedCategoryId: s const fetch = useFetch(); const apiFetch = useApiFetch(); + // Update favorite apps only when selectedCategoryId changes to avoid sortApps to be called on each favorite app click const lastFavoriteAppsRef = React.useRef(favoriteApps); React.useEffect(() => { lastFavoriteAppsRef.current = favoriteApps;