Skip to content

Commit

Permalink
REF: Lazy Load Add Wallet
Browse files Browse the repository at this point in the history
  • Loading branch information
marcosrdz committed May 5, 2024
1 parent 1384c84 commit 105997a
Show file tree
Hide file tree
Showing 20 changed files with 240 additions and 132 deletions.
79 changes: 2 additions & 77 deletions Navigation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { DrawerNavigationOptions, createDrawerNavigator } from '@react-navigatio
import { NativeStackNavigationOptions, createNativeStackNavigator } from '@react-navigation/native-stack';
import React, { useContext, useMemo } from 'react';
import { I18nManager, Platform } from 'react-native';
import AddWalletStack from './navigation/AddWalletStack';

import PlausibleDeniability from './screen/PlausibleDeniability';
import Selftest from './screen/selftest';
Expand All @@ -19,25 +20,12 @@ import LightningSettings from './screen/settings/lightningSettings';
import NotificationSettings from './screen/settings/notificationSettings';
import ReleaseNotes from './screen/settings/releasenotes';
import Tools from './screen/settings/tools';

import AddWallet from './screen/wallets/Add';
import WalletsAddMultisig from './screen/wallets/addMultisig';
import WalletsAddMultisigHelp, { WalletAddMultisigHelpNavigationOptions } from './screen/wallets/addMultisigHelp';
import WalletsAddMultisigStep2 from './screen/wallets/addMultisigStep2';
import WalletAddresses from './screen/wallets/addresses';
import WalletDetails from './screen/wallets/details';
import WalletExport from './screen/wallets/export';
import ExportMultisigCoordinationSetup from './screen/wallets/ExportMultisigCoordinationSetup';
import GenerateWord from './screen/wallets/generateWord';
import ImportWallet from './screen/wallets/import';
import ImportCustomDerivationPath from './screen/wallets/importCustomDerivationPath';
import ImportWalletDiscovery from './screen/wallets/importDiscovery';
import ImportSpeed from './screen/wallets/importSpeed';
import WalletsList from './screen/wallets/WalletsList';
import PleaseBackup from './screen/wallets/PleaseBackup';
import PleaseBackupLNDHub from './screen/wallets/pleaseBackupLNDHub';
import PleaseBackupLdk from './screen/wallets/pleaseBackupLdk';
import ProvideEntropy from './screen/wallets/provideEntropy';
import ReorderWallets from './screen/wallets/reorderWallets';
import SelectWallet from './screen/wallets/selectWallet';
import SignVerify from './screen/wallets/signVerify';
Expand Down Expand Up @@ -89,69 +77,6 @@ import PaymentCodesList from './screen/wallets/paymentCodesList';
import { BlueStorageContext } from './blue_modules/storage-context';
import { useIsLargeScreen } from './hooks/useIsLargeScreen';

const AddWalletStack = createNativeStackNavigator();
const AddWalletRoot = () => {
const theme = useTheme();

return (
<AddWalletStack.Navigator screenOptions={{ headerShadowVisible: false }}>
<AddWalletStack.Screen
name="AddWallet"
component={AddWallet}
options={navigationStyle({
closeButton: true,
headerBackVisible: false,
title: loc.wallets.add_title,
})(theme)}
/>
<AddWalletStack.Screen name="ImportWallet" component={ImportWallet} options={ImportWallet.navigationOptions(theme)} />
<AddWalletStack.Screen
name="ImportWalletDiscovery"
component={ImportWalletDiscovery}
options={ImportWalletDiscovery.navigationOptions(theme)}
/>
<AddWalletStack.Screen
name="ImportCustomDerivationPath"
component={ImportCustomDerivationPath}
options={ImportCustomDerivationPath.navigationOptions(theme)}
/>
<AddWalletStack.Screen name="ImportSpeed" component={ImportSpeed} options={ImportSpeed.navigationOptions(theme)} />
<AddWalletStack.Screen
name="PleaseBackup"
component={PleaseBackup}
options={navigationStyle({
gestureEnabled: false,
headerBackVisible: false,
title: loc.pleasebackup.title,
})(theme)}
/>
<AddWalletStack.Screen
name="PleaseBackupLNDHub"
component={PleaseBackupLNDHub}
options={PleaseBackupLNDHub.navigationOptions(theme)}
/>
<AddWalletStack.Screen name="PleaseBackupLdk" component={PleaseBackupLdk} options={PleaseBackupLdk.navigationOptions(theme)} />
<AddWalletStack.Screen name="ProvideEntropy" component={ProvideEntropy} options={ProvideEntropy.navigationOptions(theme)} />
<AddWalletStack.Screen
name="WalletsAddMultisig"
component={WalletsAddMultisig}
options={WalletsAddMultisig.navigationOptions(theme)}
initialParams={WalletsAddMultisig.initialParams}
/>
<AddWalletStack.Screen
name="WalletsAddMultisigStep2"
component={WalletsAddMultisigStep2}
options={WalletsAddMultisigStep2.navigationOptions(theme)}
/>
<AddWalletStack.Screen
name="WalletsAddMultisigHelp"
component={WalletsAddMultisigHelp}
options={WalletAddMultisigHelpNavigationOptions}
/>
</AddWalletStack.Navigator>
);
};

