diff --git a/mobile/app/home/profile.tsx b/mobile/app/home/profile.tsx index 73a739d9..ca03df39 100644 --- a/mobile/app/home/profile.tsx +++ b/mobile/app/home/profile.tsx @@ -11,10 +11,12 @@ import Text from "@gno/components/text"; import { useSearch } from "@gno/hooks/use-search"; import { useNotificationContext } from "@gno/provider/notification-provider"; import { onboarding } from "redux/features/signupSlice"; +import { ProgressViewModal } from "@gno/components/view/progress"; export default function Page() { const [activeAccount, setActiveAccount] = useState(undefined); const [loading, setLoading] = useState(false); + const [modalVisible, setModalVisible] = useState(false); const [chainID, setChainID] = useState(""); const [remote, setRemote] = useState(""); const [followersCount, setFollowersCount] = useState({ n_followers: 0, n_following: 0 }); @@ -114,6 +116,8 @@ export default function Page() { + setModalVisible(false)} /> + setModalVisible(true)} variant="primary" /> { const unsubscribe = navigation.addListener("focus", async () => { @@ -33,6 +36,7 @@ export default function Search() { const onPost = async () => { setLoading(true); setError(undefined); + dispatch(addProgress(`posting a message.`)) try { const gasFee = "1000000ugnot"; const gasWanted = 10000000; @@ -46,8 +50,10 @@ export default function Search() { // TODO: replace with a better way to wait for the transaction to be mined await new Promise((resolve) => setTimeout(resolve, 3000)); + dispatch(addProgress(`done, redirecting to home page.`)) router.push("home"); } catch (error) { + dispatch(addProgress(`error on posting a message: ` + JSON.stringify(error))) console.error("on post screen", error); setError("" + error); } finally { diff --git a/mobile/app/sign-up.tsx b/mobile/app/sign-up.tsx index 124ab392..884517b7 100644 --- a/mobile/app/sign-up.tsx +++ b/mobile/app/sign-up.tsx @@ -1,4 +1,12 @@ -import { StyleSheet, Text, View, Button as RNButton, ScrollView, TextInput as RNTextInput, Alert as RNAlert } from "react-native"; +import { + StyleSheet, + View, + Button as RNButton, + ScrollView, + TextInput as RNTextInput, + Alert as RNAlert, + TouchableOpacity, +} from "react-native"; import React, { useEffect, useRef, useState } from "react"; import { router, useNavigation } from "expo-router"; import TextInput from "components/textinput"; @@ -19,12 +27,15 @@ import { signUpStateSelector, } from "redux/features/signupSlice"; import { ProgressViewModal } from "@gno/components/view/progress"; +import Text from "@gno/components/text"; +import { MaterialIcons } from "@expo/vector-icons"; export default function Page() { const [name, setName] = useState(""); const [password, setPassword] = useState(""); const [phrase, setPhrase] = useState(""); const [error, setError] = useState(undefined); + const [modalVisible, setModalVisible] = useState(false); const [confirmPassword, setConfirmPassword] = useState(""); const [loading, setLoading] = useState(false); const inputRef = useRef(null); @@ -42,7 +53,7 @@ export default function Page() { setPassword(""); setConfirmPassword(""); setError(undefined); - dispatch(clearSignUpState()) + dispatch(clearSignUpState()); inputRef.current?.focus(); try { setPhrase(await gnonative.generateRecoveryPhrase()); @@ -139,7 +150,7 @@ export default function Page() { - Create your account + Create your account - Your seed phrase: + Your seed phrase: - {phrase} + {phrase} @@ -172,8 +183,15 @@ export default function Page() { router.back()} variant="secondary" disabled={loading} /> + + + setModalVisible(true)} style={{ flexDirection: "row", alignItems: "center" }}> + Show Progress + + + - + setModalVisible(false)} /> ); @@ -199,4 +217,9 @@ const styles = StyleSheet.create({ fontSize: 36, color: "#38434D", }, + footer: { + flex: 1, + justifyContent: "center", + alignItems: "center", + }, }); diff --git a/mobile/components/view/progress/index.ts b/mobile/components/view/progress/index.ts index 42fea9a1..5313a634 100644 --- a/mobile/components/view/progress/index.ts +++ b/mobile/components/view/progress/index.ts @@ -1,4 +1,3 @@ import ProgressViewModal from "./modal"; -import ProgressView from "./view"; -export { ProgressViewModal, ProgressView } +export { ProgressViewModal } diff --git a/mobile/components/view/progress/modal.tsx b/mobile/components/view/progress/modal.tsx index 143fc60d..c8d93745 100644 --- a/mobile/components/view/progress/modal.tsx +++ b/mobile/components/view/progress/modal.tsx @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React from "react"; import { View, Modal, StyleSheet, FlatList, TouchableOpacity, Share } from "react-native"; import { useAppDispatch, useAppSelector } from "@gno/redux"; import { colors } from "@gno/styles/colors"; @@ -6,11 +6,13 @@ import Layout from "@gno/components/layout"; import { clearProgress, selectProgress } from "redux/features/signupSlice"; import Text from "@gno/components/text"; import { EvilIcons } from "@expo/vector-icons"; -import { MaterialIcons } from "@expo/vector-icons"; -const ProgressViewModal = () => { - const [modalVisible, setModalVisible] = useState(false); +interface Props { + visible: boolean; + onRequestClose: () => void; +} +const ProgressViewModal: React.FC = ({ visible, onRequestClose }) => { const dispatch = useAppDispatch(); const progress = useAppSelector(selectProgress); @@ -26,23 +28,16 @@ const ProgressViewModal = () => { return ( - setModalVisible(true)} style={{ flexDirection: "row", alignItems: "center" }}> - Show Progress - - - { - setModalVisible(!modalVisible); - }} + visible={visible} + onRequestClose={onRequestClose} > - setModalVisible(false)} style={{ marginTop: 22 }} /> + { - const [modalVisible, setModalVisible] = useState(false); - - const dispatch = useAppDispatch(); - const progress = useAppSelector(selectProgress); - - const clear = async () => { - await dispatch(clearProgress()); - }; - - const share = async () => { - await Share.share({ - message: progress.join("\n"), - }); - }; - - return ( - - setModalVisible(true)} style={{ flexDirection: "row", alignItems: "center" }}> - Show Progress - - - - { - setModalVisible(!modalVisible); - }} - > - - - - setModalVisible(false)} style={{ marginTop: 22 }} /> - No progress yet.} - renderItem={({ item }) => { - return {item}; - }} - /> - - - - - - - - - - - ); -}; - -const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: "center", - alignItems: "center", - }, - modalOverlay: { - flex: 1, - justifyContent: "flex-end", - backgroundColor: colors.modal.backgroundOpaque, - }, - transparentTop: { - flex: 1, - backgroundColor: "transparent", - }, - modalContent: { - backgroundColor: "white", - padding: 20, - borderTopLeftRadius: 20, - borderTopRightRadius: 20, - shadowColor: "#000", - shadowOffset: { - width: 0, - height: 2, - }, - shadowOpacity: 0.25, - shadowRadius: 4, - elevation: 5, - }, - bottom: { - flexDirection: "row", - justifyContent: "space-between", - paddingBottom: 16, - paddingHorizontal: 16, - }, - flatList: { borderColor: colors.grayscale[200], borderWidth: 1, marginVertical: 22, borderRadius: 4 }, -}); - -export default ProgressView;