diff --git a/src/components/CheckAppUpdate.tsx b/src/components/CheckAppUpdate.tsx index 95d7196a..962bed97 100644 --- a/src/components/CheckAppUpdate.tsx +++ b/src/components/CheckAppUpdate.tsx @@ -20,7 +20,7 @@ export default React.memo(function CheckAppUpdate() { } Alert.alert( '有新版本', - `${appUpdateInfo.currentVersion} ⟶ ${appUpdateInfo.latestVersion}\n${appUpdateInfo.changelog}`, + `${appUpdateInfo.currentVersion} ⟶ ${appUpdateInfo.latestVersion}\n\n${appUpdateInfo.changelog}`, [ { text: '取消', diff --git a/src/routes/About/Version.tsx b/src/routes/About/Version.tsx index ce33cb9f..526ea952 100644 --- a/src/routes/About/Version.tsx +++ b/src/routes/About/Version.tsx @@ -27,7 +27,7 @@ export default React.memo(function Version() { if (data.hasUpdate) { Alert.alert( '有新版本', - `${data.currentVersion} ⟶ ${data.latestVersion} \n ${data.changelog}`, + `${data.currentVersion} ⟶ ${data.latestVersion}\n\n${data.changelog}`, [ { text: '取消', diff --git a/src/routes/Follow/AddFollow.tsx b/src/routes/Follow/AddFollow.tsx index a808593f..bbb595f9 100644 --- a/src/routes/Follow/AddFollow.tsx +++ b/src/routes/Follow/AddFollow.tsx @@ -23,8 +23,8 @@ import { useStore } from '../../store' function SearchedItem(props: { up: SearchedUpType }) { const up = props.up - const { $followedUps, set$followedUps } = useStore() - const followed = $followedUps.find(v => v.mid == up.mid) + const { _followedUpsMap, get$followedUps, set$followedUps } = useStore() + const followed = up.mid in _followedUpsMap const user = { name: up.name, face: up.face, @@ -32,7 +32,7 @@ function SearchedItem(props: { up: SearchedUpType }) { sign: up.sign, } const handler = () => { - set$followedUps([user, ...$followedUps]) + set$followedUps([user, ...get$followedUps()]) } const goToDynamic = () => { Linking.openURL(`https://m.bilibili.com/space/${up.mid}`) diff --git a/src/routes/Follow/index.tsx b/src/routes/Follow/index.tsx index 5c35641c..d895391a 100644 --- a/src/routes/Follow/index.tsx +++ b/src/routes/Follow/index.tsx @@ -58,82 +58,85 @@ const TvImg: React.FC = () => { /> ) } -function Follow() { +export default React.memo(function Follow() { // eslint-disable-next-line no-console __DEV__ && console.log('Follow page') const { $followedUps, $upUpdateMap, livingUps } = useStore() const followListRef = React.useRef(null) const dark = useIsDark() + const { width } = useWindowDimensions() const columns = Math.floor(width / 90) - const followedUpListLen = $followedUps.length - const rest = followedUpListLen - ? columns - (followedUpListLen ? followedUpListLen % columns : 0) - : 0 - let displayUps: (UpInfo | null)[] = [] - const pinUps: UpInfo[] = [] - const liveUps: UpInfo[] = [] - const updateUps: UpInfo[] = [] - const otherUps: UpInfo[] = [] + const content = React.useMemo(() => { + const followedUpListLen = $followedUps.length + const rest = followedUpListLen + ? columns - (followedUpListLen ? followedUpListLen % columns : 0) + : 0 + const pinUps: UpInfo[] = [] + const liveUps: UpInfo[] = [] + const updateUps: UpInfo[] = [] + const otherUps: UpInfo[] = [] - for (const up of $followedUps) { - if (up.pin) { - pinUps.push({ ...up }) - } else if (livingUps[up.mid]) { - liveUps.push({ ...up }) - } else { - if ( - up.mid in $upUpdateMap && - $upUpdateMap[up.mid].latestId !== $upUpdateMap[up.mid].currentLatestId - ) { - updateUps.push({ ...up }) + for (const up of $followedUps) { + if (up.pin) { + pinUps.push({ ...up }) + } else if (livingUps[up.mid]) { + liveUps.push({ ...up }) } else { - otherUps.push({ ...up }) + if ( + up.mid in $upUpdateMap && + $upUpdateMap[up.mid].latestId !== $upUpdateMap[up.mid].currentLatestId + ) { + updateUps.push({ ...up }) + } else { + otherUps.push({ ...up }) + } } } - } - displayUps = [ - ...pinUps.sort((a, b) => b.pin! - a.pin!), - ...liveUps, - ...updateUps, - ...otherUps, - ...(rest ? Array.from({ length: rest }).map(() => null) : []), - ] - const content = ( - <> - - (item ? item.mid + '' : index + '')} - onEndReachedThreshold={1} - persistentScrollbar - key={columns} // FlatList不支持直接更改columns - numColumns={columns} - ref={followListRef} - columnWrapperStyle={{ - paddingHorizontal: 10, - }} - contentContainerStyle={{ - paddingTop: 30, - }} - ListEmptyComponent={ - - - 暂无关注,请添加 - - } - ListFooterComponent={ - $followedUps.length ? ( - 到底了~ - ) : null - } - /> - - - - ) + const displayUps = [ + ...pinUps.sort((a, b) => b.pin! - a.pin!), + ...liveUps, + ...updateUps, + ...otherUps, + ...(rest ? Array.from({ length: rest }).map(() => null) : []), + ] + return ( + <> + + (item ? item.mid + '' : index + '')} + onEndReachedThreshold={1} + persistentScrollbar + key={columns} // FlatList不支持直接更改columns + numColumns={columns} + ref={followListRef} + columnWrapperStyle={{ + paddingHorizontal: 10, + }} + contentContainerStyle={{ + paddingTop: 30, + }} + ListEmptyComponent={ + + + 暂无关注,请添加 + + } + ListFooterComponent={ + $followedUps.length ? ( + 到底了~ + ) : null + } + /> + + + + ) + }, [$followedUps, $upUpdateMap, livingUps, columns]) + return ( {dark ? ( @@ -148,9 +151,7 @@ function Follow() { )} ) -} - -export default React.memo(Follow) +}) const styles = StyleSheet.create({ container: {