zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

Truncate post metrics and fix truncation on native (#4575) 

* truncate post counts

* add numberformat polyfill

* Fix perf

* Simplify type shenanigans

* Bump versions to remove dupes

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
zio/stable
Samuel Newman 2024-06-19 22:21:02 +01:00 committed by GitHub
parent ca17cf276f
commit 22c5aa4da4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 68 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
package.json
View File

@ -58,8 +58,9 @@
"@expo/webpack-config": "^19.0.0", "@expo/webpack-config": "^19.0.0",
"@floating-ui/dom": "^1.6.3", "@floating-ui/dom": "^1.6.3",
"@floating-ui/react-dom": "^2.0.8", "@floating-ui/react-dom": "^2.0.8",
"@formatjs/intl-locale": "^3.4.3", "@formatjs/intl-locale": "^4.0.0",
"@formatjs/intl-pluralrules": "^5.2.10", "@formatjs/intl-numberformat": "^8.10.3",
"@formatjs/intl-pluralrules": "^5.2.14",
"@fortawesome/fontawesome-svg-core": "^6.1.1", "@fortawesome/fontawesome-svg-core": "^6.1.1",
"@fortawesome/free-regular-svg-icons": "^6.1.1", "@fortawesome/free-regular-svg-icons": "^6.1.1",
"@fortawesome/free-solid-svg-icons": "^6.1.1", "@fortawesome/free-solid-svg-icons": "^6.1.1",

8
src/locale/i18n.ts
View File

@ -1,6 +1,10 @@
import '@formatjs/intl-locale/polyfill' // Don't remove -force from these because detection is VERY slow on low-end Android.
import '@formatjs/intl-pluralrules/polyfill-force' // Don't remove -force because detection is very slow // https://github.com/formatjs/formatjs/issues/4463#issuecomment-2176070577
import '@formatjs/intl-locale/polyfill-force'
import '@formatjs/intl-pluralrules/polyfill-force'
import '@formatjs/intl-numberformat/polyfill-force'
import '@formatjs/intl-pluralrules/locale-data/en' import '@formatjs/intl-pluralrules/locale-data/en'
import '@formatjs/intl-numberformat/locale-data/en'
import {useEffect} from 'react' import {useEffect} from 'react'
import {i18n} from '@lingui/core' import {i18n} from '@lingui/core'

5
src/view/com/util/post-ctrls/PostCtrls.tsx
View File

@ -39,6 +39,7 @@ import {
} from '#/components/icons/Heart2' } from '#/components/icons/Heart2'
import * as Prompt from '#/components/Prompt' import * as Prompt from '#/components/Prompt'
import {PostDropdownBtn} from '../forms/PostDropdownBtn' import {PostDropdownBtn} from '../forms/PostDropdownBtn'
import {formatCount} from '../numeric/format'
import {Text} from '../text/Text' import {Text} from '../text/Text'
import {RepostButton} from './RepostButton' import {RepostButton} from './RepostButton'
@ -226,7 +227,7 @@ let PostCtrls = ({
big ? a.text_md : {fontSize: 15}, big ? a.text_md : {fontSize: 15},
a.user_select_none, a.user_select_none,
]}> ]}>
{post.replyCount} {formatCount(post.replyCount)}
</Text> </Text>
) : undefined} ) : undefined}
</Pressable> </Pressable>
@ -278,7 +279,7 @@ let PostCtrls = ({
: defaultCtrlColor, : defaultCtrlColor,
], ],
]}> ]}>
{post.likeCount} {formatCount(post.likeCount)}
</Text> </Text>
) : undefined} ) : undefined}
</Pressable> </Pressable>

3
src/view/com/util/post-ctrls/RepostButton.tsx
View File

@ -12,6 +12,7 @@ import * as Dialog from '#/components/Dialog'
import {CloseQuote_Stroke2_Corner1_Rounded as Quote} from '#/components/icons/Quote' import {CloseQuote_Stroke2_Corner1_Rounded as Quote} from '#/components/icons/Quote'
import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost' import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost'
import {Text} from '#/components/Typography' import {Text} from '#/components/Typography'
import {formatCount} from '../numeric/format'
interface Props { interface Props {
isReposted: boolean isReposted: boolean
@ -76,7 +77,7 @@ let RepostButton = ({
big ? a.text_md : {fontSize: 15}, big ? a.text_md : {fontSize: 15},
isReposted && a.font_bold, isReposted && a.font_bold,
]}> ]}>
{repostCount} {formatCount(repostCount)}
</Text> </Text>
) : undefined} ) : undefined}
</Button> </Button>

