diff options
author | Paul Frazee <pfrazee@gmail.com> | 2023-11-13 13:29:33 -0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-11-13 13:29:33 -0800 |
commit | a01463788d5e38ffca81fd0d50886838b7a3baba (patch) | |
tree | e7e27ca844515e4d9ce404e93dbcca926dea2c5c /src/view/com/lists/ListsList.tsx | |
parent | 82177613635c0f10f0af5be63db4b15131ccc89f (diff) | |
download | voidsky-a01463788d5e38ffca81fd0d50886838b7a3baba.tar.zst |
More profile refactor updates (#1886)
* Update the profile avatar lightbox * Update profile editor * Add dynamic likes tab * Add dynamic feeds and lists tabs * Implement lists listing on profiles
Diffstat (limited to 'src/view/com/lists/ListsList.tsx')
-rw-r--r-- | src/view/com/lists/ListsList.tsx | 160 |
1 files changed, 0 insertions, 160 deletions
diff --git a/src/view/com/lists/ListsList.tsx b/src/view/com/lists/ListsList.tsx deleted file mode 100644 index 100e0d609..000000000 --- a/src/view/com/lists/ListsList.tsx +++ /dev/null @@ -1,160 +0,0 @@ -import React from 'react' -import { - ActivityIndicator, - FlatList as RNFlatList, - RefreshControl, - StyleProp, - StyleSheet, - View, - ViewStyle, -} from 'react-native' -import {AppBskyGraphDefs as GraphDefs} from '@atproto/api' -import {ListCard} from './ListCard' -import {MyListsFilter, useMyListsQuery} from '#/state/queries/my-lists' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {Text} from '../util/text/Text' -import {useAnalytics} from 'lib/analytics/analytics' -import {usePalette} from 'lib/hooks/usePalette' -import {FlatList} from '../util/Views' -import {s} from 'lib/styles' -import {logger} from '#/logger' -import {Trans} from '@lingui/macro' -import {cleanError} from '#/lib/strings/errors' - -const LOADING = {_reactKey: '__loading__'} -const EMPTY = {_reactKey: '__empty__'} -const ERROR_ITEM = {_reactKey: '__error__'} -const LOAD_MORE_ERROR_ITEM = {_reactKey: '__load_more_error__'} - -export function ListsList({ - filter, - inline, - style, - renderItem, - testID, -}: { - filter: MyListsFilter - inline?: boolean - style?: StyleProp<ViewStyle> - renderItem?: (list: GraphDefs.ListView, index: number) => JSX.Element - testID?: string -}) { - const pal = usePalette('default') - const {track} = useAnalytics() - const [isRefreshing, setIsRefreshing] = React.useState(false) - const {data, isFetching, isFetched, isError, error, refetch} = - useMyListsQuery(filter) - const isEmpty = !isFetching && !data?.length - - const items = React.useMemo(() => { - let items: any[] = [] - if (isError && isEmpty) { - items = items.concat([ERROR_ITEM]) - } - if (!isFetched && isFetching) { - items = items.concat([LOADING]) - } else if (isEmpty) { - items = items.concat([EMPTY]) - } else { - items = items.concat(data) - } - return items - }, [isError, isEmpty, isFetched, isFetching, data]) - - // events - // = - - const onRefresh = React.useCallback(async () => { - track('Lists:onRefresh') - setIsRefreshing(true) - try { - await refetch() - } catch (err) { - logger.error('Failed to refresh lists', {error: err}) - } - setIsRefreshing(false) - }, [refetch, track, setIsRefreshing]) - - // rendering - // = - - const renderItemInner = React.useCallback( - ({item, index}: {item: any; index: number}) => { - if (item === EMPTY) { - return ( - <View - testID="listsEmpty" - style={[{padding: 18, borderTopWidth: 1}, pal.border]}> - <Text style={pal.textLight}> - <Trans>You have no lists.</Trans> - </Text> - </View> - ) - } else if (item === ERROR_ITEM) { - return ( - <ErrorMessage - message={cleanError(error)} - onPressTryAgain={onRefresh} - /> - ) - } else if (item === LOAD_MORE_ERROR_ITEM) { - return ( - <LoadMoreRetryBtn - label="There was an issue fetching your lists. Tap here to try again." - onPress={onRefresh} - /> - ) - } else if (item === LOADING) { - return ( - <View style={{padding: 20}}> - <ActivityIndicator /> - </View> - ) - } - return renderItem ? ( - renderItem(item, index) - ) : ( - <ListCard - list={item} - testID={`list-${item.name}`} - style={styles.item} - /> - ) - }, - [error, onRefresh, renderItem, pal], - ) - - const FlatListCom = inline ? RNFlatList : FlatList - return ( - <View testID={testID} style={style}> - {items.length > 0 && ( - <FlatListCom - testID={testID ? `${testID}-flatlist` : undefined} - data={items} - keyExtractor={(item: any) => item._reactKey} - renderItem={renderItemInner} - refreshControl={ - <RefreshControl - refreshing={isRefreshing} - onRefresh={onRefresh} - tintColor={pal.colors.text} - titleColor={pal.colors.text} - /> - } - contentContainerStyle={[s.contentContainer]} - removeClippedSubviews={true} - // @ts-ignore our .web version only -prf - desktopFixedHeight - /> - )} - </View> - ) -} - -const styles = StyleSheet.create({ - item: { - paddingHorizontal: 18, - paddingVertical: 4, - }, -}) |