Page MenuHomePhabricator
Files F2752795

D7598.id25718.diff
No OneTemporary
Actions

D7598.id25718.diff
View Options

diff --git a/native/account/registration/keyserver-selection.react.js b/native/account/registration/keyserver-selection.react.js
--- a/native/account/registration/keyserver-selection.react.js
+++ b/native/account/registration/keyserver-selection.react.js
@@ -1,7 +1,7 @@
// @flow
import * as React from 'react';
-import { Text, TextInput } from 'react-native';
+import { Text, TextInput, View } from 'react-native';
import RegistrationButton from './registration-button.react.js';
import RegistrationContainer from './registration-container.react.js';
@@ -46,57 +46,64 @@
const styles = useStyles(unboundStyles);
const colors = useColors();
return (
- <RegistrationContainer>
- <Text style={styles.header}>Select a keyserver to join</Text>
- <Text style={styles.body}>
- Chat communities on Comm are hosted on keyservers, which are
- user-operated backends.
- </Text>
- <Text style={styles.body}>
- Keyservers allow Comm to offer strong privacy guarantees without
- sacrificing functionality.
- </Text>
- <RegistrationTile
- selected={currentSelection === 'ashoat'}
- onSelect={selectAshoat}
- >
- <RegistrationTileHeader>
- <CommIcon
- name="cloud-filled"
- size={16}
- color={colors.panelForegroundLabel}
- style={styles.cloud}
- />
- <Text style={styles.tileTitleText}>ashoat</Text>
- </RegistrationTileHeader>
- <Text style={styles.tileBody}>
- Ashoat is Comm’s founder, and his keyserver currently hosts most of
- the communities on Comm.
+ <View style={styles.container}>
+ <RegistrationContainer>
+ <Text style={styles.header}>Select a keyserver to join</Text>
+ <Text style={styles.body}>
+ Chat communities on Comm are hosted on keyservers, which are
+ user-operated backends.
+ </Text>
+ <Text style={styles.body}>
+ Keyservers allow Comm to offer strong privacy guarantees without
+ sacrificing functionality.
</Text>
- </RegistrationTile>
- <RegistrationTile
- selected={currentSelection === 'custom'}
- onSelect={selectCustom}
- >
- <RegistrationTileHeader>
- <Text style={styles.tileTitleText}>Enter a keyserver</Text>
- </RegistrationTileHeader>
- <TextInput
- value={customKeyserver}
- onChangeText={setCustomKeyserver}
- style={styles.keyserverInput}
- placeholderTextColor={colors.panelSecondaryForegroundBorder}
- placeholder="Keyserver"
- onFocus={onCustomKeyserverFocus}
- ref={customKeyserverTextInputRef}
- />
- </RegistrationTile>
+ <RegistrationTile
+ selected={currentSelection === 'ashoat'}
+ onSelect={selectAshoat}
+ >
+ <RegistrationTileHeader>
+ <CommIcon
+ name="cloud-filled"
+ size={16}
+ color={colors.panelForegroundLabel}
+ style={styles.cloud}
+ />
+ <Text style={styles.tileTitleText}>ashoat</Text>
+ </RegistrationTileHeader>
+ <Text style={styles.tileBody}>
+ Ashoat is Comm’s founder, and his keyserver currently hosts most of
+ the communities on Comm.
+ </Text>
+ </RegistrationTile>
+ <RegistrationTile
+ selected={currentSelection === 'custom'}
+ onSelect={selectCustom}
+ >
+ <RegistrationTileHeader>
+ <Text style={styles.tileTitleText}>Enter a keyserver</Text>
+ </RegistrationTileHeader>
+ <TextInput
+ value={customKeyserver}
+ onChangeText={setCustomKeyserver}
+ style={styles.keyserverInput}
+ placeholderTextColor={colors.panelSecondaryForegroundBorder}
+ placeholder="Keyserver"
+ onFocus={onCustomKeyserverFocus}
+ ref={customKeyserverTextInputRef}
+ />
+ </RegistrationTile>
+ </RegistrationContainer>
<RegistrationButton onPress={onSubmit} label="Next" />
- </RegistrationContainer>
+ </View>
);
}
const unboundStyles = {
+ container: {
+ backgroundColor: 'panelBackground',
+ justifyContent: 'space-between',
+ flex: 1,
+ },
header: {
fontSize: 24,
color: 'panelForegroundLabel',
diff --git a/native/account/registration/registration-button.react.js b/native/account/registration/registration-button.react.js
--- a/native/account/registration/registration-button.react.js
+++ b/native/account/registration/registration-button.react.js
@@ -24,6 +24,7 @@
button: {
backgroundColor: 'purpleButton',
borderRadius: 8,
+ margin: 16,
},
buttonText: {
fontSize: 18,
diff --git a/native/account/registration/registration-container.react.js b/native/account/registration/registration-container.react.js
--- a/native/account/registration/registration-container.react.js
+++ b/native/account/registration/registration-container.react.js
@@ -7,10 +7,14 @@
import KeyboardAvoidingView from '../../components/keyboard-avoiding-view.react.js';
import { useStyles } from '../../themes/colors.js';
+type ViewProps = React.ElementConfig<typeof ScrollView>;
type Props = {
+ ...ViewProps,
+children: React.Node,
};
function RegistrationContainer(props: Props): React.Node {
+ const { children, style, ...rest } = props;
+
const headerHeight = useHeaderHeight();
const backgroundStyle = React.useMemo(
() => ({
@@ -20,13 +24,19 @@
);
const styles = useStyles(unboundStyles);
+ const contentContainerStyle = React.useMemo(
+ () => [styles.scrollViewContentContainer, style],
+ [styles.scrollViewContentContainer, style],
+ );
+
return (
<KeyboardAvoidingView behavior="padding" style={styles.fill}>
<ScrollView
- contentContainerStyle={styles.scrollViewContentContainer}
+ contentContainerStyle={contentContainerStyle}
style={backgroundStyle}
+ {...rest}
>
- {props.children}
+ {children}
</ScrollView>
</KeyboardAvoidingView>
);

File Metadata

Mime Type
text/plain
Expires
Thu, Sep 19, 4:21 PM (7 h, 48 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2128857
Default Alt Text
D7598.id25718.diff (6 KB)

Event Timeline