diff --git a/src/Navigation.tsx b/src/Navigation.tsx index 18801bf645..dc9ac081cd 100644 --- a/src/Navigation.tsx +++ b/src/Navigation.tsx @@ -43,6 +43,7 @@ import {SavedFeeds} from 'view/screens/SavedFeeds' import HashtagScreen from '#/screens/Hashtag' import {ModerationScreen} from '#/screens/Moderation' import {ProfileLabelerLikedByScreen} from '#/screens/Profile/ProfileLabelerLikedBy' +import {Landing} from '#/screens/StarterPack/Landing' import {init as initAnalytics} from './lib/analytics/analytics' import {useWebScrollRestoration} from './lib/hooks/useWebScrollRestoration' import {attachRouteToLogEvents, logEvent} from './lib/statsig/statsig' @@ -306,6 +307,11 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) { getComponent={() => MessagesSettingsScreen} options={{title: title(msg`Chat settings`), requireAuth: true}} /> + Landing} + options={{title: title(msg`Join Bluesky Today!`)}} + /> ) } diff --git a/src/lib/routes/types.ts b/src/lib/routes/types.ts index 7504cd83a0..b19c7bdb64 100644 --- a/src/lib/routes/types.ts +++ b/src/lib/routes/types.ts @@ -40,6 +40,7 @@ export type CommonNavigatorParams = { Hashtag: {tag: string; author?: string} MessagesConversation: {conversation: string; embed?: string} MessagesSettings: undefined + StarterPackLanding: {id: string} } export type BottomTabNavigatorParams = CommonNavigatorParams & { @@ -97,6 +98,7 @@ export type AllNavigatorParams = CommonNavigatorParams & { Hashtag: {tag: string; author?: string} MessagesTab: undefined Messages: {animation?: 'push' | 'pop'} + StarterPackLanding: {id: string} } // NOTE diff --git a/src/lib/statsig/gates.ts b/src/lib/statsig/gates.ts index 4481935f77..cca1a3fd4c 100644 --- a/src/lib/statsig/gates.ts +++ b/src/lib/statsig/gates.ts @@ -3,3 +3,4 @@ export type Gate = | 'request_notifications_permission_after_onboarding_v2' | 'show_avi_follow_button' | 'show_follow_back_label_v2' + | 'starter_packs_enabled' diff --git a/src/routes.ts b/src/routes.ts index 6845cccd0f..f4b0234b01 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -40,4 +40,5 @@ export const router = new Router({ Messages: '/messages', MessagesSettings: '/messages/settings', MessagesConversation: '/messages/:conversation', + StarterPackLanding: '/start/:id', }) diff --git a/src/screens/StarterPack/Landing.tsx b/src/screens/StarterPack/Landing.tsx new file mode 100644 index 0000000000..33e29acc01 --- /dev/null +++ b/src/screens/StarterPack/Landing.tsx @@ -0,0 +1,198 @@ +import React from 'react' +import {ScrollView, View} from 'react-native' +import {LinearGradient} from 'expo-linear-gradient' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {NativeStackScreenProps} from '@react-navigation/native-stack' + +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams} from 'lib/routes/types' +import {useGate} from 'lib/statsig/statsig' +import {useSetMinimalShellMode} from 'state/shell' +import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' +import {UserAvatar} from 'view/com/util/UserAvatar' +import {CenteredView} from 'view/com/util/Views' +import {Logo} from 'view/icons/Logo' +import {atoms as a, useTheme} from '#/alf' +import {Button, ButtonText} from '#/components/Button' +import {Divider} from '#/components/Divider' +import {Text} from '#/components/Typography' + +/** + * TEMPORARY CONTENT, DO NOT TRANSLATE + */ +/** + * TEMPORARY CONTENT, DO NOT TRANSLATE + */ +/** + * TEMPORARY CONTENT, DO NOT TRANSLATE + */ + +const PLACEHOLDER_USERS = [ + { + displayName: 'Bossett', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:jfhpnnst6flqway4eaeqzj2a/bafkreid42e2su4sju7hl2nm4ouacw3icvvytf7r6gab3pvc2qxhqhc5ji4@jpeg', + }, + { + displayName: 'hailey', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:oisofpd7lj26yvgiivf3lxsi/bafkreia4lpswywb5yx3gsezqb5io73kt7icw634ks4m4mmbfvp7e62cxku@jpeg', + }, + { + displayName: 'samuel', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:p2cp5gopk7mgjegy6wadk3ep/bafkreias5vktko4jpg4mwp4audptcbdfkb4o3cfyzt4426mj2h7ewwvg7q@jpeg', + }, + + { + displayName: 'Paul “Frazee” 🦋', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:ragtjsm2j2vknwkz3zp4oxrd/bafkreihhpqdyntku66himwor5wlhtdo44hllmngj2ofmbqnm25bdm454wq@jpeg', + }, + { + displayName: 'Jay', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:oky5czdrnfjpqslsw2a5iclo/bafkreihidru2xruxdxlvvcixc7lbgoudzicjbrdgacdhdhxyfw4yut4nfq@jpeg', + }, + { + displayName: 'Emily 🦋', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:vjug55kidv6sye7ykr5faxxn/bafkreia63347vwjt4sgfkedgvytodt22ugfck5o36qotwaflsf3qq5xj3y@jpeg', + }, + { + displayName: 'Rose 🌹', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:qjeavhlw222ppsre4rscd3n2/bafkreiehdi7v7bmz64anqam72ybtkkeodfe22sh7dcsh7m6wei2cf5liye@jpeg', + }, + { + displayName: 'dan', + avatar: + 'https://cdn.bsky.app/img/avatar/plain/did:plc:fpruhuo22xkm5o7ttr2ktxdo/bafkreif65cz6sp4cvwue6dnsy7lhy7o7vdelknwd6hermcbzg2npealz5q@jpeg', + }, +] + +export function Landing({ + navigation, +}: NativeStackScreenProps) { + const {_} = useLingui() + const gate = useGate() + const t = useTheme() + const {isTabletOrDesktop} = useWebMediaQueries() + const setMinimalShellMode = useSetMinimalShellMode() + const gradient = + t.name === 'light' + ? [t.palette.primary_500, t.palette.primary_300] + : [t.palette.primary_600, t.palette.primary_400] + + const userSets = React.useMemo(() => { + return { + first: PLACEHOLDER_USERS.slice(0, 4), + second: PLACEHOLDER_USERS.slice(4, 8), + } + }, []) + + React.useEffect(() => { + setMinimalShellMode(true) + return () => { + setMinimalShellMode(false) + } + }, [gate, navigation, setMinimalShellMode]) + + return ( + + + + + + + + + Science + + + Starter pack by Bossett + + + + + {/* TODO only display this when the total count is > 50 */} + 186 joined this week! + + + + (This is the description) A collection of feeds and users to get + you started with the science community on Bluesky! + + + + Join Bluesky now to subscribe to these feeds: + + + + + + + You'll also follow these people and many others! + + + + + + + + + + ) +} + +function User({displayName, avatar}: {displayName: string; avatar: string}) { + return ( + + + + {displayName} + + + ) +} + +function UserSet({users}: {users: {displayName: string; avatar: string}[]}) { + return ( + + + + + + + ) +} diff --git a/src/view/com/feeds/FeedSourceCard.tsx b/src/view/com/feeds/FeedSourceCard.tsx index 589f674b44..575f0a1306 100644 --- a/src/view/com/feeds/FeedSourceCard.tsx +++ b/src/view/com/feeds/FeedSourceCard.tsx @@ -308,6 +308,9 @@ const styles = StyleSheet.create({ flex: 1, gap: 14, }, + border: { + borderTopWidth: hairlineWidth, + }, headerContainer: { flexDirection: 'row', }, diff --git a/src/view/screens/Settings/index.tsx b/src/view/screens/Settings/index.tsx index 49702ae47c..f3ecc40d1c 100644 --- a/src/view/screens/Settings/index.tsx +++ b/src/view/screens/Settings/index.tsx @@ -854,6 +854,18 @@ export function SettingsScreen({}: Props) { Reset preferences state + { + navigation.navigate('StarterPackLanding', {id: '123'}) + }} + accessibilityRole="button" + accessibilityLabel={_(msg`Navigate to Starter Pack Landing`)} + accessibilityHint={_(msg`Navigate to Starter Pack Landing`)}> + + Navigate to Starter Pack Landing + + onPressDeleteChatDeclaration()}