37
src/view/com/util/post-ctrls/RepostButton.web.tsx
View File

@ -12,6 +12,7 @@ import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repos
import * as Menu from '#/components/Menu' import * as Menu from '#/components/Menu'
import {Text} from '#/components/Typography' import {Text} from '#/components/Typography'
import {EventStopper} from '../EventStopper' import {EventStopper} from '../EventStopper'
import {formatCount} from '../numeric/format'
interface Props { interface Props {
isReposted: boolean isReposted: boolean
@ -115,20 +116,22 @@ const RepostInner = ({
color: {color: string} color: {color: string}
repostCount?: number repostCount?: number
big?: boolean big?: boolean
}) => ( }) => {
<View style={[a.flex_row, a.align_center, a.gap_xs, {padding: 5}]}> return (
<Repost style={color} width={big ? 22 : 18} /> <View style={[a.flex_row, a.align_center, a.gap_xs, {padding: 5}]}>
{typeof repostCount !== 'undefined' && repostCount > 0 ? ( <Repost style={color} width={big ? 22 : 18} />
<Text {typeof repostCount !== 'undefined' && repostCount > 0 ? (
testID="repostCount" <Text
style={[ testID="repostCount"
color, style={[
big ? a.text_md : {fontSize: 15}, color,
isReposted && [a.font_bold], big ? a.text_md : {fontSize: 15},
a.user_select_none, isReposted && [a.font_bold],
]}> a.user_select_none,
{repostCount} ]}>
</Text> {formatCount(repostCount)}
) : undefined} </Text>
</View> ) : undefined}
) </View>
)
}

59
yarn.lock
View File

