forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
[Embeds] Format big numbers (#5087)
authored by
Samuel Newman
and committed by
GitHub
0469ca6c
f3f7dfc3
+21
-11
+1
-1
bskyembed/package.json
+1
-1
bskyembed/package.json
+4
-4
bskyembed/src/components/post.tsx
+4
-4
bskyembed/src/components/post.tsx
···
11
11
import logo from '../../assets/logo.svg'
12
12
import repostIcon from '../../assets/repost_stroke2_corner2_rounded.svg'
13
13
import {CONTENT_LABELS} from '../labels'
14
-
import {getRkey, niceDate} from '../utils'
14
+
import {getRkey, niceDate, prettyNumber} from '../utils'
15
15
import {Container} from './container'
16
16
import {Embed} from './embed'
17
17
import {Link} from './link'
···
78
78
<div className="flex items-center gap-2 cursor-pointer">
79
79
<img src={likeIcon} className="w-5 h-5" />
80
80
<p className="font-bold text-neutral-500 mb-px">
81
-
{post.likeCount}
81
+
{prettyNumber(post.likeCount)}
82
82
</p>
83
83
</div>
84
84
)}
···
86
86
<div className="flex items-center gap-2 cursor-pointer">
87
87
<img src={repostIcon} className="w-5 h-5" />
88
88
<p className="font-bold text-neutral-500 mb-px">
89
-
{post.repostCount}
89
+
{prettyNumber(post.repostCount)}
90
90
</p>
91
91
</div>
92
92
)}
···
97
97
<div className="flex-1" />
98
98
<p className="cursor-pointer text-brand font-bold hover:underline hidden min-[450px]:inline">
99
99
{post.replyCount
100
-
? `Read ${post.replyCount} ${
100
+
? `Read ${prettyNumber(post.replyCount)} ${
101
101
post.replyCount > 1 ? 'replies' : 'reply'
102
102
} on Bluesky`
103
103
: `View on Bluesky`}
+10
bskyembed/src/utils.ts
+10
bskyembed/src/utils.ts
···
16
16
const at = new AtUri(uri)
17
17
return at.rkey
18
18
}
19
+
20
+
const formatter = new Intl.NumberFormat('en-US', {
21
+
notation: 'compact',
22
+
maximumFractionDigits: 1,
23
+
roundingMode: 'trunc',
24
+
})
25
+
26
+
export function prettyNumber(number: number) {
27
+
return formatter.format(number)
28
+
}
+1
-1
bskyembed/tsconfig.json
+1
-1
bskyembed/tsconfig.json
+1
-1
bskyembed/tsconfig.snippet.json
+1
-1
bskyembed/tsconfig.snippet.json
+4
-4
bskyembed/yarn.lock
+4
-4
bskyembed/yarn.lock
···
4024
4024
is-typed-array "^1.1.13"
4025
4025
possible-typed-array-names "^1.0.0"
4026
4026
4027
-
typescript@^4.0.5:
4028
-
version "4.9.5"
4029
-
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.9.5.tgz#095979f9bcc0d09da324d58d03ce8f8374cbe65a"
4030
-
integrity sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==
4027
+
typescript@^5.5.4:
4028
+
version "5.5.4"
4029
+
resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.5.4.tgz#d9852d6c82bad2d2eda4fd74a5762a8f5909e9ba"
4030
+
integrity sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==
4031
4031
4032
4032
uint8arrays@3.0.0:
4033
4033
version "3.0.0"