Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Backups V2 Follow-up Fixes / Improvements #6213

Merged
merged 53 commits into from
Dec 20, 2024
Merged
Changes from 1 commit
Commits
Show all changes
53 commits
Select commit Hold shift + click to select a range
c035b9f
remove useState that is getting wiped between renders
walmat Oct 18, 2024
ea2fd09
lots of provider structure changes
walmat Oct 19, 2024
3735f81
Merge branch 'develop' into @matthew/APP-1297
walmat Oct 25, 2024
4afed74
lots more progress on restructuring and code sharing
walmat Nov 6, 2024
fb913bc
more code quality improvements
walmat Nov 6, 2024
afc42bf
prevent App.tsx from re-rendering unless it needs to
walmat Nov 8, 2024
6946626
fix password not being pulled from local password keychain and add lo…
walmat Nov 8, 2024
9ea81dd
misc backups improvements
walmat Nov 8, 2024
fd16a13
Update .vscode/settings.json
walmat Nov 8, 2024
00d1bff
cleanup
walmat Nov 8, 2024
7016d47
Merge branch '@matthew/APP-1297' of https://github.com/rainbow-me/rai…
walmat Nov 8, 2024
5420054
fix lint
walmat Nov 11, 2024
c20670c
Merge branch 'develop' into @matthew/APP-1297
walmat Nov 14, 2024
5784cb2
fix overlay causing top leve re-renders
walmat Nov 14, 2024
0c81b5f
nav back to wallet screen on both new user restore / existing restore
walmat Nov 14, 2024
1fadaf5
convert cloud backup provider to zustand store, remove userData as it…
walmat Nov 16, 2024
a9948af
lots of cleanup
walmat Nov 18, 2024
5c5a848
add icon to indicate wrogn backup password
walmat Nov 18, 2024
6d7b6fa
simplify prompt to backup selected wallet
walmat Nov 18, 2024
9823919
more manual backup to cloud backup transitions
walmat Nov 18, 2024
7b18523
Update src/components/backup/RestoreCloudStep.tsx
walmat Nov 18, 2024
1f42ab9
reset backup provider to undefined if no condition is met
walmat Nov 18, 2024
466f3dc
adjust logic for displaying backed up status on Android when switchin…
walmat Nov 18, 2024
461ee79
more android tweaks
walmat Nov 18, 2024
053231c
more android fixes
walmat Nov 25, 2024
e1569fa
cleanup logs, prevent consolidatedTransactions when no address, and p…
walmat Nov 25, 2024
176cac6
prevent backups on wallets which are damaged
walmat Nov 25, 2024
11f079f
prevent portal overlay on pin authentication screen
walmat Nov 25, 2024
ebd631d
Merge branch 'develop' into @matthew/APP-1297
walmat Nov 25, 2024
25bb9c2
prevent copying address and more improvements to disabling backups if…
walmat Nov 25, 2024
664a035
i18n wallet loading states
walmat Nov 26, 2024
f550f68
fix lint
walmat Nov 26, 2024
3ccb2fb
fix lint
walmat Nov 26, 2024
e995093
Merge branch 'develop' into @matthew/APP-1297
walmat Nov 26, 2024
380103f
possibly fix the enable cloud backups on android
walmat Nov 27, 2024
d0fd2e3
fix button not being disabled and confetti (#6281)
walmat Nov 27, 2024
11fbc3c
[1297] - Prevent a few faceID prompts during restore / backup flow (#…
walmat Dec 3, 2024
109ca08
fix backup prompt seemingly being stuck (#6289)
walmat Dec 4, 2024
7dfd7e2
[1297] - Fix infinite sync (#6280)
walmat Dec 4, 2024
64d075b
fix: code review changes
walmat Dec 4, 2024
48c346a
prevent backup prompt from firing until backups status is synced
walmat Dec 4, 2024
515691b
replace inline flex with flatlist 3 column
walmat Dec 4, 2024
ee330be
fix non-visible wallets from appearing in backup section wallet addre…
walmat Dec 4, 2024
869a1fe
properly space items and calculate width based on device
walmat Dec 4, 2024
f9249f8
fix inconsistencies with keys
walmat Dec 4, 2024
308437a
fix lint
walmat Dec 6, 2024
7494991
add backup prompt to checks to avoid stacking sheets
walmat Dec 6, 2024
1b4e81f
add authentication in order to allow backup deletion
walmat Dec 6, 2024
1091d47
chore: merge
walmat Dec 11, 2024
fc5ee51
chore: merge
walmat Dec 19, 2024
6ccfad1
chore: merge
walmat Dec 19, 2024
1b149e9
fix botched merge
walmat Dec 20, 2024
ff305c6
remove unused imports
walmat Dec 20, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
properly space items and calculate width based on device
  • Loading branch information
walmat committed Dec 4, 2024
commit 869a1fe5a78eb740bebc8f20fc6f93e17f7fe88e
48 changes: 23 additions & 25 deletions src/screens/SettingsSheet/components/Backups/WalletsAndBackup.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
import React, { useCallback, useMemo, useRef } from 'react';
import { cloudPlatform } from '@/utils/platform';
import Menu from '../Menu';
import MenuContainer from '../MenuContainer';
Expand All @@ -11,12 +11,12 @@ import WalletTypes, { EthereumWalletType } from '@/helpers/walletTypes';
import ImageAvatar from '@/components/contacts/ImageAvatar';
import { useENSAvatar, useInitializeWallet, useManageCloudBackups, useWallets } from '@/hooks';
import { useNavigation } from '@/navigation';
import { abbreviations } from '@/utils';
import { abbreviations, deviceUtils } from '@/utils';
import { addressHashedEmoji } from '@/utils/profileUtils';
import * as i18n from '@/languages';
import MenuHeader, { StatusType } from '../MenuHeader';
import { checkLocalWalletsForBackupStatus, isWalletBackedUpForCurrentAccount } from '../../utils';
import { Inline, Text, Box, Stack, Bleed } from '@/design-system';
import { Inline, Text, Box, Stack } from '@/design-system';
import { ContactAvatar } from '@/components/contacts';
import { useTheme } from '@/theme';
import Routes from '@/navigation/routesNames';
Expand All @@ -43,21 +43,29 @@ type WalletPillProps = {
account: RainbowAccount;
};

// constants for the account section
const menuContainerPadding = 19.5; // 19px is the padding on the left and right of the container but we need 1px more to account for the shadows on each container
const accountsContainerWidth = deviceUtils.dimensions.width - menuContainerPadding * 4;
const spaceBetweenAccounts = 4;
const accountsItemWidth = accountsContainerWidth / 3;
const basePadding = 16;
const rowHeight = 36;

const getAccountSectionHeight = (numAccounts: number) => {
const rows = Math.ceil(Math.max(1, numAccounts) / 3);
const paddingBetween = (rows - 1) * 4;

return basePadding + rows * rowHeight - paddingBetween;
};

const WalletPill = ({ account }: WalletPillProps) => {
const [width, setWidth] = useState<number | undefined>(undefined);
const label = useMemo(() => removeFirstEmojiFromString(account.label), [account.label]);

const { data: ENSAvatar } = useENSAvatar(label);
const { colors, isDarkMode } = useTheme();

const accountImage = addressHashedEmoji(account.address);

useLayoutEffect(() => {
if (width) {
setWidth(width - 8);
}
}, [width]);

return (
<Box
key={account.address}
Expand All @@ -72,6 +80,7 @@ const WalletPill = ({ account }: WalletPillProps) => {
paddingLeft={{ custom: 4 }}
paddingRight={{ custom: 8 }}
padding={{ custom: 4 }}
width={{ custom: accountsItemWidth }}
>
{ENSAvatar?.imageUrl ? (
<ImageAvatar image={ENSAvatar.imageUrl} marginRight={4} size="smaller_shadowless" />
Expand All @@ -87,16 +96,6 @@ const WalletPill = ({ account }: WalletPillProps) => {
);
};

const basePadding = 16;
const rowHeight = 36;

const getAccountSectionHeight = (numAccounts: number) => {
const rows = Math.ceil(Math.max(1, numAccounts) / 3);
const paddingBetween = (rows - 1) * 4;

return basePadding + rows * rowHeight - paddingBetween;
};

export const WalletsAndBackup = () => {
const { navigate } = useNavigation();
const { wallets } = useWallets();
Expand Down Expand Up @@ -385,6 +384,7 @@ export const WalletsAndBackup = () => {
renderItem={({ item }) => <WalletPill account={item} />}
keyExtractor={item => item.address}
numColumns={3}
scrollEnabled={false}
/>
}
/>
Expand Down Expand Up @@ -520,14 +520,12 @@ export const WalletsAndBackup = () => {
titleComponent={
<FlatList
data={addresses}
columnWrapperStyle={{
flex: 1,
justifyContent: 'space-around',
}}
contentContainerStyle={{ gap: 4 }}
columnWrapperStyle={{ gap: spaceBetweenAccounts }}
contentContainerStyle={{ gap: spaceBetweenAccounts }}
renderItem={({ item }) => <WalletPill account={item} />}
keyExtractor={item => item.address}
numColumns={3}
scrollEnabled={false}
/>
}
/>
Expand Down
Loading