faet: Only reload the feed in the shorts page.

Author: dohooo

.changeset/weak-flowers-dream.md

@@ -0,0 +1,5 @@
+---
+"xlog": patch
+---
+
+Only reload the feed in the shorts page.

src/components/FeedList/useFeedList.tsx

@@ -32,16 +32,17 @@ export interface Props {
   characterId?: number
   ListHeaderComponent?: React.ReactNode
   visibility?: PageVisibilityEnum
+  updateFeedAfterPost?: boolean
 }
 
 export const useFeedList = <T extends {}>(props: Props & T) => {
-  const { ListHeaderComponent, visibility, handle, type, searchKeyword, contentContainerStyle = {}, tags = [], topic, daysInterval = 7, onScroll, characterId, ...restProps } = props;
+  const { ListHeaderComponent, updateFeedAfterPost = false, visibility, handle, type, searchKeyword, contentContainerStyle = {}, tags = [], topic, daysInterval = 7, onScroll, characterId, ...restProps } = props;
   const { width } = useWindowDimensions();
   const { feedList, feed } = useFeedData(props);
   const [isRefetching, setIsRefetching] = useState<boolean>(false);
   const listRef = useRef<MasonryFlashListRef<ExpandedNote>>(null);
   const { isDarkMode } = useThemeStore();
-  const { isProcessing } = usePostIndicatorStore();
+  const { subscribe } = usePostIndicatorStore();
   const i18nC = useTranslation("common");
 
   useEffect(() => {
@@ -75,10 +76,20 @@ export const useFeedList = <T extends {}>(props: Props & T) => {
   }, [feed.refetch, isRefetching]);
 
   useEffect(() => {
-    if (!isProcessing) {
-      onRefetch();
+    if (!updateFeedAfterPost) {
+      return;
     }
-  }, [isProcessing]);
+
+    const unsubscribe = subscribe((isProcessing) => {
+      if (!isProcessing) {
+        onRefetch();
+      }
+    });
+
+    return () => {
+      unsubscribe();
+    };
+  }, [subscribe, updateFeedAfterPost]);
 
   return useMemo<MasonryFlashListProps<any>>(() => ({
     data: feedList,

src/hooks/use-post-indicator-store.ts

@@ -1,7 +1,17 @@
-import { useContext } from "react";
+import { useCallback, useContext } from "react";
 
 import { PostIndicatorContext } from "@/context/post-indicator-context";
+import { postIndicatorSubscribers } from "@/providers/post-indicator-provider";
 
 export const usePostIndicatorStore = () => {
-  return useContext(PostIndicatorContext);
+  const { isProcessing, addPostTask } = useContext(PostIndicatorContext);
+
+  const subscribe = useCallback((callback) => {
+    postIndicatorSubscribers.add(callback);
+    return () => {
+      postIndicatorSubscribers.delete(callback);
+    };
+  }, []);
+
+  return { isProcessing, addPostTask, subscribe };
 };

src/pages/Feed/index.tsx

@@ -94,6 +94,7 @@ export const FeedPage: FC<NativeStackScreenProps<HomeBottomTabsParamList, "Feed"
           <MasonryFeedList
             daysInterval={daysInterval}
             type={currentFeedType}
+            updateFeedAfterPost={isShorts}
             ListHeaderComponent={!isShorts && <ShortsExplorerBanner/>}
             onScroll={onScroll}
             contentContainerStyle={{

src/providers/post-indicator-provider.tsx

@@ -25,6 +25,8 @@ interface PostIndicatorProviderProps extends React.PropsWithChildren {
 
 }
 
+export const postIndicatorSubscribers: Set<(isProcessing: boolean) => void> = new Set();
+
 export function PostIndicatorProvider({ children }: PostIndicatorProviderProps) {
   const [task, setTask] = React.useState<TaskType>(null);
   const [isProcessing, setIsProcessing] = React.useState(false);
@@ -35,6 +37,7 @@ export function PostIndicatorProvider({ children }: PostIndicatorProviderProps)
 
   const onPublish = React.useCallback(() => {
     setIsProcessing(false);
+    postIndicatorSubscribers.forEach(callback => callback(false));
   }, []);
 
   const addPostTask = React.useCallback((params: TaskType) => {