diff --git a/native/profile/add-keyserver.react.js b/native/profile/add-keyserver.react.js --- a/native/profile/add-keyserver.react.js +++ b/native/profile/add-keyserver.react.js @@ -1,10 +1,85 @@ // @flow +import { useNavigation } from '@react-navigation/native'; import * as React from 'react'; +import { View, Text } from 'react-native'; + +import TextInput from '../components/text-input.react.js'; +import HeaderRightTextButton from '../navigation/header-right-text-button.react.js'; +import { useStyles, useColors } from '../themes/colors.js'; // eslint-disable-next-line no-unused-vars function AddKeyserver(props: { ... }): React.Node { - return null; + const { setOptions } = useNavigation(); + + const { panelForegroundTertiaryLabel } = useColors(); + const styles = useStyles(unboundStyles); + + const [urlInput, setUrlInput] = React.useState(''); + + const onPressSave = React.useCallback(() => { + // TODO + }, []); + + React.useEffect(() => { + setOptions({ + // eslint-disable-next-line react/display-name + headerRight: () => ( + + ), + }); + }, [onPressSave, setOptions, styles.header]); + + const onChangeText = React.useCallback( + (text: string) => setUrlInput(text), + [], + ); + + return ( + + KEYSERVER URL + + + + + ); } +const unboundStyles = { + container: { + paddingTop: 8, + }, + header: { + color: 'panelBackgroundLabel', + fontSize: 12, + fontWeight: '400', + paddingBottom: 3, + paddingHorizontal: 24, + }, + inputContainer: { + backgroundColor: 'panelForeground', + flexDirection: 'row', + justifyContent: 'space-between', + paddingHorizontal: 24, + paddingVertical: 13, + }, + input: { + color: 'panelForegroundLabel', + flex: 1, + fontFamily: 'Arial', + fontSize: 16, + paddingVertical: 0, + borderBottomColor: 'transparent', + }, +}; + export default AddKeyserver;