// CreateTransactionStackNavigator === SendDetailsStack
const SendDetailsStack = createNativeStackNavigator();
const SendDetailsRoot = () => {
Expand Down Expand Up @@ -524,7 +449,7 @@ const DetailViewStackScreensStack = () => {
/>
<DetailViewRoot.Screen name="WalletAddresses" component={WalletAddresses} options={WalletAddresses.navigationOptions(theme)} />

<DetailViewRoot.Screen name="AddWalletRoot" component={AddWalletRoot} options={NavigationFormModalOptions} />
<DetailViewRoot.Screen name="AddWalletRoot" component={AddWalletStack} options={NavigationFormModalOptions} />
<DetailViewRoot.Screen
name="SendDetailsRoot"
component={SendDetailsRoot}
Expand Down
11 changes: 11 additions & 0 deletions android/.project
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,15 @@
<natures>
<nature>org.eclipse.buildship.core.gradleprojectnature</nature>
</natures>
<filteredResources>
<filter>
<id>1714941148979</id>
<name></name>
<type>30</type>
<matcher>
<id>org.eclipse.core.resources.regexFilterMatcher</id>
<arguments>node_modules|\.git|__CREATED_BY_JAVA_LANGUAGE_SERVER__</arguments>
</matcher>
</filter>
</filteredResources>
</projectDescription>
11 changes: 11 additions & 0 deletions android/.settings/org.eclipse.buildship.core.prefs
Original file line number Diff line number Diff line change
@@ -1,2 +1,13 @@
arguments=--init-script /var/folders/wp/mctylz615p727_90j3yv0vnc0000gn/T/d146c9752a26f79b52047fb6dc6ed385d064e120494f96f08ca63a317c41f94c.gradle --init-script /var/folders/wp/mctylz615p727_90j3yv0vnc0000gn/T/52cde0cfcf3e28b8b7510e992210d9614505e0911af0c190bd590d7158574963.gradle
auto.sync=false
build.scans.enabled=false
connection.gradle.distribution=GRADLE_DISTRIBUTION(WRAPPER)
connection.project.dir=
eclipse.preferences.version=1
gradle.user.home=
java.home=/Library/Java/JavaVirtualMachines/temurin-21.jdk/Contents/Home
jvm.arguments=
offline.mode=false
override.workspace.settings=true
show.console.view=true
show.executions.view=true
2 changes: 1 addition & 1 deletion android/app/.classpath
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<classpath>
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8/"/>
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-21/"/>
<classpathentry kind="con" path="org.eclipse.buildship.core.gradleclasspathcontainer"/>
<classpathentry kind="output" path="bin/default"/>
</classpath>
11 changes: 11 additions & 0 deletions android/app/.project
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,15 @@
<nature>org.eclipse.jdt.core.javanature</nature>
<nature>org.eclipse.buildship.core.gradleprojectnature</nature>
</natures>
<filteredResources>
<filter>
<id>1714941148981</id>
<name></name>
<type>30</type>
<matcher>
<id>org.eclipse.core.resources.regexFilterMatcher</id>
<arguments>node_modules|\.git|__CREATED_BY_JAVA_LANGUAGE_SERVER__</arguments>
</matcher>
</filter>
</filteredResources>
</projectDescription>
4 changes: 4 additions & 0 deletions android/app/.settings/org.eclipse.jdt.core.prefs
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
eclipse.preferences.version=1
org.eclipse.jdt.core.compiler.codegen.targetPlatform=21
org.eclipse.jdt.core.compiler.compliance=21
org.eclipse.jdt.core.compiler.source=21
94 changes: 94 additions & 0 deletions navigation/AddWalletStack.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
import React from 'react';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import {
AddComponent,
ImportCustomDerivationPathComponent,
ImportSpeedComponent,
PleaseBackupComponent,
PleaseBackupLNDHubComponent,
PleaseBackupLdkComponent,
ProvideEntropyComponent,
WalletsAddMultisigComponent,
WalletsAddMultisigStep2Component,
WalletsAddMultisigHelpComponent,
} from './LazyLoadAddWalletStack';
import { AddWalletStackParamList } from '../typings/NavigationTypes';
import navigationStyle from '../components/navigationStyle';
import { useTheme } from '../components/themes';
import loc from '../loc';

const Stack = createNativeStackNavigator<AddWalletStackParamList>();

const AddWalletStack = () => {
const theme = useTheme();
return (
<Stack.Navigator initialRouteName="AddWallet">
<Stack.Screen
name="AddWallet"
component={AddComponent}
options={navigationStyle({
closeButton: true,
headerBackVisible: false,
title: loc.wallets.add_title,
})(theme)}
/>
<Stack.Screen name="ImportCustomDerivationPath" component={ImportCustomDerivationPathComponent} />
<Stack.Screen
name="ImportSpeed"
component={ImportSpeedComponent}
options={navigationStyle({ title: loc.wallets.import_title })(theme)}
/>
<Stack.Screen
name="PleaseBackup"
component={PleaseBackupComponent}
options={navigationStyle({
gestureEnabled: false,
headerBackVisible: false,
title: loc.pleasebackup.title,
})(theme)}
/>
<Stack.Screen
name="PleaseBackupLNDHub"
component={PleaseBackupLNDHubComponent}
options={navigationStyle({ gestureEnabled: false, headerBackVisible: false, title: loc.pleasebackup.title })(theme)}
/>
<Stack.Screen
name="PleaseBackupLdk"
component={PleaseBackupLdkComponent}
options={navigationStyle({
title: loc.pleasebackup.title,
gestureEnabled: false,
headerBackVisible: false,
})(theme)}
/>
<Stack.Screen
name="ProvideEntropy"
component={ProvideEntropyComponent}
options={navigationStyle({ title: loc.entropy.title })(theme)}
/>
<Stack.Screen name="WalletsAddMultisig" component={WalletsAddMultisigComponent} options={navigationStyle({ title: '' })(theme)} />
<Stack.Screen
name="WalletsAddMultisigStep2"
component={WalletsAddMultisigStep2Component}
options={navigationStyle({ title: '', gestureEnabled: false })(theme)}
/>
<Stack.Screen
name="WalletsAddMultisigHelp"
component={WalletsAddMultisigHelpComponent}
options={navigationStyle({
title: '',
gestureEnabled: false,
headerStyle: {
backgroundColor: '#0070FF',
},
headerTintColor: '#FFFFFF',
headerBackTitleVisible: false,
statusBarStyle: 'light',
headerShadowVisible: false,
})(theme)}
/>
</Stack.Navigator>
);
};

export default AddWalletStack;
84 changes: 84 additions & 0 deletions navigation/LazyLoadAddWalletStack.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
import React, { lazy, Suspense } from 'react';
import { View, ActivityIndicator, StyleSheet } from 'react-native';

// Define lazy imports
const WalletsAdd = lazy(() => import('../screen/wallets/Add'));
const ImportCustomDerivationPath = lazy(() => import('../screen/wallets/importCustomDerivationPath'));
const ImportSpeed = lazy(() => import('../screen/wallets/import'));
const PleaseBackup = lazy(() => import('../screen/wallets/PleaseBackup'));
const PleaseBackupLNDHub = lazy(() => import('../screen/wallets/pleaseBackupLNDHub'));
const PleaseBackupLdk = lazy(() => import('../screen/wallets/pleaseBackupLdk'));
const ProvideEntropy = lazy(() => import('../screen/wallets/provideEntropy'));
const WalletsAddMultisig = lazy(() => import('../screen/wallets/addMultisig'));
const WalletsAddMultisigStep2 = lazy(() => import('../screen/wallets/addMultisigStep2'));
const WalletsAddMultisigHelp = lazy(() => import('../screen/wallets/addMultisigHelp'));

const LoadingIndicator = () => (
<View style={styles.root}>
<ActivityIndicator size="large" />
</View>
);

export const AddComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<WalletsAdd />
</Suspense>
);

export const ImportCustomDerivationPathComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<ImportCustomDerivationPath />
</Suspense>
);

