diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/screens/StarterPack/StarterPackLandingScreen.tsx | 19 | ||||
-rw-r--r-- | src/screens/StarterPack/StarterPackScreen.tsx | 209 | ||||
-rw-r--r-- | src/screens/StarterPack/Wizard/index.tsx | 5 |
3 files changed, 108 insertions, 125 deletions
diff --git a/src/screens/StarterPack/StarterPackLandingScreen.tsx b/src/screens/StarterPack/StarterPackLandingScreen.tsx index 2d9a91969..a48fbc61c 100644 --- a/src/screens/StarterPack/StarterPackLandingScreen.tsx +++ b/src/screens/StarterPack/StarterPackLandingScreen.tsx @@ -1,5 +1,5 @@ import React from 'react' -import {Pressable, ScrollView, View} from 'react-native' +import {Pressable, View} from 'react-native' import Animated, {FadeIn, FadeOut} from 'react-native-reanimated' import { AppBskyGraphDefs, @@ -25,13 +25,13 @@ import { } from '#/state/shell/starter-pack' import {LoggedOutScreenState} from '#/view/com/auth/LoggedOut' import {formatCount} from '#/view/com/util/numeric/format' -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 {useDialogControl} from '#/components/Dialog' import * as FeedCard from '#/components/FeedCard' import {useRichText} from '#/components/hooks/useRichText' +import * as Layout from '#/components/Layout' import {LinearGradientBackground} from '#/components/LinearGradientBackground' import {ListMaybePlaceholder} from '#/components/Lists' import {Default as ProfileCard} from '#/components/ProfileCard' @@ -165,10 +165,8 @@ function LandingScreenLoaded({ } return ( - <CenteredView style={a.flex_1}> - <ScrollView - style={[a.flex_1, t.atoms.bg]} - contentContainerStyle={{paddingBottom: 100}}> + <View style={[a.flex_1]}> + <Layout.Content ignoreTabletLayoutOffset> <LinearGradientBackground style={[ a.align_center, @@ -313,7 +311,7 @@ function LandingScreenLoaded({ </ButtonText> </Button> </View> - </ScrollView> + </Layout.Content> <AppClipOverlay visible={appClipOverlayVisible} setIsVisible={setAppClipOverlayVisible} @@ -358,7 +356,7 @@ function LandingScreenLoaded({ content="app-id=xyz.blueskyweb.app, app-clip-bundle-id=xyz.blueskyweb.app.AppClip, app-clip-display=card" /> )} - </CenteredView> + </View> ) } @@ -376,11 +374,8 @@ export function AppClipOverlay({ accessibilityRole="button" style={[ a.absolute, + a.inset_0, { - top: 0, - left: 0, - right: 0, - bottom: 0, backgroundColor: 'rgba(0, 0, 0, 0.95)', zIndex: 1, }, diff --git a/src/screens/StarterPack/StarterPackScreen.tsx b/src/screens/StarterPack/StarterPackScreen.tsx index ac61c153b..cf153db44 100644 --- a/src/screens/StarterPack/StarterPackScreen.tsx +++ b/src/screens/StarterPack/StarterPackScreen.tsx @@ -24,7 +24,6 @@ import {logEvent} from '#/lib/statsig/statsig' import {cleanError} from '#/lib/strings/errors' import {getStarterPackOgCard} from '#/lib/strings/starter-pack' import {logger} from '#/logger' -import {isWeb} from '#/platform/detection' import {updateProfileShadow} from '#/state/cache/profile-shadow' import {useModerationOpts} from '#/state/preferences/moderation-opts' import {getAllListMembers} from '#/state/queries/list-members' @@ -43,7 +42,6 @@ import {useSetActiveStarterPack} from '#/state/shell/starter-pack' import {PagerWithHeader} from '#/view/com/pager/PagerWithHeader' import {ProfileSubpageHeader} from '#/view/com/profile/ProfileSubpageHeader' import * as Toast from '#/view/com/util/Toast' -import {CenteredView} from '#/view/com/util/Views' import {bulkWriteFollows} from '#/screens/Onboarding/util' import {atoms as a, useBreakpoints, useTheme} from '#/alf' import {Button, ButtonIcon, ButtonText} from '#/components/Button' @@ -222,55 +220,53 @@ function StarterPackScreenLoaded({ }, [onOpenShareDialog, routeParams.new, shareDialogControl]) return ( - <CenteredView style={[a.h_full_vh]}> - <View style={isWeb ? {minHeight: '100%'} : {height: '100%'}}> - <PagerWithHeader - items={tabs} - isHeaderReady={true} - renderHeader={() => ( - <Header - starterPack={starterPack} - routeParams={routeParams} - onOpenShareDialog={onOpenShareDialog} - /> - )}> - {showPeopleTab - ? ({headerHeight, scrollElRef}) => ( - <ProfilesList - // Validated above - listUri={starterPack!.list!.uri} - headerHeight={headerHeight} - // @ts-expect-error - scrollElRef={scrollElRef} - moderationOpts={moderationOpts} - /> - ) - : null} - {showFeedsTab - ? ({headerHeight, scrollElRef}) => ( - <FeedsList - // @ts-expect-error ? - feeds={starterPack?.feeds} - headerHeight={headerHeight} - // @ts-expect-error - scrollElRef={scrollElRef} - /> - ) - : null} - {showPostsTab - ? ({headerHeight, scrollElRef}) => ( - <PostsList - // Validated above - listUri={starterPack!.list!.uri} - headerHeight={headerHeight} - // @ts-expect-error - scrollElRef={scrollElRef} - moderationOpts={moderationOpts} - /> - ) - : null} - </PagerWithHeader> - </View> + <> + <PagerWithHeader + items={tabs} + isHeaderReady={true} + renderHeader={() => ( + <Header + starterPack={starterPack} + routeParams={routeParams} + onOpenShareDialog={onOpenShareDialog} + /> + )}> + {showPeopleTab + ? ({headerHeight, scrollElRef}) => ( + <ProfilesList + // Validated above + listUri={starterPack!.list!.uri} + headerHeight={headerHeight} + // @ts-expect-error + scrollElRef={scrollElRef} + moderationOpts={moderationOpts} + /> + ) + : null} + {showFeedsTab + ? ({headerHeight, scrollElRef}) => ( + <FeedsList + // @ts-expect-error ? + feeds={starterPack?.feeds} + headerHeight={headerHeight} + // @ts-expect-error + scrollElRef={scrollElRef} + /> + ) + : null} + {showPostsTab + ? ({headerHeight, scrollElRef}) => ( + <PostsList + // Validated above + listUri={starterPack!.list!.uri} + headerHeight={headerHeight} + // @ts-expect-error + scrollElRef={scrollElRef} + moderationOpts={moderationOpts} + /> + ) + : null} + </PagerWithHeader> <QrCodeDialog control={qrCodeDialogControl} @@ -284,7 +280,7 @@ function StarterPackScreenLoaded({ link={link} imageLoaded={imageLoaded} /> - </CenteredView> + </> ) } @@ -707,64 +703,57 @@ function InvalidStarterPack({rkey}: {rkey: string}) { }) return ( - <CenteredView - style={[ - a.flex_1, - a.align_center, - a.gap_5xl, - !gtMobile && a.justify_between, - t.atoms.border_contrast_low, - {paddingTop: 175, paddingBottom: 110}, - ]} - sideBorders={true}> - <View style={[a.w_full, a.align_center, a.gap_lg]}> - <Text style={[a.font_bold, a.text_3xl]}> - <Trans>Starter pack is invalid</Trans> - </Text> - <Text - style={[ - a.text_md, - a.text_center, - t.atoms.text_contrast_high, - {lineHeight: 1.4}, - gtMobile ? {width: 450} : [a.w_full, a.px_lg], - ]}> - <Trans> - The starter pack that you are trying to view is invalid. You may - delete this starter pack instead. - </Trans> - </Text> - </View> - <View style={[a.gap_md, gtMobile ? {width: 350} : [a.w_full, a.px_lg]]}> - <Button - variant="solid" - color="primary" - label={_(msg`Delete starter pack`)} - size="large" - style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]} - disabled={isProcessing} - onPress={() => { - setIsProcessing(true) - deleteStarterPack({rkey}) - }}> - <ButtonText> - <Trans>Delete</Trans> - </ButtonText> - {isProcessing && <Loader size="xs" color="white" />} - </Button> - <Button - variant="solid" - color="secondary" - label={_(msg`Return to previous page`)} - size="large" - style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]} - disabled={isProcessing} - onPress={goBack}> - <ButtonText> - <Trans>Go Back</Trans> - </ButtonText> - </Button> + <Layout.Content centerContent> + <View style={[a.py_4xl, a.px_xl, a.align_center, a.gap_5xl]}> + <View style={[a.w_full, a.align_center, a.gap_lg]}> + <Text style={[a.font_bold, a.text_3xl]}> + <Trans>Starter pack is invalid</Trans> + </Text> + <Text + style={[ + a.text_md, + a.text_center, + t.atoms.text_contrast_high, + {lineHeight: 1.4}, + gtMobile ? {width: 450} : [a.w_full, a.px_lg], + ]}> + <Trans> + The starter pack that you are trying to view is invalid. You may + delete this starter pack instead. + </Trans> + </Text> + </View> + <View style={[a.gap_md, gtMobile ? {width: 350} : [a.w_full, a.px_lg]]}> + <Button + variant="solid" + color="primary" + label={_(msg`Delete starter pack`)} + size="large" + style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]} + disabled={isProcessing} + onPress={() => { + setIsProcessing(true) + deleteStarterPack({rkey}) + }}> + <ButtonText> + <Trans>Delete</Trans> + </ButtonText> + {isProcessing && <Loader size="xs" color="white" />} + </Button> + <Button + variant="solid" + color="secondary" + label={_(msg`Return to previous page`)} + size="large" + style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]} + disabled={isProcessing} + onPress={goBack}> + <ButtonText> + <Trans>Go Back</Trans> + </ButtonText> + </Button> + </View> </View> - </CenteredView> + </Layout.Content> ) } diff --git a/src/screens/StarterPack/Wizard/index.tsx b/src/screens/StarterPack/Wizard/index.tsx index 92cad2f65..deb191f1a 100644 --- a/src/screens/StarterPack/Wizard/index.tsx +++ b/src/screens/StarterPack/Wizard/index.tsx @@ -41,7 +41,6 @@ import {useSession} from '#/state/session' import {useSetMinimalShellMode} from '#/state/shell' import * as Toast from '#/view/com/util/Toast' import {UserAvatar} from '#/view/com/util/UserAvatar' -import {CenteredView} from '#/view/com/util/Views' import {useWizardState, WizardStep} from '#/screens/StarterPack/Wizard/State' import {StepDetails} from '#/screens/StarterPack/Wizard/StepDetails' import {StepFeeds} from '#/screens/StarterPack/Wizard/StepFeeds' @@ -281,7 +280,7 @@ function WizardInner({ } return ( - <CenteredView style={[a.flex_1]} sideBorders> + <Layout.Center style={[a.flex_1]}> <Layout.Header.Outer> <Layout.Header.BackButton label={_(msg`Back`)} @@ -319,7 +318,7 @@ function WizardInner({ profile={profile} /> )} - </CenteredView> + </Layout.Center> ) } |