Profile cleanup (react-query refactor) (#1891)

* Only fetch profile tab content when focused

* Fix keys

* Add missing behaviors to post tabs

* Delete old profile mobx model

src/view/com/feeds/ProfileFeedgens.tsx

@@ -35,6 +35,7 @@ export function ProfileFeedgens({
   onScroll,
   scrollEventThrottle,
   headerOffset,
+  enabled,
   style,
   testID,
 }: {
@@ -43,12 +44,14 @@ export function ProfileFeedgens({
   onScroll?: OnScrollHandler
   scrollEventThrottle?: number
   headerOffset: number
+  enabled?: boolean
   style?: StyleProp<ViewStyle>
   testID?: string
 }) {
   const pal = usePalette('default')
   const theme = useTheme()
   const [isPTRing, setIsPTRing] = React.useState(false)
+  const opts = React.useMemo(() => ({enabled}), [enabled])
   const {
     data,
     isFetching,
@@ -58,7 +61,7 @@ export function ProfileFeedgens({
     isError,
     error,
     refetch,
-  } = useProfileFeedgensQuery(did)
+  } = useProfileFeedgensQuery(did, opts)
   const isEmpty = !isFetching && !data?.pages[0]?.feeds.length
   const {data: preferences} = usePreferencesQuery()
 
@@ -163,7 +166,7 @@ export function ProfileFeedgens({
         testID={testID ? `${testID}-flatlist` : undefined}
         ref={scrollElRef}
         data={items}
-        keyExtractor={(item: any) => item._reactKey}
+        keyExtractor={(item: any) => item._reactKey || item.uri}
         renderItem={renderItemInner}
         refreshControl={
           <RefreshControl

src/view/com/lists/ProfileLists.tsx

@@ -34,6 +34,7 @@ export function ProfileLists({
   onScroll,
   scrollEventThrottle,
   headerOffset,
+  enabled,
   style,
   testID,
 }: {
@@ -42,6 +43,7 @@ export function ProfileLists({
   onScroll?: OnScrollHandler
   scrollEventThrottle?: number
   headerOffset: number
+  enabled?: boolean
   style?: StyleProp<ViewStyle>
   testID?: string
 }) {
@@ -49,6 +51,7 @@ export function ProfileLists({
   const theme = useTheme()
   const {track} = useAnalytics()
   const [isPTRing, setIsPTRing] = React.useState(false)
+  const opts = React.useMemo(() => ({enabled}), [enabled])
   const {
     data,
     isFetching,
@@ -58,7 +61,7 @@ export function ProfileLists({
     isError,
     error,
     refetch,
-  } = useProfileListsQuery(did)
+  } = useProfileListsQuery(did, opts)
   const isEmpty = !isFetching && !data?.pages[0]?.lists.length
 
   const items = React.useMemo(() => {

src/view/com/pager/PagerWithHeader.tsx

@@ -24,6 +24,7 @@ const SCROLLED_DOWN_LIMIT = 200
 
 interface PagerWithHeaderChildParams {
   headerHeight: number
+  isFocused: boolean
   onScroll: OnScrollHandler
   isScrolledDown: boolean
   scrollElRef: React.MutableRefObject<FlatList<any> | ScrollView | null>
@@ -202,6 +203,7 @@ export const PagerWithHeader = React.forwardRef<PagerRef, PagerWithHeaderProps>(
                 <PagerItem
                   headerHeight={headerHeight}
                   isReady={isReady}
+                  isFocused={i === currentPage}
                   isScrolledDown={isScrolledDown}
                   onScrollWorklet={i === currentPage ? onScrollWorklet : noop}
                   registerRef={(r: AnimatedRef<any>) => registerRef(r, i)}
@@ -218,12 +220,14 @@ export const PagerWithHeader = React.forwardRef<PagerRef, PagerWithHeaderProps>(
 function PagerItem({
   headerHeight,
   isReady,
+  isFocused,
   isScrolledDown,
   onScrollWorklet,
   renderTab,
   registerRef,
 }: {
   headerHeight: number
+  isFocused: boolean
   isReady: boolean
   isScrolledDown: boolean
   registerRef: (scrollRef: AnimatedRef<any>) => void
@@ -244,6 +248,7 @@ function PagerItem({
 
   return renderTab({
     headerHeight,
+    isFocused,
     isScrolledDown,
     onScroll: scrollHandler,
     scrollElRef: scrollElRef as React.MutableRefObject<