forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
More exact counts (#7059)
* post liked by
* rm unnecessary layout.center
* do post quotes/reposts
* set height of header to prevent layout shifts
authored by
Samuel Newman
and committed by
GitHub
48346edd
89c6ca94
+86
-33
+2
-2
src/components/Layout/Header/index.tsx
+2
-2
src/components/Layout/Header/index.tsx
+24
-5
src/screens/Post/PostLikedBy.tsx
+24
-5
src/screens/Post/PostLikedBy.tsx
···
1
1
import React from 'react'
2
-
import {msg} from '@lingui/macro'
3
-
import {useLingui} from '@lingui/react'
2
+
import {Plural, Trans} from '@lingui/macro'
4
3
import {useFocusEffect} from '@react-navigation/native'
5
4
6
5
import {CommonNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
7
6
import {makeRecordUri} from '#/lib/strings/url-helpers'
7
+
import {usePostThreadQuery} from '#/state/queries/post-thread'
8
8
import {useSetMinimalShellMode} from '#/state/shell'
9
9
import {PostLikedBy as PostLikedByComponent} from '#/view/com/post-thread/PostLikedBy'
10
-
import {ViewHeader} from '#/view/com/util/ViewHeader'
11
10
import * as Layout from '#/components/Layout'
12
11
13
12
type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostLikedBy'>
···
15
14
const setMinimalShellMode = useSetMinimalShellMode()
16
15
const {name, rkey} = route.params
17
16
const uri = makeRecordUri(name, 'app.bsky.feed.post', rkey)
18
-
const {_} = useLingui()
17
+
const {data: post} = usePostThreadQuery(uri)
18
+
19
+
let likeCount
20
+
if (post?.thread.type === 'post') {
21
+
likeCount = post.thread.post.likeCount
22
+
}
19
23
20
24
useFocusEffect(
21
25
React.useCallback(() => {
···
25
29
26
30
return (
27
31
<Layout.Screen>
28
-
<ViewHeader title={_(msg`Liked By`)} />
32
+
<Layout.Header.Outer>
33
+
<Layout.Header.BackButton />
34
+
<Layout.Header.Content>
35
+
{post && (
36
+
<>
37
+
<Layout.Header.TitleText>
38
+
<Trans>Liked By</Trans>
39
+
</Layout.Header.TitleText>
40
+
<Layout.Header.SubtitleText>
41
+
<Plural value={likeCount ?? 0} one="# like" other="# likes" />
42
+
</Layout.Header.SubtitleText>
43
+
</>
44
+
)}
45
+
</Layout.Header.Content>
46
+
<Layout.Header.Slot />
47
+
</Layout.Header.Outer>
29
48
<PostLikedByComponent uri={uri} />
30
49
</Layout.Screen>
31
50
)
+29
-10
src/screens/Post/PostQuotes.tsx
+29
-10
src/screens/Post/PostQuotes.tsx
···
1
1
import React from 'react'
2
-
import {msg} from '@lingui/macro'
3
-
import {useLingui} from '@lingui/react'
2
+
import {Plural, Trans} from '@lingui/macro'
4
3
import {useFocusEffect} from '@react-navigation/native'
5
4
6
5
import {CommonNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
7
6
import {makeRecordUri} from '#/lib/strings/url-helpers'
8
-
import {isWeb} from '#/platform/detection'
7
+
import {usePostThreadQuery} from '#/state/queries/post-thread'
9
8
import {useSetMinimalShellMode} from '#/state/shell'
10
9
import {PostQuotes as PostQuotesComponent} from '#/view/com/post-thread/PostQuotes'
11
-
import {ViewHeader} from '#/view/com/util/ViewHeader'
12
-
import {CenteredView} from '#/view/com/util/Views'
13
10
import * as Layout from '#/components/Layout'
14
11
15
12
type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostQuotes'>
···
17
14
const setMinimalShellMode = useSetMinimalShellMode()
18
15
const {name, rkey} = route.params
19
16
const uri = makeRecordUri(name, 'app.bsky.feed.post', rkey)
20
-
const {_} = useLingui()
17
+
const {data: post} = usePostThreadQuery(uri)
18
+
19
+
let quoteCount
20
+
if (post?.thread.type === 'post') {
21
+
quoteCount = post.thread.post.quoteCount
22
+
}
21
23
22
24
useFocusEffect(
23
25
React.useCallback(() => {
···
27
29
28
30
return (
29
31
<Layout.Screen>
30
-
<CenteredView sideBorders={true}>
31
-
<ViewHeader title={_(msg`Quotes`)} showBorder={!isWeb} />
32
-
<PostQuotesComponent uri={uri} />
33
-
</CenteredView>
32
+
<Layout.Header.Outer>
33
+
<Layout.Header.BackButton />
34
+
<Layout.Header.Content>
35
+
{post && (
36
+
<>
37
+
<Layout.Header.TitleText>
38
+
<Trans>Quotes</Trans>
39
+
</Layout.Header.TitleText>
40
+
<Layout.Header.SubtitleText>
41
+
<Plural
42
+
value={quoteCount ?? 0}
43
+
one="# quote"
44
+
other="# quotes"
45
+
/>
46
+
</Layout.Header.SubtitleText>
47
+
</>
48
+
)}
49
+
</Layout.Header.Content>
50
+
<Layout.Header.Slot />
51
+
</Layout.Header.Outer>
52
+
<PostQuotesComponent uri={uri} />
34
53
</Layout.Screen>
35
54
)
36
55
}
+29
-10
src/screens/Post/PostRepostedBy.tsx
+29
-10
src/screens/Post/PostRepostedBy.tsx
···
1
1
import React from 'react'
2
-
import {msg} from '@lingui/macro'
3
-
import {useLingui} from '@lingui/react'
2
+
import {Plural, Trans} from '@lingui/macro'
4
3
import {useFocusEffect} from '@react-navigation/native'
5
4
6
5
import {CommonNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
7
6
import {makeRecordUri} from '#/lib/strings/url-helpers'
8
-
import {isWeb} from '#/platform/detection'
7
+
import {usePostThreadQuery} from '#/state/queries/post-thread'
9
8
import {useSetMinimalShellMode} from '#/state/shell'
10
9
import {PostRepostedBy as PostRepostedByComponent} from '#/view/com/post-thread/PostRepostedBy'
11
-
import {ViewHeader} from '#/view/com/util/ViewHeader'
12
-
import {CenteredView} from '#/view/com/util/Views'
13
10
import * as Layout from '#/components/Layout'
14
11
15
12
type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostRepostedBy'>
···
17
14
const {name, rkey} = route.params
18
15
const uri = makeRecordUri(name, 'app.bsky.feed.post', rkey)
19
16
const setMinimalShellMode = useSetMinimalShellMode()
20
-
const {_} = useLingui()
17
+
const {data: post} = usePostThreadQuery(uri)
18
+
19
+
let quoteCount
20
+
if (post?.thread.type === 'post') {
21
+
quoteCount = post.thread.post.repostCount
22
+
}
21
23
22
24
useFocusEffect(
23
25
React.useCallback(() => {
···
27
29
28
30
return (
29
31
<Layout.Screen>
30
-
<CenteredView sideBorders={true}>
31
-
<ViewHeader title={_(msg`Reposted By`)} showBorder={!isWeb} />
32
-
<PostRepostedByComponent uri={uri} />
33
-
</CenteredView>
32
+
<Layout.Header.Outer>
33
+
<Layout.Header.BackButton />
34
+
<Layout.Header.Content>
35
+
{post && (
36
+
<>
37
+
<Layout.Header.TitleText>
38
+
<Trans>Reposted By</Trans>
39
+
</Layout.Header.TitleText>
40
+
<Layout.Header.SubtitleText>
41
+
<Plural
42
+
value={quoteCount ?? 0}
43
+
one="# reposts"
44
+
other="# reposts"
45
+
/>
46
+
</Layout.Header.SubtitleText>
47
+
</>
48
+
)}
49
+
</Layout.Header.Content>
50
+
<Layout.Header.Slot />
51
+
</Layout.Header.Outer>
52
+
<PostRepostedByComponent uri={uri} />
34
53
</Layout.Screen>
35
54
)
36
55
}
+1
-3
src/screens/Profile/ProfileFollowers.tsx
+1
-3
src/screens/Profile/ProfileFollowers.tsx
+1
-3
src/screens/Profile/ProfileFollows.tsx
+1
-3
src/screens/Profile/ProfileFollows.tsx