From 2a1d42a87e737050cd662f88942e485d5387c3b1 Mon Sep 17 00:00:00 2001 From: Stephen Heaps Date: Fri, 26 Jan 2024 12:37:07 -0500 Subject: [PATCH 1/2] Move filters sheet modifier to outside of Portfolio `ScrollView` for Portfolio Assets list. Reduce nested `LazyVStack`s where not necessary. --- .../Portfolio/PortfolioAssetsView.swift | 94 ++++++------------- .../Crypto/Portfolio/PortfolioView.swift | 41 +++++++- .../Crypto/WalletDisclosureGroup.swift | 2 +- 3 files changed, 69 insertions(+), 68 deletions(-) diff --git a/Sources/BraveWallet/Crypto/Portfolio/PortfolioAssetsView.swift b/Sources/BraveWallet/Crypto/Portfolio/PortfolioAssetsView.swift index a97945befd7..f47140aa4c1 100644 --- a/Sources/BraveWallet/Crypto/Portfolio/PortfolioAssetsView.swift +++ b/Sources/BraveWallet/Crypto/Portfolio/PortfolioAssetsView.swift @@ -15,14 +15,14 @@ struct PortfolioAssetsView: View { @ObservedObject var networkStore: NetworkStore @ObservedObject var portfolioStore: PortfolioStore - @State private var isPresentingEditUserAssets: Bool = false - @State private var isPresentingFiltersDisplaySettings: Bool = false + @Binding var isPresentingEditUserAssets: Bool + @Binding var isPresentingFilters: Bool @State private var selectedToken: BraveWallet.BlockchainToken? @State private var groupToggleState: [AssetGroupViewModel.ID: Bool] = [:] @ObservedObject private var isShowingBalances = Preferences.Wallet.isShowingBalances var body: some View { - LazyVStack(spacing: 16) { + VStack(spacing: 16) { assetSectionsHeader if portfolioStore.isShowingAssetsLoadingState { @@ -74,56 +74,18 @@ struct PortfolioAssetsView: View { .padding(.leading, 5) } Spacer() - editUserAssetsButton - .padding(.trailing, 10) - filtersButton + WalletIconButton(braveSystemName: "leo.list.settings", action: { + isPresentingEditUserAssets = true + }) + .padding(.trailing, 10) + WalletIconButton(braveSystemName: "leo.filter.settings", action: { + isPresentingFilters = true + }) } .frame(maxWidth: .infinity, alignment: .leading) .padding(.horizontal) } - private var editUserAssetsButton: some View { - WalletIconButton(braveSystemName: "leo.list.settings", action: { - isPresentingEditUserAssets = true - }) - .sheet(isPresented: $isPresentingEditUserAssets) { - EditUserAssetsView( - networkStore: networkStore, - keyringStore: keyringStore, - userAssetsStore: portfolioStore.userAssetsStore - ) { - cryptoStore.updateAssets() - } - } - } - - private var filtersButton: some View { - WalletIconButton(braveSystemName: "leo.filter.settings", action: { - isPresentingFiltersDisplaySettings = true - }) - .sheet(isPresented: $isPresentingFiltersDisplaySettings) { - FiltersDisplaySettingsView( - filters: portfolioStore.filters, - isNFTFilters: false, - networkStore: networkStore, - save: { filters in - portfolioStore.saveFilters(filters) - } - ) - .osAvailabilityModifiers({ view in - if #available(iOS 16, *) { - view - .presentationDetents([ - .fraction(0.7), - .large - ]) - } else { - view - } - }) - } - } - private var emptyAssetsState: some View { VStack(spacing: 10) { Image("portfolio-empty", bundle: .module) @@ -174,23 +136,25 @@ struct PortfolioAssetsView: View { } ), content: { - ForEach(group.assets) { asset in - Button(action: { - selectedToken = asset.token - }) { - PortfolioAssetView( - image: AssetIconView( - token: asset.token, - network: asset.network, - shouldShowNetworkIcon: true - ), - title: asset.token.name, - symbol: asset.token.symbol, - networkName: asset.network.chainName, - amount: asset.fiatAmount(currencyFormatter: portfolioStore.currencyFormatter), - quantity: asset.quantity, - shouldHideBalance: true - ) + LazyVStack(spacing: 8) { + ForEach(group.assets) { asset in + Button(action: { + selectedToken = asset.token + }) { + PortfolioAssetView( + image: AssetIconView( + token: asset.token, + network: asset.network, + shouldShowNetworkIcon: true + ), + title: asset.token.name, + symbol: asset.token.symbol, + networkName: asset.network.chainName, + amount: asset.fiatAmount(currencyFormatter: portfolioStore.currencyFormatter), + quantity: asset.quantity, + shouldHideBalance: true + ) + } } } }, diff --git a/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift b/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift index 9991c844250..69e8dd385e6 100644 --- a/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift +++ b/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift @@ -27,6 +27,9 @@ struct PortfolioView: View { @State private var selectedContent: PortfolioSegmentedControl.Item = .assets @ObservedObject private var isShowingNFTsTab = Preferences.Wallet.isShowingNFTsTab + @State private var isPresentingEditUserAssets: Bool = false + @State private var isPresentingAssetsFilters: Bool = false + var body: some View { ScrollView { VStack(spacing: 0) { @@ -48,10 +51,42 @@ struct PortfolioView: View { Color(braveSystemName: .containerBackground) // bottom drawer scroll rubberband area }.edgesIgnoringSafeArea(.all) ) + .background(Color.clear + .sheet(isPresented: $isPresentingEditUserAssets) { + EditUserAssetsView( + networkStore: networkStore, + keyringStore: keyringStore, + userAssetsStore: portfolioStore.userAssetsStore + ) { + cryptoStore.updateAssets() + } + }) + .background(Color.clear + .sheet(isPresented: $isPresentingAssetsFilters) { + FiltersDisplaySettingsView( + filters: portfolioStore.filters, + isNFTFilters: false, + networkStore: networkStore, + save: { filters in + portfolioStore.saveFilters(filters) + } + ) + .osAvailabilityModifiers({ view in + if #available(iOS 16, *) { + view + .presentationDetents([ + .fraction(0.7), + .large + ]) + } else { + view + } + }) + }) } private var contentDrawer: some View { - LazyVStack { + VStack { if isShowingNFTsTab.value { PortfolioSegmentedControl(selected: $selectedContent) .padding(.horizontal) @@ -63,7 +98,9 @@ struct PortfolioView: View { cryptoStore: cryptoStore, keyringStore: keyringStore, networkStore: networkStore, - portfolioStore: portfolioStore + portfolioStore: portfolioStore, + isPresentingEditUserAssets: $isPresentingEditUserAssets, + isPresentingFilters: $isPresentingAssetsFilters ) .padding(.horizontal, 8) } else { diff --git a/Sources/BraveWallet/Crypto/WalletDisclosureGroup.swift b/Sources/BraveWallet/Crypto/WalletDisclosureGroup.swift index 400f2c7679f..ff44971b0c6 100644 --- a/Sources/BraveWallet/Crypto/WalletDisclosureGroup.swift +++ b/Sources/BraveWallet/Crypto/WalletDisclosureGroup.swift @@ -40,7 +40,7 @@ struct WalletDisclosureGroup: View { } var body: some View { - LazyVStack { + VStack(spacing: 4) { header if isExpanded { Divider() From 83090dae36451d87cf23b53617024975c29bece6 Mon Sep 17 00:00:00 2001 From: Stephen Heaps Date: Fri, 26 Jan 2024 12:49:55 -0500 Subject: [PATCH 2/2] Move filters sheet modifier to outside of Portfolio `ScrollView` for Portfolio NFTs list. --- Sources/BraveWallet/Crypto/NFT/NFTView.swift | 66 +++---------------- .../Crypto/Portfolio/PortfolioView.swift | 40 ++++++++++- 2 files changed, 47 insertions(+), 59 deletions(-) diff --git a/Sources/BraveWallet/Crypto/NFT/NFTView.swift b/Sources/BraveWallet/Crypto/NFT/NFTView.swift index 48679ea8e9c..c567d1aaef9 100644 --- a/Sources/BraveWallet/Crypto/NFT/NFTView.swift +++ b/Sources/BraveWallet/Crypto/NFT/NFTView.swift @@ -14,11 +14,10 @@ struct NFTView: View { @ObservedObject var networkStore: NetworkStore @ObservedObject var nftStore: NFTStore - @State private var isPresentingFiltersDisplaySettings: Bool = false - @State private var isPresentingEditUserAssets: Bool = false + @Binding var isPresentingFilters: Bool + @Binding var isPresentingAddCustomNFT: Bool @State private var selectedNFTViewModel: NFTAssetViewModel? @State private var isShowingNFTDiscoveryAlert: Bool = false - @State private var isShowingAddCustomNFT: Bool = false @State private var isNFTDiscoveryEnabled: Bool = false @State private var nftToBeRemoved: NFTAssetViewModel? @State private var groupToggleState: [NFTGroupViewModel.ID: Bool] = [:] @@ -38,7 +37,7 @@ struct NFTView: View { .foregroundColor(Color(.secondaryLabel)) } Button(Strings.Wallet.nftEmptyImportNFT) { - isShowingAddCustomNFT = true + isPresentingAddCustomNFT = true } .buttonStyle(BraveFilledButtonStyle(size: .normal)) .hidden(isHidden: nftStore.displayType != .visible) @@ -50,25 +49,6 @@ struct NFTView: View { .padding(.horizontal, 32) } - private var editUserAssetsButton: some View { - Button(action: { isPresentingEditUserAssets = true }) { - Text(Strings.Wallet.editVisibleAssetsButtonTitle) - .multilineTextAlignment(.center) - .font(.footnote.weight(.semibold)) - .foregroundColor(Color(.braveBlurpleTint)) - .frame(maxWidth: .infinity) - } - .sheet(isPresented: $isPresentingEditUserAssets) { - EditUserAssetsView( - networkStore: networkStore, - keyringStore: keyringStore, - userAssetsStore: nftStore.userAssetsStore - ) { - cryptoStore.updateAssets() - } - } - } - private let nftGrids = [GridItem(.adaptive(minimum: 120), spacing: 16, alignment: .top)] @ViewBuilder private func nftLogo(_ nftViewModel: NFTAssetViewModel) -> some View { @@ -99,7 +79,7 @@ struct NFTView: View { private var filtersButton: some View { WalletIconButton(braveSystemName: "leo.filter.settings", action: { - isPresentingFiltersDisplaySettings = true + isPresentingFilters = true }) } @@ -155,7 +135,7 @@ struct NFTView: View { private var addCustomAssetButton: some View { WalletIconButton(braveSystemName: "leo.plus.add") { - isShowingAddCustomNFT = true + isPresentingAddCustomNFT = true } } @@ -405,38 +385,6 @@ struct NFTView: View { .padding(.bottom, 24) }) ) - .sheet(isPresented: $isShowingAddCustomNFT) { - AddCustomAssetView( - networkStore: networkStore, - networkSelectionStore: networkStore.openNetworkSelectionStore(mode: .formSelection), - keyringStore: keyringStore, - userAssetStore: nftStore.userAssetsStore, - supportedTokenTypes: [.nft] - ) { - cryptoStore.updateAssets() - } - } - .sheet(isPresented: $isPresentingFiltersDisplaySettings) { - FiltersDisplaySettingsView( - filters: nftStore.filters, - isNFTFilters: true, - networkStore: networkStore, - save: { filters in - nftStore.saveFilters(filters) - } - ) - .osAvailabilityModifiers({ view in - if #available(iOS 16, *) { - view - .presentationDetents([ - .fraction(0.6), - .large - ]) - } else { - view - } - }) - } .onChange(of: keyringStore.isWalletLocked) { isLocked in guard isLocked else { return } if isShowingNFTDiscoveryAlert { @@ -493,7 +441,9 @@ struct NFTView_Previews: PreviewProvider { cryptoStore: .previewStore, keyringStore: .previewStore, networkStore: .previewStore, - nftStore: CryptoStore.previewStore.nftStore + nftStore: CryptoStore.previewStore.nftStore, + isPresentingFilters: .constant(false), + isPresentingAddCustomNFT: .constant(false) ) } } diff --git a/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift b/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift index 69e8dd385e6..1920a28b49d 100644 --- a/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift +++ b/Sources/BraveWallet/Crypto/Portfolio/PortfolioView.swift @@ -29,6 +29,8 @@ struct PortfolioView: View { @State private var isPresentingEditUserAssets: Bool = false @State private var isPresentingAssetsFilters: Bool = false + @State private var isPresentingAddCustomNFT: Bool = false + @State private var isPresentingNFTsFilters: Bool = false var body: some View { ScrollView { @@ -83,6 +85,40 @@ struct PortfolioView: View { } }) }) + .background(Color.clear + .sheet(isPresented: $isPresentingAddCustomNFT) { + AddCustomAssetView( + networkStore: networkStore, + networkSelectionStore: networkStore.openNetworkSelectionStore(mode: .formSelection), + keyringStore: keyringStore, + userAssetStore: cryptoStore.nftStore.userAssetsStore, + supportedTokenTypes: [.nft] + ) { + cryptoStore.updateAssets() + } + }) + .background(Color.clear + .sheet(isPresented: $isPresentingNFTsFilters) { + FiltersDisplaySettingsView( + filters: cryptoStore.nftStore.filters, + isNFTFilters: true, + networkStore: networkStore, + save: { filters in + cryptoStore.nftStore.saveFilters(filters) + } + ) + .osAvailabilityModifiers({ view in + if #available(iOS 16, *) { + view + .presentationDetents([ + .fraction(0.6), + .large + ]) + } else { + view + } + }) + }) } private var contentDrawer: some View { @@ -108,7 +144,9 @@ struct PortfolioView: View { cryptoStore: cryptoStore, keyringStore: keyringStore, networkStore: cryptoStore.networkStore, - nftStore: cryptoStore.nftStore + nftStore: cryptoStore.nftStore, + isPresentingFilters: $isPresentingNFTsFilters, + isPresentingAddCustomNFT: $isPresentingAddCustomNFT ) .padding(.horizontal, 8) }