refactor: remove suggested creators, deprecated (#2496)

showtime-xyz · Nov 1, 2023 · e02aaee · e02aaee
1 parent 2ea78ff
commit e02aaee
Show file tree

Hide file tree

Showing 7 changed files with 9 additions and 329 deletions.
diff --git a/packages/app/components/creator-channels/channels.web.tsx b/packages/app/components/creator-channels/channels.web.tsx
@@ -25,7 +25,6 @@ import { breakpoints } from "design-system/theme";
 import {
   useJoinedChannelsList,
   useOwnedChannelsList,
-  useSuggestedChannelsList,
 } from "./hooks/use-channels-list";
 import { useJoinChannel } from "./hooks/use-join-channel";
 import { CreatorChannelsList as CreatorChannelsListMobile } from "./list";
@@ -46,12 +45,6 @@ const channelsSection = {
     "Get exclusive updates, presale access and unreleased content from your favorite creators.",
 };
 
-const suggestedChannelsSection = {
-  type: "section",
-  title: "Popular creators",
-  tw: "text-xl",
-};
-
 const CreatorChannelsHeader = memo(
   ({
     title,
@@ -330,10 +323,6 @@ export const CreatorChannels = memo(() => {
     isLoading: isLoadingJoinedChannels,
   } = useJoinedChannelsList();
 
-  // suggested channels
-  const { data: suggestedChannelsData, isLoading: isLoadingSuggestedChannels } =
-    useSuggestedChannelsList();
-
   // since we're quering two different endpoints, and based on the amount of data from the first endpoint
   // we have to transform our data a bit and decide if we build a section list or a single FlashList
   // we're going to useMemo for that and return the data in the format we need
@@ -353,16 +342,6 @@ export const CreatorChannels = memo(() => {
               ...joinedChannelsData,
             ]
           : []),
-        // check if we have any suggested channels, if we do, we're going to add a section for them (+ the suggested channels)
-        ...(suggestedChannelsData.length > 0
-          ? [
-              suggestedChannelsSection,
-              ...suggestedChannelsData.map((suggestedChannel) => ({
-                ...suggestedChannel,
-                itemType: "creator",
-              })),
-            ]
-          : []),
       ];
     } else {
       return [
@@ -378,11 +357,7 @@ export const CreatorChannels = memo(() => {
         ...joinedChannelsData,
       ];
     }
-  }, [
-    joinedChannelsData,
-    ownedChannelsData,
-    suggestedChannelsData,
-  ]) as CreatorChannelsListItemProps[];
+  }, [joinedChannelsData, ownedChannelsData]) as CreatorChannelsListItemProps[];
 
   const renderItem = useCallback(({ item }: CreatorChannelsListProps) => {
     if (item.type === "section") {
@@ -403,11 +378,7 @@ export const CreatorChannels = memo(() => {
   }, []);
 
   const ListFooterComponent = useCallback(() => {
-    if (
-      isLoadingJoinedChannels ||
-      isLoadingOwnChannels ||
-      isLoadingSuggestedChannels
-    ) {
+    if (isLoadingJoinedChannels || isLoadingOwnChannels) {
       return <CCSkeleton />;
     }
 
@@ -427,7 +398,6 @@ export const CreatorChannels = memo(() => {
   }, [
     isLoadingJoinedChannels,
     isLoadingOwnChannels,
-    isLoadingSuggestedChannels,
     isLoadingMoreJoinedChannels,
   ]);
   if (!isLgWidth) {
@@ -463,9 +433,7 @@ export const CreatorChannels = memo(() => {
         <InfiniteScrollList
           useWindowScroll={false}
           data={
-            isLoadingOwnChannels ||
-            isLoadingJoinedChannels ||
-            isLoadingSuggestedChannels
+            isLoadingOwnChannels || isLoadingJoinedChannels
               ? []
               : transformedData
           }

diff --git a/packages/app/components/creator-channels/hooks/use-channels-list.ts b/packages/app/components/creator-channels/hooks/use-channels-list.ts
@@ -81,37 +81,3 @@ export const useJoinedChannelsList = () => {
     data: newData,
   };
 };
-
-export const useSuggestedChannelsList = (params?: { pageSize?: number }) => {
-  const pageSize = params?.pageSize || PAGE_SIZE;
-  const channelsFetcher = useCallback(
-    (index: number, previousPageData: []) => {
-      if (previousPageData && !previousPageData.length) return null;
-      return `/v1/channels/suggested?page=${index + 1}&limit=${pageSize}`;
-    },
-    [pageSize]
-  );
-
-  const queryState = useInfiniteListQuerySWR<CreatorChannel[]>(
-    channelsFetcher,
-    {
-      pageSize,
-    }
-  );
-  const newData = useMemo(() => {
-    let newData: CreatorChannel[] = [];
-    if (queryState.data) {
-      queryState.data.forEach((p) => {
-        if (p) {
-          newData = newData.concat(p);
-        }
-      });
-    }
-    return newData;
-  }, [queryState.data]);
-
-  return {
-    ...queryState,
-    data: newData,
-  };
-};
diff --git a/packages/app/components/creator-channels/hooks/use-join-channel.ts b/packages/app/components/creator-channels/hooks/use-join-channel.ts
@@ -7,10 +7,7 @@ import { Logger } from "app/lib/logger";
 import { useLogInPromise } from "app/lib/login-promise";
 import { captureException } from "app/lib/sentry";
 
-import {
-  useJoinedChannelsList,
-  useSuggestedChannelsList,
-} from "./use-channels-list";
+import { useJoinedChannelsList } from "./use-channels-list";
 
 async function joinChannel(
   url: string,
@@ -34,7 +31,6 @@ export const useJoinChannel = () => {
     joinChannel
   );
   const joinedChannels = useJoinedChannelsList();
-  const suggestedChannels = useSuggestedChannelsList();
   const { onboardingPromise } = useOnboardingPromise();
 
   const handleSubmit = useStableCallback(
@@ -47,7 +43,6 @@ export const useJoinChannel = () => {
         captureException(e);
         Logger.error(e);
       } finally {
-        suggestedChannels.mutate();
         joinedChannels.mutate();
       }
     }

diff --git a/packages/app/components/creator-channels/hooks/use-leave-channel.ts b/packages/app/components/creator-channels/hooks/use-leave-channel.ts
@@ -5,10 +5,7 @@ import { axios } from "app/lib/axios";
 import { Logger } from "app/lib/logger";
 import { captureException } from "app/lib/sentry";
 
-import {
-  useJoinedChannelsList,
-  useSuggestedChannelsList,
-} from "./use-channels-list";
+import { useJoinedChannelsList } from "./use-channels-list";
 
 async function leaveChannel(
   url: string,
@@ -26,7 +23,6 @@ export const useLeaveChannel = () => {
     leaveChannel
   );
   const joinedChannels = useJoinedChannelsList();
-  const suggestedChannels = useSuggestedChannelsList();
 
   const handleSubmit = useStableCallback(
     async ({ channelId }: { channelId: string }) => {
@@ -37,7 +33,6 @@ export const useLeaveChannel = () => {
         Logger.error(e);
       } finally {
         joinedChannels.mutate();
-        suggestedChannels.mutate();
       }
     }
   );

diff --git a/packages/app/components/creator-channels/list.tsx b/packages/app/components/creator-channels/list.tsx
@@ -38,7 +38,6 @@ import { LeanText } from "./components/lean-text";
 import {
   useJoinedChannelsList,
   useOwnedChannelsList,
-  useSuggestedChannelsList,
 } from "./hooks/use-channels-list";
 import { useJoinChannel } from "./hooks/use-join-channel";
 import {
@@ -340,12 +339,6 @@ const channelsSection = {
     "Get exclusive updates, presale access and unreleased content from your favorite creators.",
 };
 
-const suggestedChannelsSection = {
-  type: "section",
-  title: "Popular creators",
-  tw: "text-xl",
-};
-
 export const CreatorChannelsList = memo(
   ({ useWindowScroll = true }: { useWindowScroll?: boolean }) => {
     const listRef = useRef<FlashList<any>>(null);
@@ -376,14 +369,6 @@ export const CreatorChannelsList = memo(
       isLoading: isLoadingJoinedChannels,
     } = useJoinedChannelsList();
 
-    // suggested channels
-    const {
-      data: suggestedChannelsData,
-      refresh: refreshSuggestedChannels,
-      isLoading: isLoadingSuggestedChannels,
-      isRefreshing: isRefreshingSuggestedChannels,
-    } = useSuggestedChannelsList();
-
     // since we're quering two different endpoints, and based on the amount of data from the first endpoint
     // we have to transform our data a bit and decide if we build a section list or a single FlashList
     // we're going to useMemo for that and return the data in the format we need
@@ -403,16 +388,6 @@ export const CreatorChannelsList = memo(
                 ...joinedChannelsData,
               ]
             : []),
-          // check if we have any suggested channels, if we do, we're going to add a section for them (+ the suggested channels)
-          ...(suggestedChannelsData.length > 0
-            ? [
-                suggestedChannelsSection,
-                ...suggestedChannelsData.map((suggestedChannel) => ({
-                  ...suggestedChannel,
-                  itemType: "creator",
-                })),
-              ]
-            : []),
         ];
       } else {
         return [
@@ -431,7 +406,6 @@ export const CreatorChannelsList = memo(
     }, [
       joinedChannelsData,
       ownedChannelsData,
-      suggestedChannelsData,
     ]) as CreatorChannelsListItemProps[];
 
     const renderItem = useCallback(({ item }: CreatorChannelsListProps) => {
@@ -479,17 +453,9 @@ export const CreatorChannelsList = memo(
     ]);
 
     const refreshPage = useCallback(async () => {
-      await Promise.all([
-        refresh(),
-        refreshOwnedChannels(),
-        refreshSuggestedChannels(),
-      ]);
-    }, [refresh, refreshOwnedChannels, refreshSuggestedChannels]);
-    if (
-      isLoadingOwnChannels ||
-      isLoadingJoinedChannels ||
-      isLoadingSuggestedChannels
-    ) {
+      await Promise.all([refresh(), refreshOwnedChannels()]);
+    }, [refresh, refreshOwnedChannels]);
+    if (isLoadingOwnChannels || isLoadingJoinedChannels) {
       return <CCSkeleton />;
     }
     return (
@@ -521,11 +487,7 @@ export const CreatorChannelsList = memo(
         // Todo: unity refresh control same as tab view
         refreshControl={
           <RefreshControl
-            refreshing={
-              isRefreshing ||
-              isRefreshingOwnedChannels ||
-              isRefreshingSuggestedChannels
-            }
+            refreshing={isRefreshing || isRefreshingOwnedChannels}
             onRefresh={refreshPage}
             progressViewOffset={headerHeight}
             tintColor={isDark ? colors.gray[200] : colors.gray[700]}

diff --git a/packages/app/components/home/index.tsx b/packages/app/components/home/index.tsx
@@ -21,7 +21,6 @@ import { breakpoints } from "design-system/theme";
 import { EmptyPlaceholder } from "../empty-placeholder";
 import { ListHeaderComponent } from "./header";
 import { HomeItem, HomeItemSketelon } from "./home-item";
-import { PopularCreators } from "./popular-creators";
 import { TrendingCarousel } from "./trending-carousel";
 
 const ViewabilityInfiniteScrollList =
@@ -44,7 +43,6 @@ export const Home = () => {
         return (
           <>
             <HomeItem nft={item} mediaSize={mediaSize} index={index} />
-            <PopularCreators />
           </>
         );
       }