Page MenuHomePhorge

D10419.1765106303.diff
No OneTemporary

Size
3 KB
Referenced Files
None
Subscribers
None

D10419.1765106303.diff

diff --git a/web/app.react.js b/web/app.react.js
--- a/web/app.react.js
+++ b/web/app.react.js
@@ -206,10 +206,10 @@
return (
<DndProvider backend={HTML5Backend}>
<EditModalProvider>
- <TooltipProvider>
- <MenuProvider>
- <WagmiConfig config={wagmiConfig}>
- <AlchemyENSCacheProvider>
+ <MenuProvider>
+ <WagmiConfig config={wagmiConfig}>
+ <AlchemyENSCacheProvider>
+ <TooltipProvider>
<MessageSearchStateProvider>
<ChatMentionContextProvider>
<FocusHandler />
@@ -221,10 +221,10 @@
{content}
</ChatMentionContextProvider>
</MessageSearchStateProvider>
- </AlchemyENSCacheProvider>
- </WagmiConfig>
- </MenuProvider>
- </TooltipProvider>
+ </TooltipProvider>
+ </AlchemyENSCacheProvider>
+ </WagmiConfig>
+ </MenuProvider>
</EditModalProvider>
</DndProvider>
);
diff --git a/web/tooltips/reaction-tooltip.react.js b/web/tooltips/reaction-tooltip.react.js
--- a/web/tooltips/reaction-tooltip.react.js
+++ b/web/tooltips/reaction-tooltip.react.js
@@ -3,6 +3,7 @@
import * as React from 'react';
import { useModalContext } from 'lib/components/modal-provider.react.js';
+import { useENSNames } from 'lib/hooks/ens-cache.js';
import type { ReactionInfo } from 'lib/selectors/chat-selectors';
import css from './reaction-tooltip.css';
@@ -14,6 +15,8 @@
} from './tooltip-constants.js';
import MessageReactionsModal from '../modals/chat/message-reactions-modal.react.js';
+const useENSNamesOptions = { allAtOnce: true };
+
type Props = {
+reactions: ReactionInfo,
+reaction: string,
@@ -21,6 +24,8 @@
function ReactionTooltip(props: Props): React.Node {
const { reactions, reaction } = props;
+ const { users } = reactions[reaction];
+
const { pushModal, popModal } = useModalContext();
const onClickReactionTooltip = React.useCallback(
@@ -34,10 +39,10 @@
[popModal, pushModal, reactions],
);
- const usernames = React.useMemo(() => {
- const { users } = reactions[reaction];
+ const resolvedUsers = useENSNames(users, useENSNamesOptions);
- return users.map(user => (
+ const usernames = React.useMemo(() => {
+ return resolvedUsers.map(user => (
<p
key={user.id}
className={css.usernameText}
@@ -46,7 +51,7 @@
{user.username}
</p>
));
- }, [reaction, reactions]);
+ }, [resolvedUsers]);
let seeMoreText;
if (usernames && usernames.length > 5) {
diff --git a/web/tooltips/tooltip-action-utils.js b/web/tooltips/tooltip-action-utils.js
--- a/web/tooltips/tooltip-action-utils.js
+++ b/web/tooltips/tooltip-action-utils.js
@@ -4,6 +4,7 @@
import * as React from 'react';
import { useModalContext } from 'lib/components/modal-provider.react.js';
+import { useENSNames } from 'lib/hooks/ens-cache.js';
import { useResettingState } from 'lib/hooks/use-resetting-state.js';
import type {
ChatMessageInfoItem,
@@ -439,6 +440,8 @@
};
}
+const useENSNamesOptions = { allAtOnce: true };
+
type UseReactionTooltipArgs = {
+reaction: string,
+reactions: ReactionInfo,
@@ -452,15 +455,17 @@
}: UseReactionTooltipArgs): UseTooltipResult {
const { users } = reactions[reaction];
+ const resolvedUsers = useENSNames(users, useENSNamesOptions);
+
const tooltipSize = React.useMemo(() => {
if (typeof document === 'undefined') {
return undefinedTooltipSize;
}
- const usernames = users.map(user => user.username).filter(Boolean);
+ const usernames = resolvedUsers.map(user => user.username).filter(Boolean);
return calculateReactionTooltipSize(usernames);
- }, [users]);
+ }, [resolvedUsers]);
const createReactionTooltip = React.useCallback(
() => <ReactionTooltip reactions={reactions} reaction={reaction} />,

File Metadata

Mime Type
text/plain
Expires
Sun, Dec 7, 11:18 AM (21 h, 3 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5842191
Default Alt Text
D10419.1765106303.diff (3 KB)

Event Timeline