An ATproto social media client -- with an independent Appview.
6
fork

Configure Feed

Select the types of activity you want to include in your feed.

Darkmode fixes (#301) (#327)

* Fix dark mode rendering of 'follows you' pill

* Fix the darkmode coloring of the PTR

* Fix dark mode styles in dns instructions

* Only lint the src dir

authored by

Paul Frazee and committed by
GitHub
4f9e9e60 d9ed13ea

+90 -28
+1 -1
package.json
··· 14 14 "test-watch": "jest --watchAll", 15 15 "test-ci": "jest --ci --forceExit --reporters=default --reporters=jest-junit", 16 16 "test-coverage": "jest --coverage", 17 - "lint": "eslint . --ext .js,.jsx,.ts,.tsx", 17 + "lint": "eslint ./src --ext .js,.jsx,.ts,.tsx", 18 18 "e2e": "detox test --configuration ios.sim.debug --take-screenshots all" 19 19 }, 20 20 "dependencies": {
+4 -4
src/view/com/modals/ChangeHandle.tsx
··· 363 363 Add the following record to your domain: 364 364 </Text> 365 365 <View style={[styles.dnsTable, pal.btn]}> 366 - <Text type="md-medium" style={styles.dnsLabel}> 366 + <Text type="md-medium" style={[styles.dnsLabel, pal.text]}> 367 367 Domain: 368 368 </Text> 369 369 <View style={[styles.dnsValue]}> ··· 371 371 _atproto.{handle} 372 372 </Text> 373 373 </View> 374 - <Text type="md-medium" style={styles.dnsLabel}> 374 + <Text type="md-medium" style={[styles.dnsLabel, pal.text]}> 375 375 Type: 376 376 </Text> 377 377 <View style={[styles.dnsValue]}> ··· 379 379 TXT 380 380 </Text> 381 381 </View> 382 - <Text type="md-medium" style={styles.dnsLabel}> 382 + <Text type="md-medium" style={[styles.dnsLabel, pal.text]}> 383 383 Value: 384 384 </Text> 385 385 <View style={[styles.dnsValue]}> ··· 415 415 {isVerifying ? ( 416 416 <ActivityIndicator color="white" /> 417 417 ) : ( 418 - <Text type="xl-medium" style={[pal.textInverted, s.textCenter]}> 418 + <Text type="xl-medium" style={[s.white, s.textCenter]}> 419 419 {canSave ? `Update to ${handle}` : 'Verify DNS Record'} 420 420 </Text> 421 421 )}
+11 -3
src/view/com/notifications/Feed.tsx
··· 1 1 import React, {MutableRefObject} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 3 import {CenteredView, FlatList} from '../util/Views' 4 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 4 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 5 5 import {NotificationsViewModel} from 'state/models/notifications-view' 6 6 import {FeedItem} from './FeedItem' 7 7 import {NotificationFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' ··· 9 9 import {EmptyState} from '../util/EmptyState' 10 10 import {OnScrollCb} from 'lib/hooks/useOnMainScroll' 11 11 import {s} from 'lib/styles' 12 + import {usePalette} from 'lib/hooks/usePalette' 12 13 13 14 const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} 14 15 ··· 23 24 onPressTryAgain?: () => void 24 25 onScroll?: OnScrollCb 25 26 }) { 27 + const pal = usePalette('default') 26 28 const data = React.useMemo(() => { 27 29 let feedItems 28 30 if (view.hasLoaded) { ··· 98 100 keyExtractor={item => item._reactKey} 99 101 renderItem={renderItem} 100 102 ListFooterComponent={FeedFooter} 101 - refreshing={view.isRefreshing} 102 - onRefresh={onRefresh} 103 + refreshControl={ 104 + <RefreshControl 105 + refreshing={view.isRefreshing} 106 + onRefresh={onRefresh} 107 + tintColor={pal.colors.text} 108 + titleColor={pal.colors.text} 109 + /> 110 + } 103 111 onEndReached={onEndReached} 104 112 onEndReachedThreshold={0.6} 105 113 onScroll={onScroll}
+11 -3
src/view/com/post-thread/PostRepostedBy.tsx
··· 1 1 import React, {useEffect} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 3 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 4 4 import {CenteredView, FlatList} from '../util/Views' 5 5 import { 6 6 RepostedByViewModel, ··· 9 9 import {ProfileCardWithFollowBtn} from '../profile/ProfileCard' 10 10 import {ErrorMessage} from '../util/error/ErrorMessage' 11 11 import {useStores} from 'state/index' 12 + import {usePalette} from 'lib/hooks/usePalette' 12 13 13 14 export const PostRepostedBy = observer(function PostRepostedBy({ 14 15 uri, 15 16 }: { 16 17 uri: string 17 18 }) { 19 + const pal = usePalette('default') 18 20 const store = useStores() 19 21 const view = React.useMemo( 20 22 () => new RepostedByViewModel(store, {uri}), ··· 73 75 <FlatList 74 76 data={view.repostedBy} 75 77 keyExtractor={item => item.did} 76 - refreshing={view.isRefreshing} 77 - onRefresh={onRefresh} 78 + refreshControl={ 79 + <RefreshControl 80 + refreshing={view.isRefreshing} 81 + onRefresh={onRefresh} 82 + tintColor={pal.colors.text} 83 + titleColor={pal.colors.text} 84 + /> 85 + } 78 86 onEndReached={onEndReached} 79 87 renderItem={renderItem} 80 88 initialNumToRender={15}
+9 -3
src/view/com/post-thread/PostThread.tsx
··· 1 1 import React, {useRef} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 3 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 4 4 import {CenteredView, FlatList} from '../util/Views' 5 5 import { 6 6 PostThreadViewModel, ··· 120 120 initialNumToRender={posts.length} 121 121 keyExtractor={item => item._reactKey} 122 122 renderItem={renderItem} 123 - refreshing={isRefreshing} 124 - onRefresh={onRefresh} 123 + refreshControl={ 124 + <RefreshControl 125 + refreshing={isRefreshing} 126 + onRefresh={onRefresh} 127 + tintColor={pal.colors.text} 128 + titleColor={pal.colors.text} 129 + /> 130 + } 125 131 onLayout={onLayout} 126 132 onScrollToIndexFailed={onScrollToIndexFailed} 127 133 style={s.hContentRegion}
+11 -3
src/view/com/post-thread/PostVotedBy.tsx
··· 1 1 import React, {useEffect} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 3 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 4 4 import {CenteredView, FlatList} from '../util/Views' 5 5 import {VotesViewModel, VoteItem} from 'state/models/votes-view' 6 6 import {ErrorMessage} from '../util/error/ErrorMessage' 7 7 import {ProfileCardWithFollowBtn} from '../profile/ProfileCard' 8 8 import {useStores} from 'state/index' 9 + import {usePalette} from 'lib/hooks/usePalette' 9 10 10 11 export const PostVotedBy = observer(function PostVotedBy({ 11 12 uri, ··· 14 15 uri: string 15 16 direction: 'up' | 'down' 16 17 }) { 18 + const pal = usePalette('default') 17 19 const store = useStores() 18 20 const view = React.useMemo( 19 21 () => new VotesViewModel(store, {uri, direction}), ··· 68 70 <FlatList 69 71 data={view.votes} 70 72 keyExtractor={item => item.actor.did} 71 - refreshing={view.isRefreshing} 72 - onRefresh={onRefresh} 73 + refreshControl={ 74 + <RefreshControl 75 + refreshing={view.isRefreshing} 76 + onRefresh={onRefresh} 77 + tintColor={pal.colors.text} 78 + titleColor={pal.colors.text} 79 + /> 80 + } 73 81 onEndReached={onEndReached} 74 82 renderItem={renderItem} 75 83 initialNumToRender={15}
+12 -3
src/view/com/posts/Feed.tsx
··· 2 2 import {observer} from 'mobx-react-lite' 3 3 import { 4 4 ActivityIndicator, 5 - View, 5 + RefreshControl, 6 6 StyleProp, 7 7 StyleSheet, 8 + View, 8 9 ViewStyle, 9 10 } from 'react-native' 10 11 import {CenteredView, FlatList} from '../util/Views' ··· 16 17 import {OnScrollCb} from 'lib/hooks/useOnMainScroll' 17 18 import {s} from 'lib/styles' 18 19 import {useAnalytics} from 'lib/analytics' 20 + import {usePalette} from 'lib/hooks/usePalette' 19 21 20 22 const HEADER_ITEM = {_reactKey: '__header__'} 21 23 const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} ··· 42 44 testID?: string 43 45 headerOffset?: number 44 46 }) { 47 + const pal = usePalette('default') 45 48 const {track} = useAnalytics() 46 49 const [isRefreshing, setIsRefreshing] = React.useState(false) 47 50 ··· 134 137 keyExtractor={item => item._reactKey} 135 138 renderItem={renderItem} 136 139 ListFooterComponent={FeedFooter} 137 - refreshing={isRefreshing} 140 + refreshControl={ 141 + <RefreshControl 142 + refreshing={isRefreshing} 143 + onRefresh={onRefresh} 144 + tintColor={pal.colors.text} 145 + titleColor={pal.colors.text} 146 + /> 147 + } 138 148 contentContainerStyle={s.contentContainer} 139 149 onScroll={onScroll} 140 - onRefresh={onRefresh} 141 150 onEndReached={onEndReached} 142 151 onEndReachedThreshold={0.6} 143 152 removeClippedSubviews={true}
+3 -1
src/view/com/profile/ProfileCard.tsx
··· 62 62 {isFollowedBy && ( 63 63 <View style={s.flexRow}> 64 64 <View style={[s.mt5, pal.btn, styles.pill]}> 65 - <Text type="xs">Follows You</Text> 65 + <Text type="xs" style={pal.text}> 66 + Follows You 67 + </Text> 66 68 </View> 67 69 </View> 68 70 )}
+11 -3
src/view/com/profile/ProfileFollowers.tsx
··· 1 1 import React, {useEffect} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 3 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 4 4 import { 5 5 UserFollowersViewModel, 6 6 FollowerItem, ··· 9 9 import {ErrorMessage} from '../util/error/ErrorMessage' 10 10 import {ProfileCardWithFollowBtn} from './ProfileCard' 11 11 import {useStores} from 'state/index' 12 + import {usePalette} from 'lib/hooks/usePalette' 12 13 13 14 export const ProfileFollowers = observer(function ProfileFollowers({ 14 15 name, 15 16 }: { 16 17 name: string 17 18 }) { 19 + const pal = usePalette('default') 18 20 const store = useStores() 19 21 const view = React.useMemo( 20 22 () => new UserFollowersViewModel(store, {user: name}), ··· 73 75 <FlatList 74 76 data={view.followers} 75 77 keyExtractor={item => item.did} 76 - refreshing={view.isRefreshing} 77 - onRefresh={onRefresh} 78 + refreshControl={ 79 + <RefreshControl 80 + refreshing={view.isRefreshing} 81 + onRefresh={onRefresh} 82 + tintColor={pal.colors.text} 83 + titleColor={pal.colors.text} 84 + /> 85 + } 78 86 onEndReached={onEndReached} 79 87 renderItem={renderItem} 80 88 initialNumToRender={15}
+11 -3
src/view/com/profile/ProfileFollows.tsx
··· 1 1 import React, {useEffect} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {ActivityIndicator, StyleSheet, View} from 'react-native' 3 + import {ActivityIndicator, RefreshControl, StyleSheet, View} from 'react-native' 4 4 import {CenteredView, FlatList} from '../util/Views' 5 5 import {UserFollowsViewModel, FollowItem} from 'state/models/user-follows-view' 6 6 import {ErrorMessage} from '../util/error/ErrorMessage' 7 7 import {ProfileCardWithFollowBtn} from './ProfileCard' 8 8 import {useStores} from 'state/index' 9 + import {usePalette} from 'lib/hooks/usePalette' 9 10 10 11 export const ProfileFollows = observer(function ProfileFollows({ 11 12 name, 12 13 }: { 13 14 name: string 14 15 }) { 16 + const pal = usePalette('default') 15 17 const store = useStores() 16 18 const view = React.useMemo( 17 19 () => new UserFollowsViewModel(store, {user: name}), ··· 70 72 <FlatList 71 73 data={view.follows} 72 74 keyExtractor={item => item.did} 73 - refreshing={view.isRefreshing} 74 - onRefresh={onRefresh} 75 + refreshControl={ 76 + <RefreshControl 77 + refreshing={view.isRefreshing} 78 + onRefresh={onRefresh} 79 + tintColor={pal.colors.text} 80 + titleColor={pal.colors.text} 81 + /> 82 + } 75 83 onEndReached={onEndReached} 76 84 renderItem={renderItem} 77 85 initialNumToRender={15}
+6 -1
src/view/screens/Search.tsx
··· 201 201 onScroll={onMainScroll} 202 202 scrollEventThrottle={100} 203 203 refreshControl={ 204 - <RefreshControl refreshing={refreshing} onRefresh={onRefresh} /> 204 + <RefreshControl 205 + refreshing={refreshing} 206 + onRefresh={onRefresh} 207 + tintColor={pal.colors.text} 208 + titleColor={pal.colors.text} 209 + /> 205 210 }> 206 211 {foafsView.isLoading ? ( 207 212 <ProfileCardFeedLoadingPlaceholder />