From ea74839aaa048a18f02064edea401635fcb1a69c Mon Sep 17 00:00:00 2001 From: Bogdan Crisan Date: Tue, 12 Nov 2024 23:06:55 +0100 Subject: [PATCH 1/4] Fix double rendering issue on home page --- .../pages/home/components/emoji-table/ClientGrid.tsx | 7 +++---- .../components/pages/home/components/emoji-table/utils.ts | 3 --- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx b/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx index cd0eb6b9a..5437d3fe8 100644 --- a/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx +++ b/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx @@ -20,11 +20,10 @@ export const ClientGrid = ({ sortBy: MarketDataSortByHomePage; }) => { const rowLength = useGridRowLength(); - const searchEmojis = useEmojiPicker((s) => s.emojis); const ordered = useMemo(() => { - return marketDataToProps(markets, searchEmojis); - }, [markets, searchEmojis]); + return marketDataToProps(markets); + }, [markets]); const initialRender = useRef(true); @@ -41,7 +40,7 @@ export const ClientGrid = ({ {ordered.map((v, i) => { return ( & { time: number; - searchEmojisKey: string; }; export type PropsWithTimeAndIndex = TableCardProps & { time: number; @@ -21,7 +20,6 @@ const toSearchEmojisKey = (searchEmojis: string[]) => `{${searchEmojis.join("")} export const marketDataToProps = ( markets: HomePageProps["markets"], - searchEmojis: string[] ): PropsWithTime[] => markets.map((m) => ({ time: Number(m.market.time), @@ -30,7 +28,6 @@ export const marketDataToProps = ( emojis: m.market.emojis, staticMarketCap: m.state.instantaneousStats.marketCap.toString(), staticVolume24H: m.dailyVolume.toString(), - searchEmojisKey: toSearchEmojisKey(searchEmojis), })); export const stateEventsToProps = ( From 291a8e7e5e736bdd92493b723981a6fd674324c5 Mon Sep 17 00:00:00 2001 From: Bogdan Crisan Date: Wed, 13 Nov 2024 01:37:56 +0100 Subject: [PATCH 2/4] Run format --- .../src/components/pages/home/components/emoji-table/utils.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts b/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts index df61d9117..a9e6d89ea 100644 --- a/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts +++ b/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts @@ -18,9 +18,7 @@ export type WithTimeIndexAndPrev = PropsWithTimeAndIndex & { const toSearchEmojisKey = (searchEmojis: string[]) => `{${searchEmojis.join("")}}`; -export const marketDataToProps = ( - markets: HomePageProps["markets"], -): PropsWithTime[] => +export const marketDataToProps = (markets: HomePageProps["markets"]): PropsWithTime[] => markets.map((m) => ({ time: Number(m.market.time), symbol: m.market.symbolData.symbol, From 54c75fe3f17f89981365fcb7ff568b510a2d81e0 Mon Sep 17 00:00:00 2001 From: Matt <90358481+xbtmatt@users.noreply.github.com> Date: Tue, 12 Nov 2024 18:59:55 -0800 Subject: [PATCH 3/4] Remove unused variable --- .../pages/home/components/emoji-table/ClientGrid.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx b/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx index 5437d3fe8..0dd2884ef 100644 --- a/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx +++ b/src/typescript/frontend/src/components/pages/home/components/emoji-table/ClientGrid.tsx @@ -6,9 +6,8 @@ import { marketDataToProps } from "./utils"; import { useGridRowLength } from "./hooks/use-grid-items-per-line"; import { type MarketDataSortByHomePage } from "lib/queries/sorting/types"; import { useEffect, useMemo, useRef } from "react"; -import "./module.css"; -import { useEmojiPicker } from "context/emoji-picker-context"; import { type HomePageProps } from "app/home/HomePage"; +import "./module.css"; export const ClientGrid = ({ markets, From 848a552a9ac6267e7bdfb3998e1e5b7eeab98333 Mon Sep 17 00:00:00 2001 From: Matt <90358481+xbtmatt@users.noreply.github.com> Date: Tue, 12 Nov 2024 19:04:11 -0800 Subject: [PATCH 4/4] Remove `searchEmojis` from function invocation --- .../src/components/pages/home/components/emoji-table/utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts b/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts index a9e6d89ea..7ba2bf7e9 100644 --- a/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts +++ b/src/typescript/frontend/src/components/pages/home/components/emoji-table/utils.ts @@ -98,7 +98,7 @@ export const constructOrdered = ({ // We don't need to filter the fetched data because it's already filtered and sorted by the // server. We only need to filter event store state events. const searchEmojis = getSearchEmojis() as Array; - const initial = marketDataToProps(markets, searchEmojis); + const initial = marketDataToProps(markets); // If we're sorting by bump order, deduplicate and sort the events by bump order. const bumps = stateEventsToProps(stateFirehose, getMarket, searchEmojis);