diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/view/com/algos/AlgoItem.tsx | 3 | ||||
-rw-r--r-- | src/view/screens/CustomAlgorithms.tsx | 74 |
2 files changed, 43 insertions, 34 deletions
diff --git a/src/view/com/algos/AlgoItem.tsx b/src/view/com/algos/AlgoItem.tsx index 987bfd68d..e475624c5 100644 --- a/src/view/com/algos/AlgoItem.tsx +++ b/src/view/com/algos/AlgoItem.tsx @@ -11,6 +11,7 @@ import {AlgoItemModel} from 'state/models/feeds/algo/algo-item' const AlgoItem = observer( ({item, style}: {item: AlgoItemModel; style?: StyleProp<ViewStyle>}) => { const pal = usePalette('default') + return ( <View style={[styles.container, style]} key={item.data.uri}> <View style={[styles.headerContainer]}> @@ -19,7 +20,7 @@ const AlgoItem = observer( </View> <View style={[styles.headerTextContainer]}> <Text style={[pal.text, s.bold]}> - {item.data.displayName ?? 'Feed name'} + {item.data.displayName ? item.data.displayName : 'Feed name'} </Text> <Text style={[pal.textLight, styles.description]}> {item.data.description ?? diff --git a/src/view/screens/CustomAlgorithms.tsx b/src/view/screens/CustomAlgorithms.tsx index 05951f98e..b838660df 100644 --- a/src/view/screens/CustomAlgorithms.tsx +++ b/src/view/screens/CustomAlgorithms.tsx @@ -44,45 +44,46 @@ const CustomAlgorithms = withAuthRequired( ) return ( - <CenteredView style={{flex: 1}}> + <CenteredView style={[s.flex1]}> <ViewHeader title="Custom Algorithms" showOnDesktop /> - {!savedFeeds.hasContent || savedFeeds.isEmpty ? ( - <View style={[pal.border, !isDesktopWeb && s.flex1]}> - <View style={[pal.viewLight]}> + <FlatList + style={[!isDesktopWeb && s.flex1]} + data={savedFeeds.feeds} + keyExtractor={item => item.data.uri} + refreshControl={ + <RefreshControl + refreshing={savedFeeds.isRefreshing} + onRefresh={() => savedFeeds.refresh()} + tintColor={pal.colors.text} + titleColor={pal.colors.text} + /> + } + onEndReached={() => savedFeeds.loadMore()} + renderItem={({item}) => <AlgoItem key={item.data.uri} item={item} />} + initialNumToRender={15} + ListFooterComponent={() => ( + <View style={styles.footer}> + {savedFeeds.isLoading && <ActivityIndicator />} + </View> + )} + ListEmptyComponent={() => ( + <View + style={[ + pal.border, + !isDesktopWeb && s.flex1, + pal.viewLight, + styles.empty, + ]}> <Text type="lg" style={[pal.text]}> You don't have any saved feeds. To save a feed, click the save button when a custom feed or algorithm shows up. </Text> </View> - </View> - ) : ( - <FlatList - style={[!isDesktopWeb && s.flex1]} - data={savedFeeds.feeds} - keyExtractor={item => item.data.uri} - refreshControl={ - <RefreshControl - refreshing={savedFeeds.isRefreshing} - onRefresh={() => savedFeeds.refresh()} - tintColor={pal.colors.text} - titleColor={pal.colors.text} - /> - } - onEndReached={() => savedFeeds.loadMore()} - renderItem={({item}) => ( - <AlgoItem key={item.data.uri} item={item} /> - )} - initialNumToRender={15} - ListFooterComponent={() => ( - <View style={styles.footer}> - {savedFeeds.isLoading && <ActivityIndicator />} - </View> - )} - extraData={savedFeeds.isLoading} - // @ts-ignore our .web version only -prf - desktopFixedHeight - /> - )} + )} + extraData={savedFeeds.isLoading} + // @ts-ignore our .web version only -prf + desktopFixedHeight + /> </CenteredView> ) }), @@ -94,4 +95,11 @@ const styles = StyleSheet.create({ footer: { paddingVertical: 20, }, + empty: { + paddingHorizontal: 20, + paddingVertical: 20, + borderRadius: 16, + marginHorizontal: 24, + marginTop: 10, + }, }) |