From 1f65cd7f15088eb6ec94c1973f14cc5c7cc48605 Mon Sep 17 00:00:00 2001 From: Hirbod <504909+hirbod@users.noreply.github.com> Date: Wed, 1 Nov 2023 12:04:43 +0100 Subject: [PATCH 01/12] fix: mobile web create button was still visible (#2489) --- packages/app/components/footer/index.tsx | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/packages/app/components/footer/index.tsx b/packages/app/components/footer/index.tsx index 0ded471b5c..767ee1de12 100644 --- a/packages/app/components/footer/index.tsx +++ b/packages/app/components/footer/index.tsx @@ -1,3 +1,4 @@ +import { useContext } from "react"; import { useWindowDimensions } from "react-native"; import { useIsDarkMode } from "@showtime-xyz/universal.hooks"; @@ -5,6 +6,7 @@ import { useRouter } from "@showtime-xyz/universal.router"; import { View } from "@showtime-xyz/universal.view"; import { MOBILE_WEB_TABS_HEIGHT } from "app/constants/layout"; +import { UserContext } from "app/context/user-context"; import { HIDE_MOBILE_WEB_FOOTER_SCREENS, SWIPE_LIST_SCREENS, @@ -19,6 +21,7 @@ import { import { useNavigationElements } from "app/navigation/use-navigation-elements"; const Footer = () => { + const user = useContext(UserContext); const router = useRouter(); const isDark = useIsDarkMode(); const isDarkThemePage = SWIPE_LIST_SCREENS.includes(router.pathname); @@ -33,6 +36,11 @@ const Footer = () => { const { width } = useWindowDimensions(); const { isTabBarHidden } = useNavigationElements(); + const canCreateMusicDrop = + !!user?.user?.data.profile.bypass_track_ownership_validation || + !!user?.user?.data.profile.spotify_artist_id || + !!user?.user?.data.profile.apple_music_artist_id; + if (width >= 768) { return null; } @@ -65,11 +73,13 @@ const Footer = () => { color={color} focused={router.pathname === "/channels"} /> - + {canCreateMusicDrop && ( + + )} Date: Wed, 1 Nov 2023 15:02:52 +0100 Subject: [PATCH 02/12] fix: show info tooltip instead of wrong token modal (#2491) * fix: show info tooltip instead of wrong token modal * fix: remove unused const --- .../profile/creator-tokens-panel.tsx | 101 ++++++------------ 1 file changed, 32 insertions(+), 69 deletions(-) diff --git a/packages/app/components/profile/creator-tokens-panel.tsx b/packages/app/components/profile/creator-tokens-panel.tsx index e85fec60c0..70254be421 100644 --- a/packages/app/components/profile/creator-tokens-panel.tsx +++ b/packages/app/components/profile/creator-tokens-panel.tsx @@ -18,6 +18,7 @@ import { useWalletUSDCBalance } from "app/hooks/creator-token/use-wallet-usdc-ba import { useWallet } from "app/hooks/use-wallet"; import { getCurrencyPrice } from "app/utilities"; +import { TextTooltip } from "../tooltips/text-tooltip"; import { PlatformBuyButton, PlatformSellButton } from "./buy-and-sell-buttons"; type CreatorTokensPanelProps = { isSelf?: boolean; username?: string }; @@ -157,8 +158,6 @@ export const CreatorTokensPanel = ({ username, }: CreatorTokensPanelProps) => { const isDark = useIsDarkMode(); - const router = useRouter(); - const { data: userProfileData } = useUserProfile({ address: username }); const usdcBalance = useWalletUSDCBalance(); @@ -171,84 +170,48 @@ export const CreatorTokensPanel = ({ - Wallet balance + USDC wallet balance - { - router.push( - Platform.select({ - native: "/creator-token/explanation", - web: { - pathname: router.pathname, - query: { - ...router.query, - creatorTokensExplanationModal: true, - }, - } as any, - }), - Platform.select({ - native: "/creator-token/explanation", - web: - router.asPath === "/" - ? "/creator-token/explanation" - : router.asPath, - }), - { shallow: true } - ); - }} - hitSlop={{ top: 12, left: 12, right: 12, bottom: 12 }} - > - - + + + } + text={ + "Your estimated USDC wallet\nbalance on the Base network." + } + /> {getCurrencyPrice("USD", usdcBalance.data?.displayBalance)} - {/* - // TODO: Creator Tokens P1 + {/* TODO: creator tokens p2 Token earnings - { - router.push( - Platform.select({ - native: "/creator-token/explanation", - web: { - pathname: router.pathname, - query: { - ...router.query, - creatorTokensExplanationModal: true, - }, - } as any, - }), - Platform.select({ - native: "/creator-token/explanation", - web: - router.asPath === "/" - ? "/creator-token/explanation" - : router.asPath, - }), - { shallow: true } - ); - }} - hitSlop={{ top: 12, left: 12, right: 12, bottom: 12 }} - > - - + + } + text={ + "Every time someone trades\nyour token you earn a 7%\nfee." + } + /> $21.67 From f71740eb536928750eaf48623fdea58d1ff4a378 Mon Sep 17 00:00:00 2001 From: github-actions Date: Wed, 1 Nov 2023 14:08:01 +0000 Subject: [PATCH 03/12] release v149.0.8 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5d1582fb95..380115c5cd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "showtime", - "version": "149.0.7", + "version": "149.0.8", "private": true, "license": "MIT", "devDependencies": { From 49b79e89138b4384c6968ce3267585aa99c7a70f Mon Sep 17 00:00:00 2001 From: Alan Toa <37520667+alantoa@users.noreply.github.com> Date: Thu, 2 Nov 2023 02:18:57 +0800 Subject: [PATCH 04/12] Fix/creator token buy modal issues (#2495) * fix: some UI issues with creator token buy modal * remove unuseful code * add a default creator token pic * fix --- .../creator-token/buy-creator-token.tsx | 60 +++++++++++-------- .../creator-token/self-serve-explainer.tsx | 4 +- packages/app/hooks/use-wallet-balance.ts | 1 + packages/design-system/toggle/index.tsx | 3 + 4 files changed, 41 insertions(+), 27 deletions(-) diff --git a/packages/app/components/creator-token/buy-creator-token.tsx b/packages/app/components/creator-token/buy-creator-token.tsx index 02d725ab4e..5607688c9c 100644 --- a/packages/app/components/creator-token/buy-creator-token.tsx +++ b/packages/app/components/creator-token/buy-creator-token.tsx @@ -46,23 +46,23 @@ type Query = { const { useParam } = createParam(); // Disable ETH payment on dev for now because it doesn't support the dev environment yet. -const PAYMENT_METHODS = __DEV__ - ? [ - { - title: "USDC", - value: "USDC", - }, - ] - : [ - { - title: "ETH", - value: "ETH", - }, - { - title: "USDC", - value: "USDC", - }, - ]; +const BUY_PAYMENTS = [ + { + title: "ETH", + value: "ETH", + }, + { + title: "USDC", + value: "USDC", + }, +]; +const SELL_PAYMENTS = [ + { + title: "USDC", + value: "USDC", + }, +]; + const SELECT_LIST = [ { title: "Buy", @@ -168,6 +168,7 @@ export const BuyCreatorToken = () => { "https://app.uniswap.org/swap?outputCurrency=0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913&chain=base" ) } + size="regular" > Buy USDC on Uniswap @@ -180,6 +181,7 @@ export const BuyCreatorToken = () => { return ( @@ -262,15 +264,21 @@ export const BuyCreatorToken = () => { - m.value === "USDC") - } - value={paymentMethod} - onChange={(value: any) => setPaymentMethod(value)} - /> + {selectedAction === "buy" ? ( + setPaymentMethod(value)} + key="BUY_PAYMENTS" + /> + ) : ( + setPaymentMethod(value)} + key="SELL_PAYMENTS" + /> + )} { setShowExplanation(true); diff --git a/packages/app/components/creator-token/self-serve-explainer.tsx b/packages/app/components/creator-token/self-serve-explainer.tsx index 82a8636113..e34763d2e9 100644 --- a/packages/app/components/creator-token/self-serve-explainer.tsx +++ b/packages/app/components/creator-token/self-serve-explainer.tsx @@ -36,7 +36,9 @@ export const SelfServeExplainer = () => { const isDark = useIsDarkMode(); const { user } = useUser(); const { top } = useSafeAreaInsets(); - const userProfilePic = user?.data.profile.img_url; + const userProfilePic = + user?.data.profile.img_url || + "https://media.showtime.xyz/assets/default-creator-token-pic.png"; const [profilePic, setProfilePic] = useState( userProfilePic diff --git a/packages/app/hooks/use-wallet-balance.ts b/packages/app/hooks/use-wallet-balance.ts index f41ac31b23..c51445a24d 100644 --- a/packages/app/hooks/use-wallet-balance.ts +++ b/packages/app/hooks/use-wallet-balance.ts @@ -7,6 +7,7 @@ import { useWallet } from "./use-wallet/use-wallet"; export const useWalletETHBalance = () => { const wallet = useWallet(); const res = useSWR("ethBalance" + wallet.address, async () => { + if (__DEV__) return { balance: 0, displayBalance: "0" }; if (wallet.address) { const res = (await publicClient.getBalance({ address: wallet.address, diff --git a/packages/design-system/toggle/index.tsx b/packages/design-system/toggle/index.tsx index 582a5e9ca0..9d892d2b28 100644 --- a/packages/design-system/toggle/index.tsx +++ b/packages/design-system/toggle/index.tsx @@ -4,6 +4,8 @@ import Animated, { useAnimatedStyle, withTiming, useSharedValue, + FadeIn, + Layout, } from "react-native-reanimated"; import { useIsDarkMode } from "@showtime-xyz/universal.hooks"; @@ -71,6 +73,7 @@ export const Toggle = ({ backgroundColor: isDark ? colors.white : colors.gray[900], }, ]} + entering={FadeIn} /> ) : null} {options.map((item, index) => ( From 30199fbf39d142ffc5b7c1dd199689f88051902d Mon Sep 17 00:00:00 2001 From: github-actions Date: Wed, 1 Nov 2023 18:23:46 +0000 Subject: [PATCH 05/12] release v149.0.9 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 380115c5cd..45a7624658 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "showtime", - "version": "149.0.8", + "version": "149.0.9", "private": true, "license": "MIT", "devDependencies": { From baab0286b32390825e34ede12982dbfbb1e0b4e5 Mon Sep 17 00:00:00 2001 From: Alan Toa <37520667+alantoa@users.noreply.github.com> Date: Thu, 2 Nov 2023 04:24:05 +0800 Subject: [PATCH 06/12] feat: reenable import allowlist to channel (#2494) * feat: reenable import allowlist to channel * fix: re-enable AccessTicket icon in channels header * fix: remove view member list * feat: add upload indicator for CSV upload --------- Co-authored-by: Hirbod Mirjavadi --- .../components/messages-header.tsx | 25 +------ packages/app/components/header-dropdown.tsx | 3 +- .../app/components/header/header.md.web.tsx | 2 - .../components/profile/import-allowlist.tsx | 69 ++++++++++++------- 4 files changed, 45 insertions(+), 54 deletions(-) diff --git a/packages/app/components/creator-channels/components/messages-header.tsx b/packages/app/components/creator-channels/components/messages-header.tsx index cf175661b7..02731e4b4e 100644 --- a/packages/app/components/creator-channels/components/messages-header.tsx +++ b/packages/app/components/creator-channels/components/messages-header.tsx @@ -22,28 +22,6 @@ export const MessagesHeader = (props: HeaderProps) => { const router = useRouter(); const isDark = useIsDarkMode(); - const viewMembersList = useCallback(() => { - const as = `/channels/${props.channelId}/members`; - - router.push( - Platform.select({ - native: as, - web: { - pathname: router.pathname, - query: { - ...router.query, - channelsMembersModal: true, - }, - } as any, - }), - Platform.select({ - native: as, - web: router.asPath, - }), - { shallow: true } - ); - }, [props.channelId, router]); - const inviteAllowlist = useCallback(() => { const as = "/creator-token/import-allowlist"; router.push( @@ -112,8 +90,7 @@ export const MessagesHeader = (props: HeaderProps) => { /> ) : ( - // TODO: Creator Tokens P1 (hide hidden class) - + - {/* TODO: Creator Tokens P1 {isAuthenticated && ( { @@ -218,7 +217,7 @@ function HeaderDropdown({ )} - */} + { )} - {/* TODO: Creator Tokens P1 {isAuthenticated && ( { @@ -484,7 +483,6 @@ export const HeaderMd = withColorScheme(() => { )} - */} { const router = useRouter(); + const [isLoading, setIsLoading] = useState(false); const pickCSV = useCallback(async () => { try { const file = await DocumentPicker.getDocumentAsync({ @@ -38,30 +39,38 @@ export const ImportAllowlist = () => { "Content-Type": `multipart/form-data`, }; const attachment = file.assets[0].uri; - if (Platform.OS === "web") { - const attachmentFormData = await getFileFormData(attachment); - const formData = new FormData(); - formData.append( - "file", - attachmentFormData!, - generateRandomFilename(extractMimeType(attachment)) - ); - await axios({ - url: uploadUrl, - method: "POST", - headers: headers, - data: formData, - }); - } else { - await FileSystem.uploadAsync(uploadUrl, attachment, { - uploadType: FileSystem.FileSystemUploadType.MULTIPART, - sessionType: FileSystem.FileSystemSessionType.BACKGROUND, - fieldName: "file", - httpMethod: "POST", - headers, - }); + + try { + setIsLoading(true); + if (Platform.OS === "web") { + const attachmentFormData = await getFileFormData(attachment); + const formData = new FormData(); + formData.append( + "file", + attachmentFormData!, + generateRandomFilename(extractMimeType(attachment)) + ); + await axios({ + url: uploadUrl, + method: "POST", + headers: headers, + data: formData, + }); + } else { + await FileSystem.uploadAsync(uploadUrl, attachment, { + uploadType: FileSystem.FileSystemUploadType.MULTIPART, + sessionType: FileSystem.FileSystemSessionType.BACKGROUND, + fieldName: "file", + httpMethod: "POST", + headers, + }); + } + toast.success("Allowlist imported successfully"); + } catch { + toast.error("An error occurred while uploading the file"); + } finally { + setIsLoading(false); } - toast.success("Allowlist imported successfully"); const nativeUrl = "/creator-token/import-allowlist-success"; const url = Platform.select({ @@ -107,14 +116,22 @@ export const ImportAllowlist = () => { Creator Tokens to unlock your channel. - From d2754b200c0b7af7145f1bd0075c17c63987c1c4 Mon Sep 17 00:00:00 2001 From: Jorge Valdez Date: Wed, 1 Nov 2023 16:28:29 -0400 Subject: [PATCH 07/12] Show channel messages button on profile screen even if empty (#2492) * Show channel messages button on profile screen even if empty * 0 is null :facepalm: * Change copy to View Channel messages instead of message count when 0 * fix: wording and enable lock/unlock status * fix: catch null and undefined channel permissions --------- Co-authored-by: Hirbod Mirjavadi --- .../app/components/creator-channels/types.ts | 14 ++-- packages/app/components/profile/profile.tsx | 6 ++ .../app/components/profile/profile.web.tsx | 5 ++ .../app/components/profile/tokens-tab.tsx | 64 ++++++++++++++++--- packages/app/types.ts | 2 + 5 files changed, 77 insertions(+), 14 deletions(-) diff --git a/packages/app/components/creator-channels/types.ts b/packages/app/components/creator-channels/types.ts index aaf30024d1..c7c040cb02 100644 --- a/packages/app/components/creator-channels/types.ts +++ b/packages/app/components/creator-channels/types.ts @@ -154,15 +154,17 @@ export type Channel = { owner: ChannelProfile; }; +export type ChannelPermissions = { + can_send_messages: boolean; + can_upload_media: boolean; + can_view_creator_messages: boolean; + can_view_public_messages: boolean; +}; + export type ChannelById = { viewer_has_unlocked_messages: boolean; latest_paid_nft_slug?: string; - permissions: { - can_send_messages: boolean; - can_upload_media: boolean; - can_view_creator_messages: boolean; - can_view_public_messages: boolean; - }; + permissions: ChannelPermissions | null; } & Channel; export type ChannelSetting = { diff --git a/packages/app/components/profile/profile.tsx b/packages/app/components/profile/profile.tsx index b7756a6c06..44fc0b7c9f 100644 --- a/packages/app/components/profile/profile.tsx +++ b/packages/app/components/profile/profile.tsx @@ -126,6 +126,10 @@ const Profile = ({ username }: ProfileScreenProps) => { return profileData?.data?.profile?.channels?.[0]?.message_count || 0; }, [profileData?.data?.profile.channels]); + const channelPermissions = useMemo(() => { + return profileData?.data?.profile?.channels?.[0]?.permissions; + }, [profileData?.data?.profile.channels]); + const renderScene = useCallback( ({ route: { index: routeIndex, key }, @@ -144,6 +148,7 @@ const Profile = ({ username }: ProfileScreenProps) => { channelId={channelId} isSelf={isSelf} messageCount={messageCount} + channelPermissions={channelPermissions} /> ); } @@ -177,6 +182,7 @@ const Profile = ({ username }: ProfileScreenProps) => { channelId, isSelf, messageCount, + channelPermissions, tabRefs, ] ); diff --git a/packages/app/components/profile/profile.web.tsx b/packages/app/components/profile/profile.web.tsx index 3385ebd29b..f8a1026f46 100644 --- a/packages/app/components/profile/profile.web.tsx +++ b/packages/app/components/profile/profile.web.tsx @@ -108,6 +108,10 @@ const Profile = ({ username }: ProfileScreenProps) => { return profileData?.data?.profile?.channels?.[0]?.message_count || 0; }, [profileData?.data?.profile.channels]); + const channelPermissions = useMemo(() => { + return profileData?.data?.profile?.channels?.[0]?.permissions; + }, [profileData?.data?.profile.channels]); + const routes = useMemo(() => formatProfileRoutes(data?.tabs), [data?.tabs]); const [queryTab] = useParam("type", { @@ -301,6 +305,7 @@ const Profile = ({ username }: ProfileScreenProps) => { channelId={channelId} isSelf={isSelf} messageCount={messageCount} + channelPermissions={channelPermissions} /> ) : null} {type === "song_drops_created" && isSelf ? ( diff --git a/packages/app/components/profile/tokens-tab.tsx b/packages/app/components/profile/tokens-tab.tsx index 11c2f5dbd9..eb6dae5a5c 100644 --- a/packages/app/components/profile/tokens-tab.tsx +++ b/packages/app/components/profile/tokens-tab.tsx @@ -4,13 +4,20 @@ import React, { forwardRef, useImperativeHandle, useRef, + useMemo, } from "react"; import type { ListRenderItemInfo } from "@shopify/flash-list"; import { Button } from "@showtime-xyz/universal.button"; import { useIsDarkMode } from "@showtime-xyz/universal.hooks"; -import { ChevronRight } from "@showtime-xyz/universal.icon"; +import { + ChevronRight, + Lock, + LockBadge, + LockRounded, + UnLocked, +} from "@showtime-xyz/universal.icon"; import { Pressable } from "@showtime-xyz/universal.pressable"; import { useRouter } from "@showtime-xyz/universal.router"; import { @@ -25,17 +32,19 @@ import { View, ViewProps } from "@showtime-xyz/universal.view"; import { ProfileTabsNFTProvider } from "app/context/profile-tabs-nft-context"; import { List, useProfileNFTs } from "app/hooks/api-hooks"; import { useContentWidth } from "app/hooks/use-content-width"; -import { getNFTSlug } from "app/hooks/use-share-nft"; import { useUser } from "app/hooks/use-user"; import { useScrollToTop } from "app/lib/react-navigation/native"; import { MutateProvider } from "app/providers/mutate-provider"; import { NFT } from "app/types"; import { formatNumber } from "app/utilities"; +import SvgUnlocked from "design-system/icon/Unlocked"; + +import { ChannelPermissions } from "../creator-channels/types"; import { EmptyPlaceholder } from "../empty-placeholder"; import { FilterContext } from "./fillter-context"; import { MyCollection } from "./my-collection"; -import { ProfileFooter, ProfileSpinnerFooter } from "./profile-footer"; +import { ProfileSpinnerFooter } from "./profile-footer"; type TabListProps = { username?: string; @@ -52,14 +61,21 @@ export const TokensTabHeader = ({ channelId, isSelf, messageCount, + channelPermissions, }: { channelId: number | null | undefined; messageCount?: number | null; isSelf: boolean; + channelPermissions?: ChannelPermissions | null; }) => { const isDark = useIsDarkMode(); const router = useRouter(); + const channelMessageCountFormatted = useMemo( + () => formatNumber(messageCount || 0), + [messageCount] + ); + return ( {channelId && isSelf ? ( @@ -114,7 +130,7 @@ export const TokensTabHeader = ({ */} {isSelf && } - {channelId && messageCount && messageCount > 0 ? ( + {channelId && (messageCount || messageCount == 0) && messageCount >= 0 ? ( { router.push(`/channels/${channelId}`); @@ -122,9 +138,38 @@ export const TokensTabHeader = ({ tw="mt-6 rounded-xl border border-gray-200 bg-white px-4 dark:border-gray-700 dark:bg-gray-900" > - - {formatNumber(messageCount || 0)} Channel messages - + + + {(channelPermissions && + !channelPermissions?.can_view_creator_messages) || + !channelPermissions ? ( + + ) : ( + + )} + + + {messageCount === 0 ? ( + + View Channel + + ) : ( + + {channelPermissions && + !channelPermissions?.can_view_creator_messages + ? `You've unlocked ${channelMessageCountFormatted} messages` + : `Channel locked (${channelMessageCountFormatted} messages)`} + + )} + {/* TODO: Creator tokens P1 @@ -224,6 +269,7 @@ export const TokensTab = forwardRef< TabListProps & { channelId: number | null | undefined; messageCount?: number | null; + channelPermissions?: ChannelPermissions | null; isSelf: boolean; } >(function ProfileTabList( @@ -235,6 +281,7 @@ export const TokensTab = forwardRef< index, channelId, messageCount, + channelPermissions, isSelf, }, ref @@ -282,9 +329,10 @@ export const TokensTab = forwardRef< channelId={channelId} isSelf={isSelf} messageCount={messageCount} + channelPermissions={channelPermissions} /> ), - [channelId, isSelf, messageCount] + [channelId, channelPermissions, isSelf, messageCount] ); const keyExtractor = useCallback((item: NFT) => `${item?.nft_id}`, []); diff --git a/packages/app/types.ts b/packages/app/types.ts index cf7338a89b..9f59cddbf6 100644 --- a/packages/app/types.ts +++ b/packages/app/types.ts @@ -1,3 +1,4 @@ +import { ChannelPermissions } from "./components/creator-channels/types"; import { DropPlan } from "./hooks/use-paid-drop-plans"; export type BunnyVideoUrls = { @@ -154,6 +155,7 @@ export interface Profile { name: string; self_is_member: boolean; message_count: number; + permissions: ChannelPermissions | null; }>; website_url: string; username: string; From 2ea78ff2445ff7b64cf00e6bba8a65059b0d5112 Mon Sep 17 00:00:00 2001 From: github-actions Date: Wed, 1 Nov 2023 20:32:40 +0000 Subject: [PATCH 08/12] release v149.0.10 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 45a7624658..25415d433f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "showtime", - "version": "149.0.9", + "version": "149.0.10", "private": true, "license": "MIT", "devDependencies": { From e02aaeef0acaa3e96375c28e23a3fb499cee77e3 Mon Sep 17 00:00:00 2001 From: Hirbod <504909+hirbod@users.noreply.github.com> Date: Wed, 1 Nov 2023 21:46:56 +0100 Subject: [PATCH 09/12] refactor: remove suggested creators, deprecated (#2496) --- .../creator-channels/channels.web.tsx | 38 +--- .../hooks/use-channels-list.ts | 34 --- .../hooks/use-join-channel.ts | 7 +- .../hooks/use-leave-channel.ts | 7 +- .../app/components/creator-channels/list.tsx | 46 +--- packages/app/components/home/index.tsx | 2 - .../app/components/home/popular-creators.tsx | 204 ------------------ 7 files changed, 9 insertions(+), 329 deletions(-) delete mode 100644 packages/app/components/home/popular-creators.tsx diff --git a/packages/app/components/creator-channels/channels.web.tsx b/packages/app/components/creator-channels/channels.web.tsx index e7a760601b..eab49125c9 100644 --- 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 ; } @@ -427,7 +398,6 @@ export const CreatorChannels = memo(() => { }, [ isLoadingJoinedChannels, isLoadingOwnChannels, - isLoadingSuggestedChannels, isLoadingMoreJoinedChannels, ]); if (!isLgWidth) { @@ -463,9 +433,7 @@ export const CreatorChannels = memo(() => { { 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( - 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 index 9f1b86d7f2..332a4fc15c 100644 --- 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 index 2e089c7911..df433a5135 100644 --- 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 index 15469f975d..bfd466a06a 100644 --- 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>(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 ; } return ( @@ -521,11 +487,7 @@ export const CreatorChannelsList = memo( // Todo: unity refresh control same as tab view refreshControl={ { return ( <> - ); } diff --git a/packages/app/components/home/popular-creators.tsx b/packages/app/components/home/popular-creators.tsx deleted file mode 100644 index e2d4786696..0000000000 --- a/packages/app/components/home/popular-creators.tsx +++ /dev/null @@ -1,204 +0,0 @@ -import { memo, useCallback } from "react"; -import { - useWindowDimensions, - Dimensions, - Platform, - ListRenderItemInfo, -} from "react-native"; - -import { BorderlessButton } from "react-native-gesture-handler"; - -import { Avatar } from "@showtime-xyz/universal.avatar"; -import { useIsDarkMode } from "@showtime-xyz/universal.hooks"; -import { CreatorChannel as CreatorChannelIcon } from "@showtime-xyz/universal.icon"; -import { Pressable } from "@showtime-xyz/universal.pressable"; -import { useRouter } from "@showtime-xyz/universal.router"; -import { Skeleton } from "@showtime-xyz/universal.skeleton"; -import { colors } from "@showtime-xyz/universal.tailwind"; -import { Text } from "@showtime-xyz/universal.text"; -import { View, ViewProps } from "@showtime-xyz/universal.view"; - -import { - useSuggestedChannelsList, - CreatorChannel, -} from "app/components/creator-channels/hooks/use-channels-list"; -import { DESKTOP_CONTENT_WIDTH } from "app/constants/layout"; - -import { breakpoints } from "design-system/theme"; - -import { useJoinChannel } from "../creator-channels/hooks/use-join-channel"; -import { HomeSlider } from "./home-slider"; - -const PlatformPressable = Platform.OS === "web" ? Pressable : BorderlessButton; - -const INFO_HEIGTH = 230; -const windowWidth = Dimensions.get("window").width; -const PopularCreatorItem = memo(function PopularCreatorItem({ - item, - width, - style, - tw = "", - ...rest -}: { - item: CreatorChannel; - width: number; - index: number; -} & ViewProps) { - const isDark = useIsDarkMode(); - const router = useRouter(); - const joinChannel = useJoinChannel(); - const onJoinChannel = useCallback(async () => { - await joinChannel.trigger({ channelId: item.id }); - router.push(`/channels/${item.id}?fresh=channel`); - }, [item.id, joinChannel, router]); - - return ( - router.push(`/@${item.owner.username}`)} - {...rest} - > - - - - - - - - - {item?.owner?.name || item?.owner?.username} - - - - {`${item?.member_count} members`} - - - - {item?.owner?.bio} - - - - Join - - - ); -}); -const PopularCreatorSkeletonItem = ({ - width = 174, - style, - ...rest -}: { width?: number } & ViewProps) => { - return ( - - - - - - - - - - - - - - - - ); -}; -export const PopularCreators = memo(function PopularCreators() { - const { width } = useWindowDimensions(); - const isMdWidth = width >= breakpoints["md"]; - const { data, isLoading } = useSuggestedChannelsList({ pageSize: 10 }); - const isShowSeeAll = data.length > (isMdWidth ? 3 : 2); - const router = useRouter(); - const pagerWidth = isMdWidth ? DESKTOP_CONTENT_WIDTH : windowWidth - 32; - const itemWidth = Platform.select({ - web: undefined, - default: pagerWidth / 2, - }); - const renderItem = useCallback( - ({ item, index }: ListRenderItemInfo) => ( - - ), - [itemWidth] - ); - if (data.length === 0) return null; - return ( - - - - Popular artists - - {isShowSeeAll && ( - { - router.push("/channels"); - }} - shouldActivateOnStart - hitSlop={10} - > - - see all - - - )} - - - {isLoading ? ( - - - - - - - ) : ( - - )} - - - ); -}); From 3ba0dabc3ac6bfa49b37890cd19a466755b41114 Mon Sep 17 00:00:00 2001 From: github-actions Date: Wed, 1 Nov 2023 20:53:30 +0000 Subject: [PATCH 10/12] release v149.0.11 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 25415d433f..9f3f1ad8b7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "showtime", - "version": "149.0.10", + "version": "149.0.11", "private": true, "license": "MIT", "devDependencies": { From ac832a86ec12d7009bf3d80e693411efba10115c Mon Sep 17 00:00:00 2001 From: Hirbod Mirjavadi Date: Wed, 1 Nov 2023 21:58:50 +0100 Subject: [PATCH 11/12] fix: lock color in channel messages --- packages/app/components/profile/tokens-tab.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/components/profile/tokens-tab.tsx b/packages/app/components/profile/tokens-tab.tsx index eb6dae5a5c..e56137268d 100644 --- a/packages/app/components/profile/tokens-tab.tsx +++ b/packages/app/components/profile/tokens-tab.tsx @@ -146,11 +146,11 @@ export const TokensTabHeader = ({ ) : ( From e2ba07e9eb3a2d9e992eac7c8d9bb1be736aebfe Mon Sep 17 00:00:00 2001 From: github-actions Date: Wed, 1 Nov 2023 21:04:18 +0000 Subject: [PATCH 12/12] release v149.0.12 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9f3f1ad8b7..1c96fec89c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "showtime", - "version": "149.0.11", + "version": "149.0.12", "private": true, "license": "MIT", "devDependencies": {