136 lines
4.4 KiB
TypeScript
136 lines
4.4 KiB
TypeScript
// Metro module 10021 (f10022).
|
|
import { useRef, useState, useLayoutEffect } from "react";
|
|
import { ScrollView, View } from "react-native";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import useWindowDimensions_native from "../../screen/useWindowDimensions.native";
|
|
import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
|
|
import KeyboardAwareView from "../../keyboard/native/KeyboardAwareView";
|
|
import ObscuredSurface from "../../safety_common/native/ObscuredSurface";
|
|
const useStyles = createStyles({
|
|
fill: {
|
|
flex: 1
|
|
},
|
|
scrollView: {
|
|
flex: 1,
|
|
backgroundColor: Module712.colors.BACKGROUND_BASE_LOWER,
|
|
paddingHorizontal: 16
|
|
},
|
|
scrollViewContentLandscape: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
width: "100%",
|
|
flexGrow: 1,
|
|
gap: 16
|
|
},
|
|
scrollViewContentPortrait: {
|
|
flexDirection: "column",
|
|
width: "100%",
|
|
flexGrow: 1,
|
|
gap: 16
|
|
},
|
|
header: {
|
|
paddingTop: 24
|
|
},
|
|
bodyContainer: {
|
|
flexDirection: "column",
|
|
gap: 16,
|
|
padding: 16
|
|
},
|
|
bodyContainerBackground: {
|
|
marginHorizontal: 16,
|
|
backgroundColor: Module712.colors.BORDER_SUBTLE,
|
|
borderRadius: Module712.radii.lg
|
|
},
|
|
footerPortrait: {
|
|
flexDirection: "column",
|
|
padding: 16,
|
|
gap: 16
|
|
},
|
|
separator: {
|
|
height: 1,
|
|
backgroundColor: Module712.colors.BORDER_SUBTLE
|
|
}
|
|
});
|
|
export default function OAuth2AuthorizeContent(props) {
|
|
const { header, body, footer, appDetails, centerContent, setAllContentSeen, hasContentBackground, onScroll: onScroll2, obscured } = props;
|
|
const styles = useStyles();
|
|
const ref = useRef(null);
|
|
const windowDimensions_native = useWindowDimensions_native();
|
|
const r6 = windowDimensions_native.width > windowDimensions_native.height;
|
|
const safeAreaInsets_native = useSafeAreaInsets_native();
|
|
const { left, right, bottom } = safeAreaInsets_native;
|
|
const [state, setState] = useState(-1);
|
|
const [state2, setState2] = useState(-1);
|
|
const [state3, setState3] = useState(-1);
|
|
const r3 = state >= 0 && state2 >= 0 && (footer == null || state3 >= 0);
|
|
let c17629_8 = r3;
|
|
useLayoutEffect(() => {
|
|
if (c17629_8) {
|
|
const r5 = {
|
|
layoutMeasurement: {
|
|
height: state2
|
|
},
|
|
contentSize: {
|
|
height: state
|
|
}
|
|
};
|
|
const { layoutMeasurement, contentOffset = {
|
|
y: 0
|
|
} } = r5;
|
|
if (layoutMeasurement.height + contentOffset.y >= r5.contentSize.height - 5) {
|
|
if (setAllContentSeen != null) {
|
|
setAllContentSeen(true);
|
|
}
|
|
} else if (setAllContentSeen != null) {
|
|
setAllContentSeen(false);
|
|
}
|
|
}
|
|
}, [state, r3, state2, setAllContentSeen]);
|
|
return <KeyboardAwareView style={[styles.fill, {
|
|
marginBottom: bottom
|
|
}]}>
|
|
<ScrollView style={[styles.scrollView, {
|
|
paddingLeft: left,
|
|
paddingRight: right
|
|
}]} contentContainerStyle={[r6 ? styles.scrollViewContentLandscape : styles.scrollViewContentPortrait]} ref={ref} onContentSizeChange={(event, a1) => {
|
|
const current = ref.current;
|
|
if (current != null) {
|
|
current.scrollTo({
|
|
y: 0
|
|
});
|
|
}
|
|
setState(a1);
|
|
}} scrollEventThrottle={16} onLayout={(event) => {
|
|
setState2(event.nativeEvent.layout.height);
|
|
}} onScroll={(event) => {
|
|
const nativeEvent = event.nativeEvent;
|
|
const { layoutMeasurement, contentOffset = {
|
|
y: 0
|
|
} } = nativeEvent;
|
|
if (layoutMeasurement.height + contentOffset.y >= nativeEvent.contentSize.height - 5 && setAllContentSeen != null) {
|
|
setAllContentSeen(true);
|
|
}
|
|
if (onScroll2 != null) {
|
|
onScroll2(event);
|
|
}
|
|
}} centerContent={centerContent}>
|
|
<ObscuredSurface obscured={obscured}>
|
|
{header != null ? <View style={styles.header}>{header}</View> : null}
|
|
<View style={[styles.bodyContainer, hasContentBackground ? styles.bodyContainerBackground : null, r6 ? {
|
|
flex: 1
|
|
} : {}]}>
|
|
{body}
|
|
{appDetails != null ? <>
|
|
<View style={styles.separator} />
|
|
<View>{appDetails}</View>
|
|
</> : null}
|
|
</View>
|
|
</ObscuredSurface>
|
|
</ScrollView>
|
|
{footer != null ? <View onLayout={(event) => {
|
|
setState3(event.nativeEvent.layout.height);
|
|
}} style={styles.footerPortrait}>{footer}</View> : null}
|
|
</KeyboardAwareView>;
|
|
};
|