@ -3897,18 +3897,18 @@
resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2" resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2"
integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q== integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==
"@formatjs/ecma402-abstract@1.18.0": "@formatjs/ecma402-abstract@2.0.0":
version "1.18.0" version "2.0.0"
resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.18.0.tgz#e2120e7101020140661b58430a7ff4262705a2f2" resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-2.0.0.tgz#39197ab90b1c78b7342b129a56a7acdb8f512e17"
integrity sha512-PEVLoa3zBevWSCZzPIM/lvPCi8P5l4G+NXQMc/CjEiaCWgyHieUoo0nM7Bs0n/NbuQ6JpXEolivQ9pKSBHaDlA== integrity sha512-rRqXOqdFmk7RYvj4khklyqzcfQl9vEL/usogncBHRZfZBDOwMGuSRNFl02fu5KGHXdbinju+YXyuR+Nk8xlr/g==
dependencies: dependencies:
"@formatjs/intl-localematcher" "0.5.2" "@formatjs/intl-localematcher" "0.5.4"
tslib "^2.4.0" tslib "^2.4.0"
"@formatjs/intl-enumerator@1.4.3": "@formatjs/intl-enumerator@1.4.7":
version "1.4.3" version "1.4.7"
resolved "https://registry.yarnpkg.com/@formatjs/intl-enumerator/-/intl-enumerator-1.4.3.tgz#8d278c273485d7c6219916509fbd51ce3142064d" resolved "https://registry.yarnpkg.com/@formatjs/intl-enumerator/-/intl-enumerator-1.4.7.tgz#6ab697f3f8f18cf0cc6a6b028cb9c40db6001f3d"
integrity sha512-0NpTmAQnDokPoB5aVtXvOdtrUq/uEuPPhBUAr57TYYDjI5MwfFXt8F6JCm6s6CPI0inL8+nxPLjjqH0qyNnP4Q== integrity sha512-03RHnFqfpB4H/jwCwlzC+wkTDk2Fi24JmVIY2PVGvTUpikN2bSr9+8oTXfOC+y7B7VxjCArUnqWXVoctkmy85w==
dependencies: dependencies:
tslib "^2.4.0" tslib "^2.4.0"
@ -3919,30 +3919,39 @@
dependencies: dependencies:
tslib "^2.4.0" tslib "^2.4.0"
"@formatjs/intl-locale@^3.4.3": "@formatjs/intl-locale@^4.0.0":
version "3.4.3" version "4.0.0"
resolved "https://registry.yarnpkg.com/@formatjs/intl-locale/-/intl-locale-3.4.3.tgz#fdd2a3978b03aa76965abbca86526bb1d02973b6" resolved "https://registry.yarnpkg.com/@formatjs/intl-locale/-/intl-locale-4.0.0.tgz#c111a33078413eba2011e82140466261eb1d67cd"
integrity sha512-g/35yMikkkRmLYmqE4W74gvZyKa768oC9OmUFzfLmH3CVYF3v2kvAZI0WsxWLbxYj8TT7wBDeLIL3aIlRw4Osw== integrity sha512-+4dbMEGsp1bvB3JB3UHH6YTjMnFTifnfdaHp4ROrCCu50NedA69RBsDCG3eivcZkbj57X9ehGhMWjLxlP+gyVw==
dependencies: dependencies:
"@formatjs/ecma402-abstract" "1.18.0" "@formatjs/ecma402-abstract" "2.0.0"
"@formatjs/intl-enumerator" "1.4.3" "@formatjs/intl-enumerator" "1.4.7"
"@formatjs/intl-getcanonicallocales" "2.3.0" "@formatjs/intl-getcanonicallocales" "2.3.0"
tslib "^2.4.0" tslib "^2.4.0"
"@formatjs/intl-localematcher@0.5.2": "@formatjs/intl-localematcher@0.5.4":
version "0.5.2" version "0.5.4"
resolved "https://registry.yarnpkg.com/@formatjs/intl-localematcher/-/intl-localematcher-0.5.2.tgz#5fcf029fd218905575e5080fa33facdcb623d532" resolved "https://registry.yarnpkg.com/@formatjs/intl-localematcher/-/intl-localematcher-0.5.4.tgz#caa71f2e40d93e37d58be35cfffe57865f2b366f"
integrity sha512-txaaE2fiBMagLrR4jYhxzFO6wEdEG4TPMqrzBAcbr4HFUYzH/YC+lg6OIzKCHm8WgDdyQevxbAAV1OgcXctuGw== integrity sha512-zTwEpWOzZ2CiKcB93BLngUX59hQkuZjT2+SAQEscSm52peDW/getsawMcWF1rGRpMCX6D7nSJA3CzJ8gn13N/g==
dependencies: dependencies:
tslib "^2.4.0" tslib "^2.4.0"
"@formatjs/intl-pluralrules@^5.2.10": "@formatjs/intl-numberformat@^8.10.3":
version "5.2.10" version "8.10.3"
resolved "https://registry.yarnpkg.com/@formatjs/intl-pluralrules/-/intl-pluralrules-5.2.10.tgz#379fc06133625df0cae715c1d902001974ff3279" resolved "https://registry.yarnpkg.com/@formatjs/intl-numberformat/-/intl-numberformat-8.10.3.tgz#abc97cc6a7b7f1b20da9f07a976b5589c1192ab8"
integrity sha512-wfJypePrbOByaZVPP1moLXHgS9LeAvi9coP95XZX7ySVrwdDGPnxz9Pw+o7J1o8AjLxjiqGrvAi74key5zzIjQ== integrity sha512-lH3liLMeIjZ19Zxt8RRPnBcpPweS1YNSXRURDiFfvFmRlDZUOd8+GlcVyECcPZPkIoSH/p4lfGrnaUzepxJ92g==
dependencies: dependencies:
"@formatjs/ecma402-abstract" "1.18.0" "@formatjs/ecma402-abstract" "2.0.0"
"@formatjs/intl-localematcher" "0.5.2" "@formatjs/intl-localematcher" "0.5.4"
tslib "^2.4.0"
"@formatjs/intl-pluralrules@^5.2.14":
version "5.2.14"
resolved "https://registry.yarnpkg.com/@formatjs/intl-pluralrules/-/intl-pluralrules-5.2.14.tgz#7477bd2aa9bfde9e543d839707eff5460eb08026"
integrity sha512-l6Ev7aOGXJSh5EPDEqzsbyufdCCKXZk993QXRQebLsB0TXRhIyF4alqjdMEatLwIigK/Mka8kiVIOLeFP5Cj9Q==
dependencies:
"@formatjs/ecma402-abstract" "2.0.0"
"@formatjs/intl-localematcher" "0.5.4"
tslib "^2.4.0" tslib "^2.4.0"
"@fortawesome/fontawesome-common-types@6.4.2": "@fortawesome/fontawesome-common-types@6.4.2":