forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Use consistent spinners for loading screens (#2611)
* Use consistent spinners for loading screens
* Consolidate into LoadingScreen
+31
-46
+2
-5
src/view/com/post-thread/PostLikedBy.tsx
+2
-5
src/view/com/post-thread/PostLikedBy.tsx
···
6
6
import {ErrorMessage} from '../util/error/ErrorMessage'
7
7
import {ProfileCardWithFollowBtn} from '../profile/ProfileCard'
8
8
import {logger} from '#/logger'
9
+
import {LoadingScreen} from '../util/LoadingScreen'
9
10
import {useResolveUriQuery} from '#/state/queries/resolve-uri'
10
11
import {usePostLikedByQuery} from '#/state/queries/post-liked-by'
11
12
import {cleanError} from '#/lib/strings/errors'
···
60
61
}, [])
61
62
62
63
if (isFetchingResolvedUri || !isFetched) {
63
-
return (
64
-
<CenteredView>
65
-
<ActivityIndicator />
66
-
</CenteredView>
67
-
)
64
+
return <LoadingScreen />
68
65
}
69
66
70
67
// error
+2
-5
src/view/com/post-thread/PostRepostedBy.tsx
+2
-5
src/view/com/post-thread/PostRepostedBy.tsx
···
6
6
import {ProfileCardWithFollowBtn} from '../profile/ProfileCard'
7
7
import {ErrorMessage} from '../util/error/ErrorMessage'
8
8
import {logger} from '#/logger'
9
+
import {LoadingScreen} from '../util/LoadingScreen'
9
10
import {useResolveUriQuery} from '#/state/queries/resolve-uri'
10
11
import {usePostRepostedByQuery} from '#/state/queries/post-reposted-by'
11
12
import {cleanError} from '#/lib/strings/errors'
···
61
62
)
62
63
63
64
if (isFetchingResolvedUri || !isFetched) {
64
-
return (
65
-
<CenteredView>
66
-
<ActivityIndicator />
67
-
</CenteredView>
68
-
)
65
+
return <LoadingScreen />
69
66
}
70
67
71
68
// error
+2
-7
src/view/com/post-thread/PostThread.tsx
+2
-7
src/view/com/post-thread/PostThread.tsx
···
8
8
} from 'react-native'
9
9
import {AppBskyFeedDefs} from '@atproto/api'
10
10
import {CenteredView} from '../util/Views'
11
+
import {LoadingScreen} from '../util/LoadingScreen'
11
12
import {List, ListMethods} from '../util/List'
12
13
import {
13
14
FontAwesomeIcon,
···
125
126
return <PostThreadBlocked />
126
127
}
127
128
if (!thread || isLoading || !preferences) {
128
-
return (
129
-
<CenteredView>
130
-
<View style={s.p20}>
131
-
<ActivityIndicator size="large" />
132
-
</View>
133
-
</CenteredView>
134
-
)
129
+
return <LoadingScreen />
135
130
}
136
131
return (
137
132
<PostThreadLoaded
+2
-5
src/view/com/profile/ProfileFollowers.tsx
+2
-5
src/view/com/profile/ProfileFollowers.tsx
···
2
2
import {ActivityIndicator, StyleSheet, View} from 'react-native'
3
3
import {AppBskyActorDefs as ActorDefs} from '@atproto/api'
4
4
import {CenteredView} from '../util/Views'
5
+
import {LoadingScreen} from '../util/LoadingScreen'
5
6
import {List} from '../util/List'
6
7
import {ErrorMessage} from '../util/error/ErrorMessage'
7
8
import {ProfileCardWithFollowBtn} from './ProfileCard'
···
62
63
)
63
64
64
65
if (isFetchingDid || !isFetched) {
65
-
return (
66
-
<CenteredView>
67
-
<ActivityIndicator />
68
-
</CenteredView>
69
-
)
66
+
return <LoadingScreen />
70
67
}
71
68
72
69
// error
+2
-5
src/view/com/profile/ProfileFollows.tsx
+2
-5
src/view/com/profile/ProfileFollows.tsx
···
2
2
import {ActivityIndicator, StyleSheet, View} from 'react-native'
3
3
import {AppBskyActorDefs as ActorDefs} from '@atproto/api'
4
4
import {CenteredView} from '../util/Views'
5
+
import {LoadingScreen} from '../util/LoadingScreen'
5
6
import {List} from '../util/List'
6
7
import {ErrorMessage} from '../util/error/ErrorMessage'
7
8
import {ProfileCardWithFollowBtn} from './ProfileCard'
···
62
63
)
63
64
64
65
if (isFetchingDid || !isFetched) {
65
-
return (
66
-
<CenteredView>
67
-
<ActivityIndicator />
68
-
</CenteredView>
69
-
)
66
+
return <LoadingScreen />
70
67
}
71
68
72
69
// error
+14
src/view/com/util/LoadingScreen.tsx
+14
src/view/com/util/LoadingScreen.tsx
···
1
+
import React from 'react'
2
+
import {ActivityIndicator, View} from 'react-native'
3
+
import {s} from 'lib/styles'
4
+
import {CenteredView} from './Views'
5
+
6
+
export function LoadingScreen() {
7
+
return (
8
+
<CenteredView>
9
+
<View style={s.p20}>
10
+
<ActivityIndicator size="large" />
11
+
</View>
12
+
</CenteredView>
13
+
)
14
+
}
+4
-13
src/view/screens/ProfileFeed.tsx
+4
-13
src/view/screens/ProfileFeed.tsx
···
1
1
import React, {useMemo, useCallback} from 'react'
2
-
import {Dimensions, StyleSheet, View, ActivityIndicator} from 'react-native'
2
+
import {Dimensions, StyleSheet, View} from 'react-native'
3
3
import {NativeStackScreenProps} from '@react-navigation/native-stack'
4
4
import {useIsFocused, useNavigation} from '@react-navigation/native'
5
5
import {useQueryClient} from '@tanstack/react-query'
···
21
21
import {LoadLatestBtn} from 'view/com/util/load-latest/LoadLatestBtn'
22
22
import {FAB} from 'view/com/util/fab/FAB'
23
23
import {EmptyState} from 'view/com/util/EmptyState'
24
+
import {LoadingScreen} from 'view/com/util/LoadingScreen'
24
25
import * as Toast from 'view/com/util/Toast'
25
26
import {useSetTitle} from 'lib/hooks/useSetTitle'
26
27
import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed'
···
118
119
return resolvedUri ? (
119
120
<ProfileFeedScreenIntermediate feedUri={resolvedUri.uri} />
120
121
) : (
121
-
<CenteredView>
122
-
<View style={s.p20}>
123
-
<ActivityIndicator size="large" />
124
-
</View>
125
-
</CenteredView>
122
+
<LoadingScreen />
126
123
)
127
124
}
128
125
···
131
128
const {data: info} = useFeedSourceInfoQuery({uri: feedUri})
132
129
133
130
if (!preferences || !info) {
134
-
return (
135
-
<CenteredView>
136
-
<View style={s.p20}>
137
-
<ActivityIndicator size="large" />
138
-
</View>
139
-
</CenteredView>
140
-
)
131
+
return <LoadingScreen />
141
132
}
142
133
143
134
return (
+3
-6
src/view/screens/ProfileList.tsx
+3
-6
src/view/screens/ProfileList.tsx
···
1
1
import React, {useCallback, useMemo} from 'react'
2
-
import {ActivityIndicator, Pressable, StyleSheet, View} from 'react-native'
2
+
import {Pressable, StyleSheet, View} from 'react-native'
3
3
import {useFocusEffect, useIsFocused} from '@react-navigation/native'
4
4
import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types'
5
5
import {useNavigation} from '@react-navigation/native'
···
13
13
import {NativeDropdown, DropdownItem} from 'view/com/util/forms/NativeDropdown'
14
14
import {CenteredView} from 'view/com/util/Views'
15
15
import {EmptyState} from 'view/com/util/EmptyState'
16
+
import {LoadingScreen} from 'view/com/util/LoadingScreen'
16
17
import {RichText} from 'view/com/util/text/RichText'
17
18
import {Button} from 'view/com/util/forms/Button'
18
19
import {TextLink} from 'view/com/util/Link'
···
97
98
return resolvedUri && list ? (
98
99
<ProfileListScreenLoaded {...props} uri={resolvedUri.uri} list={list} />
99
100
) : (
100
-
<CenteredView>
101
-
<View style={s.p20}>
102
-
<ActivityIndicator size="large" />
103
-
</View>
104
-
</CenteredView>
101
+
<LoadingScreen />
105
102
)
106
103
}
107
104