Page MenuHomePhabricator

D11560.id38826.diff
No OneTemporary

D11560.id38826.diff

diff --git a/native/components/connect-farcaster-bottom-sheet.react.js b/native/components/connect-farcaster-bottom-sheet.react.js
--- a/native/components/connect-farcaster-bottom-sheet.react.js
+++ b/native/components/connect-farcaster-bottom-sheet.react.js
@@ -1,7 +1,13 @@
// @flow
import * as React from 'react';
+import { View, StyleSheet } from 'react-native';
+import FarcasterPrompt from './farcaster-prompt.react.js';
+import FarcasterWebView, {
+ type FarcasterWebViewState,
+} from './farcaster-web-view.react.js';
+import RegistrationButton from '../account/registration/registration-button.react.js';
import BottomSheet from '../bottom-sheet/bottom-sheet.react.js';
import type { RootNavigationProp } from '../navigation/root-navigator.react.js';
import type { NavigationRoute } from '../navigation/route-names.js';
@@ -18,11 +24,60 @@
const bottomSheetRef = React.useRef(null);
- return (
- <BottomSheet ref={bottomSheetRef} onClosed={goBack}>
- {null}
- </BottomSheet>
+ const [webViewState, setWebViewState] =
+ React.useState<FarcasterWebViewState>('closed');
+
+ const onSuccessfulConnect = React.useCallback(() => {
+ // TODO: Update fid
+ bottomSheetRef.current?.close();
+ }, []);
+
+ const onPressConnect = React.useCallback(() => {
+ setWebViewState('opening');
+ }, []);
+
+ const connectButtonVariant =
+ webViewState === 'opening' ? 'loading' : 'enabled';
+
+ const connectFarcasterBottomSheet = React.useMemo(
+ () => (
+ <BottomSheet ref={bottomSheetRef} onClosed={goBack}>
+ <View style={styles.container}>
+ <View style={styles.promptContainer}>
+ <FarcasterPrompt />
+ </View>
+ <RegistrationButton
+ onPress={onPressConnect}
+ label="Connect Farcaster account"
+ variant={connectButtonVariant}
+ />
+ </View>
+ <FarcasterWebView
+ onSuccess={onSuccessfulConnect}
+ webViewState={webViewState}
+ />
+ </BottomSheet>
+ ),
+ [
+ connectButtonVariant,
+ goBack,
+ onPressConnect,
+ onSuccessfulConnect,
+ webViewState,
+ ],
);
+
+ return connectFarcasterBottomSheet;
}
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ paddingHorizontal: 16,
+ },
+ promptContainer: {
+ marginBottom: 40,
+ },
+});
+
export default ConnectFarcasterBottomSheet;

File Metadata

Mime Type
text/plain
Expires
Thu, Nov 28, 2:33 AM (21 h, 29 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2589405
Default Alt Text
D11560.id38826.diff (2 KB)

Event Timeline