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

tweak rendering

Browse Source
This commit is contained in:
Hailey
2024-08-20 08:57:44 -07:00
parent f3ade055e9
commit a1d2f670fb
2 changed files with 81 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/moderation/Hider.tsx
+27 -42
View File
@@ -33,6 +33,8 @@ const Context = React.createContext<Context>({
},
})
export const useScreenHider = () => React.useContext(Context)
export function Outer({
modui,
children,
@@ -44,40 +46,33 @@ export function Outer({
const [isContentVisible, setIsContentVisible] = React.useState(!blur)
const info = useModerationCauseDescription(blur)
const meta = React.useMemo(
() => ({
isNoPwi: !!modui.blurs.find(
const meta = {
isNoPwi: Boolean(
modui.blurs.find(
cause =>
cause.type === 'label' &&
cause.labelDef.identifier === '!no-unauthenticated',
),
noOverride: modui.noOverride,
}),
[modui],
)
),
noOverride: modui.noOverride,
}
const showInfoDialog = React.useCallback(() => {
const showInfoDialog = () => {
control.open()
}, [control])
}
const onSetContentVisible = React.useCallback(
(show: boolean) => {
if (meta.noOverride) return
setIsContentVisible(show)
},
[setIsContentVisible, meta],
)
const onSetContentVisible = (show: boolean) => {
if (meta.noOverride) return
setIsContentVisible(show)
}
const ctx = React.useMemo(
() => ({
isContentVisible,
setIsContentVisible: onSetContentVisible,
showInfoDialog,
info,
meta,
}),
[isContentVisible, onSetContentVisible, info, meta, showInfoDialog],
)
const ctx = {
isContentVisible,
setIsContentVisible: onSetContentVisible,
showInfoDialog,
info,
meta,
}
return (
<Context.Provider value={ctx}>
@@ -87,22 +82,12 @@ export function Outer({
)
}
export function Content({
children,
}: {
children: (context: Context) => React.ReactNode
}) {
const ctx = React.useContext(Context)
const child = React.useMemo(() => children(ctx), [ctx, children])
return ctx.isContentVisible ? child : null
export function Content({children}: {children: React.ReactNode}) {
const ctx = useScreenHider()
return ctx.isContentVisible ? children : null
}
export function Mask({
children,
}: {
children: (context: Context) => React.ReactNode
}) {
const ctx = React.useContext(Context)
const child = React.useMemo(() => children(ctx), [ctx, children])
return !ctx.isContentVisible ? child : null
export function Mask({children}: {children: React.ReactNode}) {
const ctx = useScreenHider()
return ctx.isContentVisible ? null : children
}
src/view/screens/ProfileList.tsx
+54 -58
View File
@@ -193,71 +193,29 @@ function ProfileListScreenLoaded({
return (
<Hider.Outer modui={moderation.ui('contentView')}>
<Hider.Mask>
{() => <ListHiddenScreen list={list} preferences={preferences} />}
<ListHiddenScreen list={list} preferences={preferences} />
</Hider.Mask>
<Hider.Content>
{() => (
<View style={s.hContentRegion}>
<PagerWithHeader
items={SECTION_TITLES_CURATE}
isHeaderReady={true}
renderHeader={renderHeader}
onCurrentPageSelected={onCurrentPageSelected}>
{({headerHeight, scrollElRef, isFocused}) => (
<FeedSection
ref={feedSectionRef}
feed={`list|${uri}`}
scrollElRef={scrollElRef as ListRef}
headerHeight={headerHeight}
isFocused={isScreenFocused && isFocused}
/>
)}
{({headerHeight, scrollElRef}) => (
<AboutSection
ref={aboutSectionRef}
scrollElRef={scrollElRef as ListRef}
list={list}
onPressAddUser={onPressAddUser}
headerHeight={headerHeight}
/>
)}
</PagerWithHeader>
<FAB
testID="composeFAB"
onPress={() => openComposer({})}
icon={
<ComposeIcon2
strokeWidth={1.5}
size={29}
style={{color: 'white'}}
/>
}
accessibilityRole="button"
accessibilityLabel={_(msg`New post`)}
accessibilityHint=""
/>
</View>
)}
</Hider.Content>
</Hider.Outer>
)
}
return (
<Hider.Outer modui={moderation.ui('contentView')}>
<Hider.Mask>
{() => <ListHiddenScreen list={list} preferences={preferences} />}
</Hider.Mask>
<Hider.Content>
{() => (
<View style={s.hContentRegion}>
<PagerWithHeader
items={SECTION_TITLES_MOD}
items={SECTION_TITLES_CURATE}
isHeaderReady={true}
renderHeader={renderHeader}>
renderHeader={renderHeader}
onCurrentPageSelected={onCurrentPageSelected}>
{({headerHeight, scrollElRef, isFocused}) => (
<FeedSection
ref={feedSectionRef}
feed={`list|${uri}`}
scrollElRef={scrollElRef as ListRef}
headerHeight={headerHeight}
isFocused={isScreenFocused && isFocused}
/>
)}
{({headerHeight, scrollElRef}) => (
<AboutSection
list={list}
ref={aboutSectionRef}
scrollElRef={scrollElRef as ListRef}
list={list}
onPressAddUser={onPressAddUser}
headerHeight={headerHeight}
/>
@@ -278,7 +236,45 @@ function ProfileListScreenLoaded({
accessibilityHint=""
/>
</View>
)}
</Hider.Content>
</Hider.Outer>
)
}
return (
<Hider.Outer modui={moderation.ui('contentView')}>
<Hider.Mask>
<ListHiddenScreen list={list} preferences={preferences} />
</Hider.Mask>
<Hider.Content>
<View style={s.hContentRegion}>
<PagerWithHeader
items={SECTION_TITLES_MOD}
isHeaderReady={true}
renderHeader={renderHeader}>
{({headerHeight, scrollElRef}) => (
<AboutSection
list={list}
scrollElRef={scrollElRef as ListRef}
onPressAddUser={onPressAddUser}
headerHeight={headerHeight}
/>
)}
</PagerWithHeader>
<FAB
testID="composeFAB"
onPress={() => openComposer({})}
icon={
<ComposeIcon2
strokeWidth={1.5}
size={29}
style={{color: 'white'}}
/>
}
accessibilityRole="button"
accessibilityLabel={_(msg`New post`)}
accessibilityHint=""
/>
</View>
</Hider.Content>
</Hider.Outer>
)