mirrors/BlueWallet
1
0
Fork 0
mirror of https://github.com/BlueWallet/BlueWallet.git synced 2025-02-21 14:34:55 +01:00
Code Issues Projects Releases Packages Wiki Activity

REF: Use builtin subtitle prop for ListItem (#7115)

Browse source
This commit is contained in:
Marcos Rodriguez Vélez 2024-10-11 00:01:15 -04:00 • committed by GitHub
parent 5739bbd7eb
commit 7d141700a7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 78 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
components/ListItem.tsx
View file

@ -98,6 +98,8 @@ const ListItem: React.FC<ListItemProps> = React.memo(
writingDirection: I18nManager.isRTL ? 'rtl' : 'ltr',
color: colors.alternativeTextColor,
fontWeight: '400',
paddingVertical: switchProps ? 8 : 0,
lineHeight: 20,
fontSize: 14,
},
@ -130,7 +132,7 @@ const ListItem: React.FC<ListItemProps> = React.memo(
</RNElementsListItem.Title>
{subtitle && (
<RNElementsListItem.Subtitle
numberOfLines={subtitleNumberOfLines ?? 1}
numberOfLines={switchProps ? 0 : (subtitleNumberOfLines ?? 1)}
accessible={switchProps === undefined}
style={stylesHook.subtitle}
>
@ -152,7 +154,9 @@ const ListItem: React.FC<ListItemProps> = React.memo(
<>
{chevron && <RNElementsListItem.Chevron iconStyle={{ transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }] }} />}
{rightIcon && <Avatar icon={rightIcon} />}
{switchProps && <Switch {...memoizedSwitchProps} accessibilityLabel={title} accessible accessibilityRole="switch" />}
{switchProps && (
<Switch {...memoizedSwitchProps} accessibilityLabel={title} style={styles.margin16} accessible accessibilityRole="switch" />
)}
{checkmark && (
<RNElementsListItem.CheckBox
iconRight
@ -216,5 +220,8 @@ const styles = StyleSheet.create({
margin8: {
margin: 8,
},
margin16: {
marginLeft: 16,
},
width16: { width: 16 },
});

6
screen/settings/DefaultView.tsx
View file

@ -2,7 +2,6 @@ import { useNavigation } from '@react-navigation/native';
import { NativeStackNavigationProp } from '@react-navigation/native-stack';
import React, { useEffect, useReducer } from 'react';
import { ScrollView, TouchableWithoutFeedback, View } from 'react-native';
import { BlueCard, BlueText } from '../../BlueComponents';
import { TWallet } from '../../class/wallets/types';
import ListItem from '../../components/ListItem';
import useOnAppLaunch from '../../hooks/useOnAppLaunch';
@ -105,10 +104,9 @@ const DefaultView: React.FC = () => {
value: state.isViewAllWalletsSwitchEnabled,
disabled: wallets.length <= 0,
}}
subtitle={loc.settings.default_desc}
/>
<BlueCard>
<BlueText>{loc.settings.default_desc}</BlueText>
</BlueCard>
{!state.isViewAllWalletsSwitchEnabled && (
<ListItem
title={loc.settings.default_info}

56
screen/settings/EncryptStorage.tsx
View file

@ -1,7 +1,5 @@
import React, { useCallback, useEffect, useReducer, useRef } from 'react';
import { Alert, Platform, ScrollView, StyleSheet, Text, TouchableWithoutFeedback, View } from 'react-native';
import { BlueCard, BlueSpacing20, BlueText } from '../../BlueComponents';
import presentAlert from '../../components/Alert';
import ListItem, { TouchableOpacityWrapper } from '../../components/ListItem';
import { useTheme } from '../../components/themes';
import { unlockWithBiometrics, useBiometrics } from '../../hooks/useBiometrics';
@ -13,6 +11,9 @@ import PromptPasswordConfirmationModal, {
PromptPasswordConfirmationModalHandle,
} from '../../components/PromptPasswordConfirmationModal';
import { popToTop } from '../../NavigationService';
import presentAlert from '../../components/Alert';
import { Header } from '../../components/Header';
import { BlueSpacing20 } from '../../BlueComponents';
enum ActionType {
SetLoading = 'SET_LOADING',
@ -72,9 +73,6 @@ const EncryptStorage = () => {
root: {
backgroundColor: colors.background,
},
headerText: {
color: colors.foregroundColor,
},
});
const initializeState = useCallback(async () => {
@ -139,15 +137,6 @@ const EncryptStorage = () => {
navigate('PlausibleDeniability');
};
const renderPasscodeExplanation = () => {
return Platform.OS === 'android' && Platform.Version >= 30 ? (
<>
<BlueText />
<BlueText>{loc.formatString(loc.settings.biometrics_fail, { type: deviceBiometricType! })}</BlueText>
</>
) : null;
};
return (
<ScrollView
contentContainerStyle={[styles.root, styleHooks.root]}
@ -157,26 +146,30 @@ const EncryptStorage = () => {
<View style={styles.paddingTop} />
{state.deviceBiometricCapable && (
<>
<Text adjustsFontSizeToFit style={[styles.headerText, styleHooks.headerText]}>
{loc.settings.biometrics}
</Text>
<Header leftText={loc.settings.biometrics} />
<ListItem
title={loc.formatString(loc.settings.encrypt_use, { type: deviceBiometricType! })}
Component={TouchableWithoutFeedback}
switch={{ value: biometricEnabled, onValueChange: onUseBiometricSwitch, disabled: state.currentLoadingSwitch !== null }}
switch={{
value: biometricEnabled,
onValueChange: onUseBiometricSwitch,
disabled: state.currentLoadingSwitch !== null,
}}
isLoading={state.currentLoadingSwitch === 'biometric' && state.isLoading}
containerStyle={[styles.row, styleHooks.root]}
subtitle={
<>
<Text style={styles.subtitleText}>{loc.formatString(loc.settings.encrypt_use_expl, { type: deviceBiometricType! })}</Text>
{Platform.OS === 'android' && Platform.Version >= 30 && (
<Text style={styles.subtitleText}>{loc.formatString(loc.settings.biometrics_fail, { type: deviceBiometricType! })}</Text>
)}
</>
}
/>
<BlueCard>
<BlueText>{loc.formatString(loc.settings.encrypt_use_expl, { type: deviceBiometricType! })}</BlueText>
{renderPasscodeExplanation()}
</BlueCard>
<BlueSpacing20 />
</>
)}
<Text adjustsFontSizeToFit style={[styles.headerText, styleHooks.headerText]}>
{loc.settings.encrypt_tstorage}
</Text>
<BlueSpacing20 />
<Header leftText={loc.settings.encrypt_tstorage} />
<ListItem
testID="EncyptedAndPasswordProtected"
title={loc.settings.encrypt_enc_and_pass}
@ -211,7 +204,7 @@ const EncryptStorage = () => {
dispatch({ type: ActionType.SetModalType, payload: MODAL_TYPES.SUCCESS });
success = true;
} catch (error) {
presentAlert({ title: loc.errors.error, message: (error as Error).message });
presentAlert({ message: (error as Error).message });
success = false;
}
} else if (state.modalType === MODAL_TYPES.ENTER_PASSWORD) {
@ -243,12 +236,11 @@ const styles = StyleSheet.create({
flex: 1,
},
paddingTop: { paddingTop: 19 },
headerText: {
fontWeight: 'bold',
fontSize: 30,
marginLeft: 17,
},
row: { minHeight: 60 },
subtitleText: {
fontSize: 14,
marginTop: 5,
},
});
export default EncryptStorage;

8
screen/settings/GeneralSettings.tsx
View file

@ -1,7 +1,7 @@
import { useNavigation } from '@react-navigation/native';
import React from 'react';
import { Platform, ScrollView, StyleSheet } from 'react-native';
import { BlueCard, BlueSpacing20, BlueText } from '../../BlueComponents';
import { BlueSpacing20 } from '../../BlueComponents';
import ListItem, { PressableWrapper } from '../../components/ListItem';
import { useTheme } from '../../components/themes';
import loc from '../../loc';
@ -50,14 +50,10 @@ const GeneralSettings: React.FC = () => {
title={loc.settings.general_continuity}
Component={PressableWrapper}
switch={{ onValueChange: onHandOffUseEnabledChange, value: isHandOffUseEnabled }}
subtitle={loc.settings.general_continuity_e}
/>
<BlueCard>
<BlueText>{loc.settings.general_continuity_e}</BlueText>
</BlueCard>
<BlueSpacing20 />
</>
) : null}
<BlueSpacing20 />
<ListItem
Component={PressableWrapper}
title="Legacy URv1 QR"

80
screen/settings/SettingsPrivacy.tsx
View file

@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react';
import { Platform, Pressable, ScrollView, StyleSheet, Text, TouchableWithoutFeedback, View } from 'react-native';
import { openSettings } from 'react-native-permissions';
import A from '../../blue_modules/analytics';
import { BlueCard, BlueSpacing20, BlueSpacing40, BlueText } from '../../BlueComponents';
import { Header } from '../../components/Header';
import ListItem, { PressableWrapper } from '../../components/ListItem';
import { useTheme } from '../../components/themes';
@ -10,6 +9,7 @@ import { setBalanceDisplayAllowed } from '../../components/WidgetCommunication';
import loc from '../../loc';
import { useStorage } from '../../hooks/context/useStorage';
import { useSettings } from '../../hooks/context/useSettings';
import { BlueSpacing20 } from '../../BlueComponents';
enum SettingsPrivacySection {
None,
@ -45,9 +45,6 @@ const SettingsPrivacy: React.FC = () => {
root: {
backgroundColor: colors.background,
},
widgetsHeader: {
color: colors.foregroundColor,
},
});
useEffect(() => {
@ -130,13 +127,13 @@ const SettingsPrivacy: React.FC = () => {
disabled: isLoading === SettingsPrivacySection.All,
testID: 'ClipboardSwitch',
}}
subtitle={
<Pressable accessibilityRole="button">
<Text style={styles.subtitleText}>{loc.settings.privacy_clipboard_explanation}</Text>
</Pressable>
}
/>
<BlueCard>
<Pressable accessibilityRole="button">
<BlueText>{loc.settings.privacy_clipboard_explanation}</BlueText>
</Pressable>
</BlueCard>
<BlueSpacing20 />
<ListItem
title={loc.settings.privacy_quickactions}
Component={TouchableWithoutFeedback}
@ -146,12 +143,14 @@ const SettingsPrivacy: React.FC = () => {
disabled: isLoading === SettingsPrivacySection.All || storageIsEncrypted,
testID: 'QuickActionsSwitch',
}}
subtitle={
<>
<Text style={styles.subtitleText}>{loc.settings.privacy_quickactions_explanation}</Text>
{storageIsEncrypted && <Text style={styles.subtitleText}>{loc.settings.encrypted_feature_disabled}</Text>}
</>
}
/>
<BlueCard>
<BlueText>{loc.settings.privacy_quickactions_explanation}</BlueText>
<BlueSpacing20 />
{storageIsEncrypted && <BlueText>{loc.settings.encrypted_feature_disabled}</BlueText>}
</BlueCard>
<ListItem
title={loc.total_balance_view.title}
Component={PressableWrapper}
@ -161,11 +160,9 @@ const SettingsPrivacy: React.FC = () => {
disabled: isLoading === SettingsPrivacySection.All || wallets.length < 2,
testID: 'TotalBalanceSwitch',
}}
subtitle={<Text style={styles.subtitleText}>{loc.total_balance_view.explanation}</Text>}
/>
<BlueCard>
<BlueText>{loc.total_balance_view.explanation}</BlueText>
<BlueSpacing20 />
</BlueCard>
<ListItem
title={loc.settings.privacy_temporary_screenshots}
Component={TouchableWithoutFeedback}
@ -174,24 +171,24 @@ const SettingsPrivacy: React.FC = () => {
value: !isPrivacyBlurEnabled,
disabled: isLoading === SettingsPrivacySection.All,
}}
subtitle={<Text style={styles.subtitleText}>{loc.settings.privacy_temporary_screenshots_instructions}</Text>}
/>
<BlueCard>
<BlueText>{loc.settings.privacy_temporary_screenshots_instructions}</BlueText>
</BlueCard>
<ListItem
title={loc.settings.privacy_do_not_track}
Component={TouchableWithoutFeedback}
switch={{ onValueChange: onDoNotTrackValueChange, value: isDoNotTrackEnabled, disabled: isLoading === SettingsPrivacySection.All }}
switch={{
onValueChange: onDoNotTrackValueChange,
value: isDoNotTrackEnabled,
disabled: isLoading === SettingsPrivacySection.All,
}}
subtitle={<Text style={styles.subtitleText}>{loc.settings.privacy_do_not_track_explanation}</Text>}
/>
<BlueCard>
<BlueText>{loc.settings.privacy_do_not_track_explanation}</BlueText>
</BlueCard>
{Platform.OS === 'ios' && (
<>
<BlueSpacing40 />
<Text adjustsFontSizeToFit style={[styles.widgetsHeader, styleHooks.widgetsHeader]}>
{loc.settings.widgets}
</Text>
<BlueSpacing20 />
<Header leftText={loc.settings.widgets} />
<ListItem
title={loc.settings.total_balance}
Component={TouchableWithoutFeedback}
@ -200,18 +197,17 @@ const SettingsPrivacy: React.FC = () => {
value: storageIsEncrypted ? false : isWidgetBalanceDisplayAllowed,
disabled: isLoading === SettingsPrivacySection.All || storageIsEncrypted,
}}
subtitle={
<>
<Text style={styles.subtitleText}>{loc.settings.total_balance_explanation}</Text>
{storageIsEncrypted && <Text style={styles.subtitleText}>{loc.settings.encrypted_feature_disabled}</Text>}
</>
}
/>
<BlueCard>
<BlueText>{loc.settings.total_balance_explanation}</BlueText>
<BlueSpacing20 />
{storageIsEncrypted && <BlueText>{loc.settings.encrypted_feature_disabled}</BlueText>}
</BlueCard>
</>
)}
<BlueSpacing20 />
<ListItem title={loc.settings.privacy_system_settings} chevron onPress={openApplicationSettings} testID="PrivacySystemSettings" />
<BlueSpacing20 />
</ScrollView>
);
};
@ -220,14 +216,14 @@ const styles = StyleSheet.create({
root: {
flex: 1,
},
widgetsHeader: {
fontWeight: 'bold',
fontSize: 30,
marginLeft: 17,
},
headerContainer: {
paddingVertical: 16,
},
subtitleText: {
fontSize: 14,
marginTop: 5,
},
});
export default SettingsPrivacy;

5
screen/settings/electrumSettings.js
View file

@ -416,10 +416,9 @@ export default class ElectrumSettings extends Component {
value: this.state.isOfflineMode,
testID: 'ElectrumConnectionEnabledSwitch',
}}
subtitle={loc.settings.electrum_offline_description}
/>
<BlueCard>
<BlueText>{loc.settings.electrum_offline_description}</BlueText>
</BlueCard>
{!this.state.isOfflineMode && this.renderElectrumSettings()}
</ScrollView>
);

5
screen/settings/notificationSettings.js
View file

@ -105,14 +105,11 @@ const NotificationSettings = () => {
<ListItem
Component={TouchableWithoutFeedback}
title={loc.settings.push_notifications}
subtitle={loc.settings.groundcontrol_explanation}
switch={{ onValueChange: onNotificationsSwitch, value: isNotificationsEnabled, testID: 'NotificationsSwitch' }}
/>
<BlueSpacing20 />
<BlueCard>
<BlueText>{loc.settings.groundcontrol_explanation}</BlueText>
</BlueCard>
<ButtonRNElements
icon={{
name: 'github',