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

FIX: Update drawer view for nav 6 (#5843)

Browse Source
This commit is contained in:
Marcos Rodriguez Vélez 2023-11-20 16:02:47 -04:00 committed by GitHub
parent 08d61d507f
commit 294790bc4a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 56 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
Navigation.js
View File

@ -352,16 +352,18 @@ const DrawerRoot = () => {
const isLargeScreen = useMemo(() => {
return Platform.OS === 'android' ? isTablet() : (dimensions.width >= Dimensions.get('screen').width / 2 && isTablet()) || isDesktop;
}, [dimensions.width]);
const drawerStyle = useMemo(() => ({ width: isLargeScreen ? 320 : '0%' }), [isLargeScreen]);
const drawerContent = useCallback(props => (isLargeScreen ? <DrawerList {...props} /> : null), [isLargeScreen]);
const drawerStyle = useMemo(
() => ({
drawerPosition: I18nManager.isRTL ? 'right' : 'left',
drawerStyle: { width: isLargeScreen ? 320 : '0%' },
drawerType: isLargeScreen ? 'permanent' : 'back',
}),
[isLargeScreen],
);
const drawerContent = useCallback(props => <DrawerList {...props} />, []);
return (
<Drawer.Navigator
screenOptions={drawerStyle}
drawerType={isLargeScreen ? 'permanent' : null}
drawerContent={drawerContent}
drawerPosition={I18nManager.isRTL ? 'right' : 'left'}
>
<Drawer.Navigator screenOptions={drawerStyle} drawerContent={drawerContent}>
<Drawer.Screen name="Navigation" component={Navigation} options={{ headerShown: false, gestureEnabled: false }} />
</Drawer.Navigator>
);
@ -509,13 +511,14 @@ const PaymentCodeStackRoot = () => {
const RootStack = createNativeStackNavigator();
const NavigationDefaultOptions = { headerShown: false, presentation: isDesktop ? 'containedModal' : 'modal' };
const NavigationFormModalOptions = { headerShown: false, presentation: isDesktop ? 'containedModal' : 'formSheet' };
const StatusBarLightOptions = { statusBarStyle: 'light' };
const Navigation = () => {
return (
<RootStack.Navigator initialRouteName="UnlockWithScreenRoot" screenOptions={{ headerHideShadow: true, statusBarStyle: 'auto' }}>
{/* stacks */}
<RootStack.Screen name="WalletsRoot" component={WalletsRoot} options={{ headerShown: false, translucent: false }} />
<RootStack.Screen name="AddWalletRoot" component={AddWalletRoot} options={NavigationDefaultOptions} />
<RootStack.Screen name="AddWalletRoot" component={AddWalletRoot} options={NavigationFormModalOptions} />
<RootStack.Screen name="SendDetailsRoot" component={SendDetailsRoot} options={NavigationDefaultOptions} />
<RootStack.Screen name="LNDCreateInvoiceRoot" component={LNDCreateInvoiceRoot} options={NavigationDefaultOptions} />
<RootStack.Screen name="ScanLndInvoiceRoot" component={ScanLndInvoiceRoot} options={NavigationDefaultOptions} />

6
blue_modules/storage-context.js
View File

@ -19,7 +19,7 @@ export const WalletTransactionsStatus = { NONE: false, ALL: true };
export const BlueStorageContext = createContext();
export const BlueStorageProvider = ({ children }) => {
const [wallets, setWallets] = useState([]);
const [selectedWallet, setSelectedWallet] = useState('');
const [selectedWalletID, setSelectedWalletID] = useState('');
const [walletTransactionUpdateStatus, setWalletTransactionUpdateStatus] = useState(WalletTransactionsStatus.NONE);
const [walletsInitialized, setWalletsInitialized] = useState(false);
const [preferredFiatCurrency, _setPreferredFiatCurrency] = useState(FiatUnit.USD);
@ -241,8 +241,8 @@ export const BlueStorageProvider = ({ children }) => {
txMetadata,
saveToDisk,
getTransactions,
selectedWallet,
setSelectedWallet,
selectedWalletID,
setSelectedWalletID,
addWallet,
deleteWallet,
currentSharedCosigner,

38
components/WalletsCarousel.js
View File

@ -21,7 +21,7 @@ import { LightningCustodianWallet, LightningLdkWallet, MultisigHDWallet } from '
import WalletGradient from '../class/wallet-gradient';
import { BluePrivateBalance } from '../BlueComponents';
import { BlueStorageContext } from '../blue_modules/storage-context';
import { isHandset, isTablet, isDesktop } from '../blue_modules/environment';
import { isTablet, isDesktop } from '../blue_modules/environment';
import { useTheme } from './themes';
const nStyles = StyleSheet.create({
@ -137,7 +137,7 @@ const iStyles = StyleSheet.create({
},
});
const WalletCarouselItem = ({ item, index, onPress, handleLongPress, isSelectedWallet }) => {
const WalletCarouselItem = ({ item, _, onPress, handleLongPress, isSelectedWallet }) => {
const scaleValue = new Animated.Value(1.0);
const { colors } = useTheme();
const { walletTransactionUpdateStatus } = useContext(BlueStorageContext);
@ -239,7 +239,6 @@ const WalletCarouselItem = ({ item, index, onPress, handleLongPress, isSelectedW
WalletCarouselItem.propTypes = {
item: PropTypes.any,
index: PropTypes.number.isRequired,
onPress: PropTypes.func.isRequired,
handleLongPress: PropTypes.func.isRequired,
isSelectedWallet: PropTypes.bool,
@ -262,21 +261,22 @@ const ListHeaderComponent = () => <View style={cStyles.separatorStyle} />;
const WalletsCarousel = forwardRef((props, ref) => {
const { preferredFiatCurrency, language } = useContext(BlueStorageContext);
const { horizontal, data, handleLongPress, onPress, selectedWallet } = props;
const renderItem = useCallback(
({ item, index }) =>
item ? (
<WalletCarouselItem
isSelectedWallet={!props.horizontal && props.selectedWallet ? props.selectedWallet === item.getID() : undefined}
isSelectedWallet={!horizontal && selectedWallet ? selectedWallet === item.getID() : undefined}
item={item}
index={index}
handleLongPress={props.handleLongPress}
onPress={props.onPress}
handleLongPress={handleLongPress}
onPress={onPress}
/>
) : (
<NewWalletPanel onPress={props.onPress} />
<NewWalletPanel onPress={onPress} />
),
// eslint-disable-next-line react-hooks/exhaustive-deps
[props.horizontal, props.selectedWallet, props.handleLongPress, props.onPress, preferredFiatCurrency, language],
[horizontal, selectedWallet, handleLongPress, onPress, preferredFiatCurrency, language],
);
const flatListRef = useRef();
@ -298,7 +298,7 @@ const WalletsCarousel = forwardRef((props, ref) => {
console.log(error);
flatListRef.current.scrollToOffset({ offset: error.averageItemLength * error.index, animated: true });
setTimeout(() => {
if (props.data.length !== 0 && flatListRef.current !== null) {
if (data.length !== 0 && flatListRef.current !== null) {
flatListRef.current.scrollToIndex({ index: error.index, animated: true });
}
}, 100);
@ -307,40 +307,40 @@ const WalletsCarousel = forwardRef((props, ref) => {
const { width } = useWindowDimensions();
const sliderHeight = 195;
const itemWidth = width * 0.82 > 375 ? 375 : width * 0.82;
return isHandset ? (
return horizontal ? (
<FlatList
ref={flatListRef}
renderItem={renderItem}
extraData={props.data}
extraData={data}
keyExtractor={(_, index) => index.toString()}
showsVerticalScrollIndicator={false}
pagingEnabled
disableIntervalMomentum={isHandset}
disableIntervalMomentum={horizontal}
snapToInterval={itemWidth} // Adjust to your content width
decelerationRate="fast"
contentContainerStyle={props.horizontal ? cStyles.content : cStyles.contentLargeScreen}
contentContainerStyle={cStyles.content}
directionalLockEnabled
showsHorizontalScrollIndicator={false}
initialNumToRender={10}
ListHeaderComponent={ListHeaderComponent}
style={props.horizontal ? { minHeight: sliderHeight + 9 } : {}}
style={{ minHeight: sliderHeight + 9 }}
onScrollToIndexFailed={onScrollToIndexFailed}
{...props}
/>
) : (
<View style={cStyles.contentLargeScreen}>
{props.data.map((item, index) =>
{data.map((item, index) =>
item ? (
<WalletCarouselItem
isSelectedWallet={!props.horizontal && props.selectedWallet ? props.selectedWallet === item.getID() : undefined}
isSelectedWallet={!horizontal && selectedWallet ? selectedWallet === item.getID() : undefined}
item={item}
index={index}
handleLongPress={props.handleLongPress}
onPress={props.onPress}
handleLongPress={handleLongPress}
onPress={onPress}
key={index}
/>
) : (
<NewWalletPanel key={index} onPress={props.onPress} />
<NewWalletPanel key={index} onPress={onPress} />
),
)}
</View>

6
ios/BlueWallet.xcodeproj/project.pbxproj
View File

@ -817,7 +817,7 @@
);
mainGroup = 83CBB9F61A601CBA00E9B192;
packageReferences = (
6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode" */,
6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode.git" */,
);
productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;
projectDirPath = "";
@ -1822,7 +1822,7 @@
/* End XCConfigurationList section */
/* Begin XCRemoteSwiftPackageReference section */
6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode" */ = {
6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode.git" */ = {
isa = XCRemoteSwiftPackageReference;
repositoryURL = "https://github.com/EFPrefix/EFQRCode.git";
requirement = {
@ -1835,7 +1835,7 @@
/* Begin XCSwiftPackageProductDependency section */
6DFC806F24EA0B6C007B8700 /* EFQRCode */ = {
isa = XCSwiftPackageProductDependency;
package = 6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode" */;
package = 6DFC806E24EA0B6C007B8700 /* XCRemoteSwiftPackageReference "EFQRCode.git" */;
productName = EFQRCode;
};
/* End XCSwiftPackageProductDependency section */

6
screen/lnd/lndCreateInvoice.js
View File

@ -36,7 +36,7 @@ const currency = require('../../blue_modules/currency');
const torrific = isTorCapable ? require('../../blue_modules/torrific') : require('../../scripts/maccatalystpatches/torrific.js');
const LNDCreateInvoice = () => {
const { wallets, saveToDisk, setSelectedWallet, isTorDisabled } = useContext(BlueStorageContext);
const { wallets, saveToDisk, setSelectedWalletID, isTorDisabled } = useContext(BlueStorageContext);
const { walletID, uri } = useRoute().params;
const wallet = useRef(wallets.find(item => item.getID() === walletID) || wallets.find(item => item.chain === Chain.OFFCHAIN));
const { name } = useRoute();
@ -106,7 +106,7 @@ const LNDCreateInvoice = () => {
const newWallet = wallets.find(w => w.getID() === walletID);
if (newWallet) {
wallet.current = newWallet;
setSelectedWallet(newWallet.getID());
setSelectedWalletID(newWallet.getID());
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
@ -115,7 +115,7 @@ const LNDCreateInvoice = () => {
useFocusEffect(
useCallback(() => {
if (wallet.current) {
setSelectedWallet(walletID);
setSelectedWalletID(walletID);
if (wallet.current.getUserHasSavedExport()) {
renderReceiveDetails();
} else {

4
screen/lnd/lndViewInvoice.js
View File

@ -17,7 +17,7 @@ import Button from '../../components/Button';
const LNDViewInvoice = () => {
const { invoice, walletID } = useRoute().params;
const { wallets, setSelectedWallet, fetchAndSaveWalletTransactions } = useContext(BlueStorageContext);
const { wallets, setSelectedWalletID, fetchAndSaveWalletTransactions } = useContext(BlueStorageContext);
const wallet = wallets.find(w => w.getID() === walletID);
const { colors, closeImage } = useTheme();
const { goBack, navigate, setParams, setOptions, getParent } = useNavigation();
@ -98,7 +98,7 @@ const LNDViewInvoice = () => {
}, [colors, isModal]);
useEffect(() => {
setSelectedWallet(walletID);
setSelectedWalletID(walletID);
console.log('LNDViewInvoice - useEffect');
if (!invoice.ispaid) {
fetchInvoiceInterval.current = setInterval(async () => {

4
screen/send/details.js
View File

@ -49,7 +49,7 @@ const fs = require('../../blue_modules/fs');
const btcAddressRx = /^[a-zA-Z0-9]{26,35}$/;
const SendDetails = () => {
const { wallets, setSelectedWallet, sleep, txMetadata, saveToDisk } = useContext(BlueStorageContext);
const { wallets, setSelectedWalletID, sleep, txMetadata, saveToDisk } = useContext(BlueStorageContext);
const navigation = useNavigation();
const { name, params: routeParams } = useRoute();
const scrollView = useRef();
@ -230,7 +230,7 @@ const SendDetails = () => {
// change header and reset state on wallet change
useEffect(() => {
if (!wallet) return;
setSelectedWallet(wallet.getID());
setSelectedWalletID(wallet.getID());
// reset other values
setUtxo(null);

4
screen/transactions/transactionStatus.js
View File

@ -25,7 +25,7 @@ const buttonStatus = Object.freeze({
});
const TransactionsStatus = () => {
const { setSelectedWallet, wallets, txMetadata, fetchAndSaveWalletTransactions } = useContext(BlueStorageContext);
const { setSelectedWalletID, wallets, txMetadata, fetchAndSaveWalletTransactions } = useContext(BlueStorageContext);
const { hash, walletID } = useRoute().params;
const { navigate, setOptions, goBack } = useNavigation();
const { colors } = useTheme();
@ -196,7 +196,7 @@ const TransactionsStatus = () => {
useEffect(() => {
const wID = wallet.current?.getID();
if (wID) {
setSelectedWallet(wallet.current?.getID());
setSelectedWalletID(wallet.current?.getID());
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [wallet.current]);

4
screen/wallets/details.js
View File

@ -119,7 +119,7 @@ const styles = StyleSheet.create({
});
const WalletDetails = () => {
const { saveToDisk, wallets, deleteWallet, setSelectedWallet, txMetadata } = useContext(BlueStorageContext);
const { saveToDisk, wallets, deleteWallet, setSelectedWalletID, txMetadata } = useContext(BlueStorageContext);
const { walletID } = useRoute().params;
const [isLoading, setIsLoading] = useState(false);
const [backdoorPressed, setBackdoorPressed] = useState(0);
@ -226,7 +226,7 @@ const WalletDetails = () => {
useEffect(() => {
if (wallets.some(w => w.getID() === walletID)) {
setSelectedWallet(walletID);
setSelectedWalletID(walletID);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [walletID]);

5
screen/wallets/drawerList.js
View File

@ -13,7 +13,7 @@ import { useTheme } from '../../components/themes';
const DrawerList = props => {
const walletsCarousel = useRef();
const { wallets, selectedWallet } = useContext(BlueStorageContext);
const { wallets, selectedWalletID, setSelectedWalletID } = useContext(BlueStorageContext);
const { colors } = useTheme();
const walletsCount = useRef(wallets.length);
const isFocused = useIsFocused();
@ -33,6 +33,7 @@ const DrawerList = props => {
const handleClick = item => {
if (item?.getID) {
const walletID = item.getID();
setSelectedWalletID(walletID);
props.navigation.navigate('WalletTransactions', {
walletID: item.getID(),
walletType: item.type,
@ -72,7 +73,7 @@ const DrawerList = props => {
handleLongPress={handleLongPress}
ref={walletsCarousel}
testID="WalletsList"
selectedWallet={selectedWallet}
selectedWallet={selectedWalletID}
scrollEnabled={isFocused}
/>
</DrawerContentScrollView>

4
screen/wallets/list.js
View File

@ -36,7 +36,7 @@ const WalletsListSections = { CAROUSEL: 'CAROUSEL', TRANSACTIONS: 'TRANSACTIONS'
const WalletsList = () => {
const walletsCarousel = useRef();
const currentWalletIndex = useRef(0);
const { wallets, getTransactions, getBalance, refreshAllWalletTransactions, setSelectedWallet, isElectrumDisabled } =
const { wallets, getTransactions, getBalance, refreshAllWalletTransactions, setSelectedWalletID, isElectrumDisabled } =
useContext(BlueStorageContext);
const { width } = useWindowDimensions();
const { colors, scanImage } = useTheme();
@ -66,7 +66,7 @@ const WalletsList = () => {
useFocusEffect(
useCallback(() => {
verifyBalance();
setSelectedWallet('');
setSelectedWalletID(undefined);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []),
);

6
screen/wallets/transactions.js
View File

@ -45,7 +45,7 @@ const buttonFontSize =
: PixelRatio.roundToNearestPixel(Dimensions.get('window').width / 26);
const WalletTransactions = ({ navigation }) => {
const { wallets, saveToDisk, setSelectedWallet, walletTransactionUpdateStatus, isElectrumDisabled } = useContext(BlueStorageContext);
const { wallets, saveToDisk, setSelectedWalletID, walletTransactionUpdateStatus, isElectrumDisabled } = useContext(BlueStorageContext);
const [isLoading, setIsLoading] = useState(false);
const { walletID } = useRoute().params;
const { name } = useRoute();
@ -129,7 +129,7 @@ const WalletTransactions = ({ navigation }) => {
setTimeElapsed(0);
setItemPriceUnit(wallet.getPreferredBalanceUnit());
setIsLoading(false);
setSelectedWallet(wallet.getID());
setSelectedWalletID(wallet.getID());
setDataSource([...getTransactionsSliced(limit)]);
setOptions({
headerStyle: {
@ -141,7 +141,7 @@ const WalletTransactions = ({ navigation }) => {
},
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [walletID]);
}, [wallet]);
useEffect(() => {
const newWallet = wallets.find(w => w.getID() === walletID);