Display buttons above scroll in laconic-wallet approve screens (#72)

* Buttons outside scroll

* Fix ui for signRequest page

* Remove todo
This commit is contained in:
IshaVenikar 2024-04-01 18:00:40 +05:30 committed by GitHub
parent d50cfbfe84
commit 0dea0082b4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 88 additions and 83 deletions

View File

@ -209,53 +209,57 @@ const ApproveTransaction = ({ route }: SignRequestProps) => {
<ActivityIndicator size="large" color="#0000ff" />
</View>
) : (
<ScrollView contentContainerStyle={styles.appContainer}>
<View style={styles.dappDetails}>
{requestIcon && (
<Image
style={styles.dappLogo}
source={requestIcon ? { uri: requestIcon } : undefined}
/>
)}
<Text>{requestName}</Text>
<Text variant="bodyMedium">{requestURL}</Text>
</View>
<View style={styles.dataBoxContainer}>
<Text style={styles.dataBoxLabel}>From</Text>
<View style={styles.dataBox}>
<AccountDetails account={account} />
</View>
</View>
<DataBox
label={`Balance ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={
balance === '' || balance === undefined
? 'Loading balance...'
: `${balance}`
}
/>
{transaction && (
<View style={styles.approveTransaction}>
<DataBox label="To" data={transaction.to!} />
<DataBox
label={`Amount ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={BigNumber.from(transaction.value?.toString()).toString()}
/>
<DataBox
label={`Gas Fees ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={gasFees!}
/>
{network === 'eth' && (
<DataBox label="Data" data={transaction.data!} />
<>
<ScrollView contentContainerStyle={styles.appContainer}>
<View style={styles.dappDetails}>
{requestIcon && (
<Image
style={styles.dappLogo}
source={requestIcon ? { uri: requestIcon } : undefined}
/>
)}
<Text>{requestName}</Text>
<Text variant="bodyMedium">{requestURL}</Text>
</View>
)}
<View style={styles.dataBoxContainer}>
<Text style={styles.dataBoxLabel}>From</Text>
<View style={styles.dataBox}>
<AccountDetails account={account} />
</View>
</View>
<DataBox
label={`Balance ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={
balance === '' || balance === undefined
? 'Loading balance...'
: `${balance}`
}
/>
{transaction && (
<View style={styles.approveTransaction}>
<DataBox label="To" data={transaction.to!} />
<DataBox
label={`Amount ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={BigNumber.from(
transaction.value?.toString(),
).toString()}
/>
<DataBox
label={`Gas Fees ${
network === 'eth' ? '(Wei)' : `(${COSMOS_DENOM})`
}`}
data={gasFees!}
/>
{network === 'eth' && (
<DataBox label="Data" data={transaction.data!} />
)}
</View>
)}
</ScrollView>
<View style={styles.buttonContainer}>
<Button
mode="contained"
@ -271,7 +275,7 @@ const ApproveTransaction = ({ route }: SignRequestProps) => {
No
</Button>
</View>
</ScrollView>
</>
)}
</>
);

View File

@ -221,38 +221,39 @@ const SignRequest = ({ route }: SignRequestProps) => {
<ActivityIndicator size="large" color="#0000ff" />
</View>
) : (
<ScrollView contentContainerStyle={styles.appContainer}>
<View style={styles.dappDetails}>
{requestIcon && (
<>
{requestIcon.endsWith('.svg') ? (
<View style={styles.dappLogo}>
<SvgUri height="50" width="50" uri={requestIcon} />
</View>
) : (
<Image
style={styles.dappLogo}
source={{ uri: requestIcon }}
/>
)}
</>
)}
<Text>{requestName}</Text>
<Text variant="bodyMedium">{requestURL}</Text>
</View>
<AccountDetails account={account} />
{isCosmosSignDirect || isEthSendTransaction ? (
<View style={styles.requestDirectMessage}>
<ScrollView nestedScrollEnabled>
<>
<ScrollView contentContainerStyle={styles.appContainer}>
<View style={styles.dappDetails}>
{requestIcon && (
<>
{requestIcon.endsWith('.svg') ? (
<View style={styles.dappLogo}>
<SvgUri height="50" width="50" uri={requestIcon} />
</View>
) : (
<Image
style={styles.dappLogo}
source={{ uri: requestIcon }}
/>
)}
</>
)}
<Text>{requestName}</Text>
<Text variant="bodyMedium">{requestURL}</Text>
</View>
<AccountDetails account={account} />
{isCosmosSignDirect || isEthSendTransaction ? (
<View style={styles.requestDirectMessage}>
<ScrollView nestedScrollEnabled>
<Text variant="bodyLarge">{message}</Text>
</ScrollView>
</View>
) : (
<View style={styles.requestMessage}>
<Text variant="bodyLarge">{message}</Text>
</ScrollView>
</View>
) : (
<View style={styles.requestMessage}>
<Text variant="bodyLarge">{message}</Text>
</View>
)}
</View>
)}
</ScrollView>
<View style={styles.buttonContainer}>
<Button mode="contained" onPress={signMessageHandler}>
Yes
@ -264,7 +265,7 @@ const SignRequest = ({ route }: SignRequestProps) => {
No
</Button>
</View>
</ScrollView>
</>
)}
</>
);

View File

@ -125,21 +125,21 @@ const styles = StyleSheet.create({
requestDirectMessage: {
borderWidth: 1,
borderRadius: 5,
marginTop: 50,
height: '40%',
marginTop: 20,
marginBottom: 50,
height: 500,
alignItems: 'center',
justifyContent: 'center',
padding: 8,
},
approveTransaction: {
height: '40%',
marginBottom: 30,
},
// TODO: Fix button position
buttonContainer: {
flexDirection: 'row',
marginLeft: 20,
marginTop: 20,
marginBottom: 150,
marginBottom: 10,
justifyContent: 'space-evenly',
},
badRequestContainer: {