From c858b583072d7858f50ee0d56bb76dbce5a9c13d Mon Sep 17 00:00:00 2001 From: dan Date: Fri, 17 Nov 2023 17:31:26 +0000 Subject: [PATCH] Do less work (#1953) --- src/state/cache/post-shadow.ts | 10 ++++++---- src/state/cache/profile-shadow.ts | 10 ++++++---- src/state/queries/preferences/index.ts | 20 +++++--------------- src/view/com/post-thread/PostThreadItem.tsx | 9 +++++---- src/view/com/post/Post.tsx | 2 +- src/view/com/posts/FeedItem.tsx | 2 +- 6 files changed, 24 insertions(+), 29 deletions(-) diff --git a/src/state/cache/post-shadow.ts b/src/state/cache/post-shadow.ts index c490977008..d20f6ebaaf 100644 --- a/src/state/cache/post-shadow.ts +++ b/src/state/cache/post-shadow.ts @@ -1,4 +1,4 @@ -import {useEffect, useState, useCallback, useRef} from 'react' +import {useEffect, useState, useMemo, useCallback, useRef} from 'react' import EventEmitter from 'eventemitter3' import {AppBskyFeedDefs} from '@atproto/api' import {Shadow} from './types' @@ -55,9 +55,11 @@ export function usePostShadow( firstRun.current = false }, [post]) - return state.ts > ifAfterTS - ? mergeShadow(post, state.value) - : {...post, isShadowed: true} + return useMemo(() => { + return state.ts > ifAfterTS + ? mergeShadow(post, state.value) + : {...post, isShadowed: true} + }, [post, state, ifAfterTS]) } export function updatePostShadow(uri: string, value: Partial) { diff --git a/src/state/cache/profile-shadow.ts b/src/state/cache/profile-shadow.ts index 59f79634d1..5323effaf3 100644 --- a/src/state/cache/profile-shadow.ts +++ b/src/state/cache/profile-shadow.ts @@ -1,4 +1,4 @@ -import {useEffect, useState, useCallback, useRef} from 'react' +import {useEffect, useState, useMemo, useCallback, useRef} from 'react' import EventEmitter from 'eventemitter3' import {AppBskyActorDefs} from '@atproto/api' import {Shadow} from './types' @@ -56,9 +56,11 @@ export function useProfileShadow( firstRun.current = false }, [profile]) - return state.ts > ifAfterTS - ? mergeShadow(profile, state.value) - : {...profile, isShadowed: true} + return useMemo(() => { + return state.ts > ifAfterTS + ? mergeShadow(profile, state.value) + : {...profile, isShadowed: true} + }, [profile, state, ifAfterTS]) } export function updateProfileShadow( diff --git a/src/state/queries/preferences/index.ts b/src/state/queries/preferences/index.ts index fe719225df..e7fa3b15b1 100644 --- a/src/state/queries/preferences/index.ts +++ b/src/state/queries/preferences/index.ts @@ -1,11 +1,6 @@ -import {useEffect, useState} from 'react' +import {useMemo} from 'react' import {useQuery, useMutation, useQueryClient} from '@tanstack/react-query' -import { - LabelPreference, - BskyFeedViewPreference, - ModerationOpts, -} from '@atproto/api' -import isEqual from 'lodash.isequal' +import {LabelPreference, BskyFeedViewPreference} from '@atproto/api' import {track} from '#/lib/analytics/analytics' import {getAge} from '#/lib/strings/time' @@ -91,21 +86,16 @@ export function usePreferencesQuery() { export function useModerationOpts() { const {currentAccount} = useSession() - const [opts, setOpts] = useState() const prefs = usePreferencesQuery() - useEffect(() => { + const opts = useMemo(() => { if (!prefs.data) { return } - // only update this hook when the moderation options change - const newOpts = getModerationOpts({ + return getModerationOpts({ userDid: currentAccount?.did || '', preferences: prefs.data, }) - if (!isEqual(opts, newOpts)) { - setOpts(newOpts) - } - }, [prefs.data, currentAccount, opts, setOpts]) + }, [currentAccount?.did, prefs.data]) return opts } diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 0e2fb7080c..f66c01d858 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -1,4 +1,4 @@ -import React, {useMemo} from 'react' +import React, {memo, useMemo} from 'react' import {StyleSheet, View} from 'react-native' import { AtUri, @@ -118,7 +118,7 @@ function PostThreadItemDeleted() { ) } -function PostThreadItemLoaded({ +let PostThreadItemLoaded = ({ post, record, richText, @@ -144,12 +144,12 @@ function PostThreadItemLoaded({ showParentReplyLine?: boolean hasPrecedingItem: boolean onPostReply: () => void -}) { +}): React.ReactNode => { const pal = usePalette('default') const langPrefs = useLanguagePrefs() const {openComposer} = useComposerControls() const [limitLines, setLimitLines] = React.useState( - countLines(richText?.text) >= MAX_POST_LINES, + () => countLines(richText?.text) >= MAX_POST_LINES, ) const styles = useStyles() const hasEngagement = post.likeCount || post.repostCount @@ -565,6 +565,7 @@ function PostThreadItemLoaded({ ) } } +PostThreadItemLoaded = memo(PostThreadItemLoaded) function PostOuterWrapper({ post, diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx index a2a0e62e60..00dd4419f1 100644 --- a/src/view/com/post/Post.tsx +++ b/src/view/com/post/Post.tsx @@ -99,7 +99,7 @@ function PostInner({ const pal = usePalette('default') const {openComposer} = useComposerControls() const [limitLines, setLimitLines] = useState( - countLines(richText?.text) >= MAX_POST_LINES, + () => countLines(richText?.text) >= MAX_POST_LINES, ) const itemUrip = new AtUri(post.uri) const itemHref = makeProfileLink(post.author, 'post', itemUrip.rkey) diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index 786b879aff..19f2b0e6ca 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -106,7 +106,7 @@ let FeedItemInner = ({ const pal = usePalette('default') const {track} = useAnalytics() const [limitLines, setLimitLines] = useState( - countLines(richText.text) >= MAX_POST_LINES, + () => countLines(richText.text) >= MAX_POST_LINES, ) const href = useMemo(() => {