acetheking987/bsky-social-app
1
0
Fork 0
Code Issues Actions Packages Projects Releases 1 Wiki Activity

Temp WIP

Browse Source 
(cherry picked from commit 43b5d7b1e64b3adb1ed162262d0310e0bf026c18)
This commit is contained in:
Eric Bailey
2025-04-01 15:17:30 -05:00
parent 0e0a2ab3b1
commit a6b3d741c9
3 changed files with 217 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/screens/Search/Explore.tsx
+58 -1
View File
@@ -1,6 +1,6 @@
import {useCallback, useMemo, useRef, useState} from 'react'
import {View, type ViewabilityConfig, type ViewToken} from 'react-native'
import {type AppBskyActorDefs, type AppBskyFeedDefs} from '@atproto/api'
import {type AppBskyActorDefs, type AppBskyFeedDefs, type AppBskyGraphDefs} from '@atproto/api'
import {msg} from '@lingui/macro'
import {useLingui} from '@lingui/react'
@@ -25,10 +25,12 @@ import {ExploreTrendingVideos} from '#/screens/Search/modules/ExploreTrendingVid
import {atoms as a, useTheme} from '#/alf'
import {Button} from '#/components/Button'
import * as FeedCard from '#/components/FeedCard'
import {StarterPackCard} from '#/screens/Search/components/StarterPackCard'
import {ChevronBottom_Stroke2_Corner0_Rounded as ChevronDownIcon} from '#/components/icons/Chevron'
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
import {type Props as SVGIconProps} from '#/components/icons/common'
import {ListSparkle_Stroke2_Corner0_Rounded as ListSparkle} from '#/components/icons/ListSparkle'
import {StarterPack} from '#/components/icons/StarterPack'
import {UserCircle_Stroke2_Corner0_Rounded as Person} from '#/components/icons/UserCircle'
import {Loader} from '#/components/Loader'
import {Text} from '#/components/Typography'
@@ -38,6 +40,7 @@ import {
SuggestedProfileCard,
useLoadEnoughProfiles,
} from './modules/ExploreSuggestedAccounts'
import {useSuggestedStarterPacksQuery} from '#/state/queries/useSuggestedStarterPacksQuery'
function LoadMore({item}: {item: ExploreScreenItems & {type: 'loadMore'}}) {
const t = useTheme()
@@ -152,6 +155,11 @@ type ExploreScreenItems =
message: string
error: string
}
| {
type: 'starterPack',
key: string
view: AppBskyGraphDefs.StarterPackViewBasic
}
export function Explore({
focusSearchInput,
@@ -235,6 +243,11 @@ export function Explore({
profilesError,
fetchNextProfilesPage,
])
const {
data: suggestedSPs,
isLoading: isLoadingSuggestedSPs,
error: suggestedSPsError,
} = useSuggestedStarterPacksQuery()
const isLoadingMoreFeeds = isFetchingNextFeedsPage && !isLoadingFeeds
const [hasPressedLoadMoreFeeds, setHasPressedLoadMoreFeeds] = useState(false)
@@ -433,16 +446,47 @@ export function Explore({
}
}
const addSuggestedStarterPacksModule = () => {
i.push({
type: 'header',
key: 'suggested-starterPacks-header',
title: _(msg`Starter Packs`),
icon: StarterPack,
})
if (isLoadingSuggestedSPs) {
// nothing
} else if (suggestedSPsError || !suggestedSPs) {
i.pop()
// i.push({
// type: 'error',
// key: 'suggestedSPsError',
// message: _(msg`Failed to load suggested starter packs`),
// error: cleanError(suggestedSPsError),
// })
} else {
suggestedSPs.map(s => {
i.push({
type: 'starterPack',
key: s.uri,
view: s,
})
})
}
}
// Dynamic module ordering
addTopBorder()
if (guide?.guide === 'follow-10' && !guide.isComplete) {
addSuggestedFollowsModule()
addSuggestedStarterPacksModule()
addTrendingTopicsModule()
} else {
addTrendingTopicsModule()
addSuggestedFollowsModule()
addSuggestedStarterPacksModule()
}
if (gate('explore_show_suggested_feeds')) {
@@ -547,6 +591,19 @@ export function Explore({
</View>
)
}
case 'starterPack': {
return (
<View
style={[
a.border_b,
t.atoms.border_contrast_low,
a.px_lg,
a.py_lg,
]}>
<StarterPackCard view={item.view} />
</View>
)
}
case 'loadMore': {
return (
<View style={[a.border_t, t.atoms.border_contrast_low]}>
src/screens/Search/components/StarterPackCard.tsx
+57
View File
@@ -0,0 +1,57 @@
import React from 'react'
import {View} from 'react-native'
import {AppBskyGraphDefs} from '@atproto/api'
import {Image} from 'expo-image'
import {useLingui} from '@lingui/react'
import {Trans, msg} from '@lingui/macro'
import {getStarterPackOgCard} from '#/lib/strings/starter-pack'
import * as Card from '#/components/StarterPack/StarterPackCard'
import {atoms as a, useTheme, useBreakpoints} from '#/alf'
import {Button, ButtonText} from '#/components/Button'
export function StarterPackCard({view}: {view: AppBskyGraphDefs.StarterPackViewBasic}) {
const t = useTheme()
const {_} = useLingui()
const imageUri = getStarterPackOgCard(view)
const {gtPhone} = useBreakpoints()
return (
<View
style={[
a.border,
a.rounded_sm,
a.overflow_hidden,
t.atoms.border_contrast_low,
]}>
<Card.Link starterPack={view}>
<View style={[a.w_full, gtPhone && [
a.flex_row, a.gap_lg,
]]}>
<View style={[gtPhone && {
width: '50%',
}]}>
<Image
source={imageUri}
style={[a.w_full, {aspectRatio: 1.91}]}
accessibilityIgnoresInvertColors={true}
/>
</View>
<View style={[a.flex_1, a.py_md, a.pr_md, !gtPhone && [a.px_md, a.flex_row, a.gap_sm, a.align_start]]}>
<View style={[a.flex_1]}>
<Card.Card starterPack={view} noIcon />
</View>
<Button
label={_(msg`Open pack`)}
variant='solid'
color='secondary'
size='small'
>
<ButtonText><Trans>Open pack</Trans></ButtonText>
</Button>
</View>
</View>
</Card.Link>
</View>
)
}
src/state/queries/useSuggestedStarterPacksQuery.ts
+102
View File
@@ -0,0 +1,102 @@
import {useQuery} from '@tanstack/react-query'
import {AppBskyGraphDefs} from '@atproto/api'
import {useAgent} from '#/state/session'
export const createSuggestedStarterPacksQueryKey = () => [
'suggested-starter-packs',
]
export function useSuggestedStarterPacksQuery() {
const agent = useAgent()
return useQuery({
queryKey: createSuggestedStarterPacksQueryKey(),
async queryFn() {
// // @ts-expect-error
// const {data} = await agent.app.bsky.unspecced.getSuggestedStarterPacks()
// const {starterPacks} = data
const {starterPacks} = {starterPacks: [temp]}
return starterPacks as AppBskyGraphDefs.StarterPackViewBasic[]
},
})
}
const temp = {
uri: 'at://did:plc:dpajgwmnecpdyjyqzjzm6bnb/app.bsky.graph.starterpack/3l3bhtqkjfo2m',
cid: 'bafyreifvtjkrvuq3qcyz32p6lacdxbwhcmux5amnhokfputfarlpuyqqhu',
record: {
$type: 'app.bsky.graph.starterpack',
createdAt: '2024-09-03T18:44:43.158Z',
feeds: [
{
avatar:
'https://cdn.bsky.app/img/avatar/plain/did:plc:z72i7hdynmk6r22z27h6tvur/bafkreieppnjpayqgjbyqnbeqzwj3pzqtiwbe5a4m6whzqnp3k7gpqs2gai@jpeg',
cid: 'bafyreigreonzn577vy6i4qh2so7aqfjztqrrj4jpssg2jczc27p6x4y6wi',
creator: {
associated: {
chat: {
allowIncoming: 'none',
},
},
avatar:
'https://cdn.bsky.app/img/avatar/plain/did:plc:z72i7hdynmk6r22z27h6tvur/bafkreihagr2cmvl2jt4mgx3sppwe2it3fwolkrbtjrhcnwjk4jdijhsoze@jpeg',
createdAt: '2023-04-12T04:53:57.057Z',
description:
'official Bluesky account (check username👆)\n\nBugs, feature requests, feedback: support@bsky.app',
did: 'did:plc:z72i7hdynmk6r22z27h6tvur',
displayName: 'Bluesky',
handle: 'bsky.app',
indexedAt: '2024-12-18T07:43:57.513Z',
labels: [
{
cts: '2024-05-31T04:01:47.907Z',
src: 'did:plc:z3yk2cflhmn6vmzo3f5ixqh4',
uri: 'did:plc:z72i7hdynmk6r22z27h6tvur',
val: 'cornerstone',
ver: 1,
},
],
viewer: {
blockedBy: false,
muted: false,
},
},
description:
'A mix of popular content from accounts you follow and content that your follows like.',
did: 'did:web:discover.bsky.app',
displayName: 'Popular With Friends',
indexedAt: '2023-05-19T23:19:21.076Z',
labels: [],
likeCount: 33616,
uri: 'at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/with-friends',
viewer: {},
},
],
list: 'at://did:plc:dpajgwmnecpdyjyqzjzm6bnb/app.bsky.graph.list/3l3bhtqgyrn2e',
name: "Tom Sawyeeeeeee's Starter Pack",
updatedAt: '2024-12-19T22:44:58.411Z',
},
creator: {
did: 'did:plc:dpajgwmnecpdyjyqzjzm6bnb',
handle: 'test.esb.lol',
displayName: 'e',
avatar:
'https://cdn.bsky.app/img/avatar/plain/did:plc:dpajgwmnecpdyjyqzjzm6bnb/bafkreia6dx7fhoi6fxwfpgm7jrxijpqci7ap53wpilkpazojwvqlmgud2m@jpeg',
associated: {
chat: {
allowIncoming: 'all',
},
},
viewer: {
muted: false,
blockedBy: false,
},
labels: [],
createdAt: '2023-07-17T15:57:52.014Z',
},
joinedAllTimeCount: 1,
joinedWeekCount: 0,
labels: [],
indexedAt: '2024-12-19T22:45:06.322Z',
}