diff --git a/native/components/farcaster-prompt.react.js b/native/components/farcaster-prompt.react.js new file mode 100644 --- /dev/null +++ b/native/components/farcaster-prompt.react.js @@ -0,0 +1,54 @@ +// @flow + +import * as React from 'react'; +import { View, Text } from 'react-native'; + +import { useStyles } from '../themes/colors.js'; +import FarcasterLogo from '../vectors/farcaster-logo.react.js'; + +function FarcasterPrompt(): React.Node { + const styles = useStyles(unboundStyles); + + const farcasterPrompt = React.useMemo( + () => ( + <> + + Do you want to connect your Farcaster account? + + + Connecting your Farcaster account lets you see your mutual follows on + Comm. We’ll also surface communities based on your Farcaster + channels. + + + + + + ), + [styles.body, styles.farcasterLogoContainer, styles.header], + ); + + return farcasterPrompt; +} + +const unboundStyles = { + header: { + fontSize: 24, + color: 'panelForegroundLabel', + paddingBottom: 16, + }, + body: { + fontFamily: 'Arial', + fontSize: 15, + lineHeight: 20, + color: 'panelForegroundSecondaryLabel', + paddingBottom: 16, + }, + farcasterLogoContainer: { + flexGrow: 1, + alignItems: 'center', + justifyContent: 'center', + }, +}; + +export default FarcasterPrompt;