export const ImportSpeedComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<ImportSpeed />
</Suspense>
);

export const PleaseBackupComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<PleaseBackup />
</Suspense>
);

export const PleaseBackupLNDHubComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<PleaseBackupLNDHub />
</Suspense>
);

export const PleaseBackupLdkComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<PleaseBackupLdk />
</Suspense>
);

export const ProvideEntropyComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<ProvideEntropy />
</Suspense>
);

export const WalletsAddMultisigComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<WalletsAddMultisig />
</Suspense>
);

export const WalletsAddMultisigStep2Component = () => (
<Suspense fallback={<LoadingIndicator />}>
<WalletsAddMultisigStep2 />
</Suspense>
);

export const WalletsAddMultisigHelpComponent = () => (
<Suspense fallback={<LoadingIndicator />}>
<WalletsAddMultisigHelp />
</Suspense>
);

const styles = StyleSheet.create({
root: { flex: 1, justifyContent: 'center', alignItems: 'center' },
});
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
"e2e:release-build": "detox build -c android.release",
"e2e:release-test": "detox test -c android.release",
"tslint": "tsc",
"lint": " npm run tslint && node scripts/find-unused-loc.js && eslint --ext .js,.ts,.tsx '*.@(js|ts|tsx)' screen 'blue_modules/*.@(js|ts|tsx)' class models loc tests components",
"lint": " npm run tslint && node scripts/find-unused-loc.js && eslint --ext .js,.ts,.tsx '*.@(js|ts|tsx)' screen 'blue_modules/*.@(js|ts|tsx)' class models loc tests components navigation",
"lint:fix": "npm run lint -- --fix",
"lint:quickfix": "git status --porcelain | grep -v '\\.json' | grep -E '\\.js|\\.ts' --color=never | awk '{print $2}' | xargs eslint --fix; exit 0",
"unit": "jest -b -i tests/unit/*"
Expand Down
5 changes: 4 additions & 1 deletion screen/wallets/PleaseBackup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ const PleaseBackup: React.FC = () => {

return (
<ScrollView
style={styles.flex}
style={styles.root}
contentContainerStyle={[styles.flex, stylesHook.flex]}
testID="PleaseBackupScrollView"
automaticallyAdjustContentInsets
Expand All @@ -88,6 +88,9 @@ const PleaseBackup: React.FC = () => {
};

const styles = StyleSheet.create({
root: {
flex: 1,
},
flex: {
flex: 1,
justifyContent: 'space-around',
Expand Down
5 changes: 0 additions & 5 deletions screen/wallets/addMultisig.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import LottieView from 'lottie-react-native';
import { Icon } from 'react-native-elements';
import { useNavigation, useRoute } from '@react-navigation/native';
import { BlueSpacing20 } from '../../BlueComponents';
import navigationStyle from '../../components/navigationStyle';
import BottomModal from '../../components/BottomModal';
import { MultisigHDWallet } from '../../class';
import loc from '../../loc';
Expand Down Expand Up @@ -340,10 +339,6 @@ WalletsAddMultisig.getCurrentFormatReadable = f => {
}
};

WalletsAddMultisig.navigationOptions = navigationStyle({
title: '',
});

WalletsAddMultisig.initialParams = {
walletLabel: loc.multisig.default_label,
};
Expand Down
Loading

0 comments on commit 105997a

Please sign in to comment.