TRCL-3281 : Add transfer entry point to profile page pt 2 - UI Tweaks (…

…#32) * apply design feedback * update more colors to match design * enable profile buttons always * clean up undo podfile lock changes * fix compile issue
dydxprotocol · Aug 21, 2024 · 448eaa7 · 448eaa7
1 parent 4e8947c
commit 448eaa7
Show file tree

Hide file tree

Showing 23 changed files with 44 additions and 45 deletions.
diff --git a/PlatformUI/PlatformUI/Components/Buttons/PlatformButton.swift b/PlatformUI/PlatformUI/Components/Buttons/PlatformButton.swift
@@ -33,12 +33,7 @@ public class PlatformButtonViewModel<Content: PlatformViewModeling>: PlatformVie
         PlatformView(viewModel: self, parentStyle: parentStyle, styleKey: styleKey) { [weak self] style  in
             guard let self = self else { return AnyView(PlatformView.nilView) }
 
-            let disabled: Bool
-            if case .disabled = self.state {
-                disabled = true
-            } else {
-                disabled = false
-            }
+            let disabled = .disabled == self.state
             return AnyView(
                 Group {
                     switch self.type {

diff --git a/PlatformUI/PlatformUI/DesignSystem/Theme/ThemeViewModifiers.swift b/PlatformUI/PlatformUI/DesignSystem/Theme/ThemeViewModifiers.swift
@@ -185,16 +185,19 @@ private struct SheetViewModifier: ViewModifier {
     @EnvironmentObject var themeSettings: ThemeSettings
 
     func body(content: Content) -> some View {
+        let dragIndicator = Rectangle()
+            .themeColor(background: .layer1)
+            .frame(width: 36, height: 4)
+            .clipShape(Capsule())
+            .padding(.top, topPadding)
+
         if sheetStyle == .fullScreen {
             return AnyView(
                 ZStack(alignment: .top) {
                     content
                         .cornerRadius(36, corners: [.topLeft, .topRight])
                     VStack {
-                        Rectangle()
-                            .themeColor(background: .layer1)
-                            .frame(width: 36, height: 4)
-                            .padding(.top, topPadding)
+                        dragIndicator
                         Spacer()
                     }
                 }
@@ -208,10 +211,7 @@ private struct SheetViewModifier: ViewModifier {
                         content
                             .cornerRadius(36, corners: [.topLeft, .topRight])
                         VStack {
-                            Rectangle()
-                                .themeColor(background: .layer1)
-                                .frame(width: 36, height: 4)
-                                .padding(.top, topPadding)
+                            dragIndicator
                         }
                     }
                 }

diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/Contents.json b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "Download.pdf",
+      "filename" : "icon_transfer_deposit.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/Download.pdf b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/Download.pdf
diff --git a/...dxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/icon_transfer_deposit.pdf b/...dxViews/dydxViews/Media.xcassets/icon_transfer_deposit.imageset/icon_transfer_deposit.pdf
diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/Contents.json b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "Frame.svg",
+      "filename" : "icon_transfer_dydx.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/Frame.svg b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/Frame.svg
diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/icon_transfer_dydx.pdf b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_dydx.imageset/icon_transfer_dydx.pdf
diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/Contents.json b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "Frame 1410.pdf",
+      "filename" : "icon_transfer_withdrawal.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/Frame 1410.pdf b/dydx/dydxViews/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/Frame 1410.pdf
diff --git a/...s/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/icon_transfer_withdrawal.pdf b/...s/dydxViews/Media.xcassets/icon_transfer_withdrawal.imageset/icon_transfer_withdrawal.pdf
diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/Contents.json b/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/Contents.json
@@ -1,7 +1,7 @@
 {
   "images" : [
     {
-      "filename" : "Vector.pdf",
+      "filename" : "settings_signout.pdf",
       "idiom" : "universal"
     }
   ],

diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/Vector.pdf b/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/Vector.pdf
diff --git a/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/settings_signout.pdf b/dydx/dydxViews/dydxViews/Media.xcassets/settings_signout.imageset/settings_signout.pdf
diff --git a/dydx/dydxViews/dydxViews/Themes/ThemeLight.json b/dydx/dydxViews/dydxViews/Themes/ThemeLight.json
@@ -9,7 +9,7 @@
             "layer_1": "#EDF0F2",
             "layer_2": "#F9FAFB",
             "layer_3": "#EDF0F2",
-            "layer_4": "#E0E6EB",
+            "layer_4": "#FFFFFF",
             "layer_5": "#E0E6EB",
             "layer_6": "#D1D9E0",
             "layer_7": "#C2CCD6",

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileButtonsView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileButtonsView.swift
@@ -34,16 +34,19 @@ public class dydxProfileButtonsViewModel: PlatformViewModel {
                     self.createButton(parentStyle: style,
                                       imageName: "icon_transfer_deposit",
                                       title: DataLocalizer.localize(path: "APP.GENERAL.DEPOSIT"),
+                                      templateColor: self.onboarded ? .textSecondary : .textTertiary,
                                       action: self.depositAction)
 
                     self.createButton(parentStyle: style,
                                       imageName: "icon_transfer_withdrawal",
                                       title: DataLocalizer.localize(path: "APP.GENERAL.WITHDRAW"),
+                                      templateColor: self.onboarded ? .textSecondary : .textTertiary,
                                       action: self.withdrawAction)
 
                     self.createButton(parentStyle: style,
                                       imageName: "icon_transfer_dydx",
                                       title: DataLocalizer.localize(path: "APP.GENERAL.TRANSFER"),
+                                      templateColor: self.onboarded ? .textSecondary : .textTertiary,
                                       action: self.transferAction)
 
                     if self.onboarded {
@@ -65,28 +68,29 @@ public class dydxProfileButtonsViewModel: PlatformViewModel {
         }
     }
 
-    private func createButton(parentStyle: ThemeStyle, imageName: String, title: String, styleKey: String? = nil, backgroundColor: ThemeColor.SemanticColor = .layer3, templateColor: ThemeColor.SemanticColor? = .textSecondary, action: (() -> Void)?) -> some View {
+    private func createButton(parentStyle: ThemeStyle, imageName: String, title: String, styleKey: String? = nil, backgroundColor: ThemeColor.SemanticColor = .layer3, templateColor: ThemeColor.SemanticColor?, action: (() -> Void)?) -> some View {
         let icon = PlatformIconViewModel(type: .asset(name: imageName, bundle: Bundle.dydxView),
                                      clip: .circle(background: backgroundColor, spacing: 24, borderColor: .layer6),
                                          size: CGSize(width: 48, height: 48),
                                          templateColor: templateColor)
-        return createButton(parentStyle: parentStyle, icon: icon, title: title, action: action)
-    }
-
-    private func createButton(parentStyle: ThemeStyle, icon: PlatformViewModel, title: String, action: (() -> Void)?) -> some View {
-        VStack {
-            PlatformButtonViewModel(content: icon,
-                                    type: .iconType,
-                                    state: .primary,
-                                    action: action ?? {})
             .createView(parentStyle: parentStyle)
 
-            Text(title)
-                .themeFont(fontSize: .small)
-                .themeColor(foreground: .textTertiary)
-                .lineLimit(1)
+        let title = Text(title)
+            .themeFont(fontSize: .small)
+            .themeColor(foreground: templateColor ?? .textSecondary)
+            .lineLimit(1)
+
+        let buttonContent = VStack {
+            icon
+            title
         }
         .frame(maxWidth: .infinity)
+        .wrappedViewModel
+
+        return PlatformButtonViewModel(content: buttonContent,
+                                       type: .iconType,
+                                       action: action ?? {})
+               .createView(parentStyle: parentStyle)
     }
 }
 

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileFeesView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileFeesView.swift
@@ -94,7 +94,7 @@ public class dydxProfileFeesViewModel: PlatformViewModel, Equatable {
                 }
                 .padding(16)
             }
-            .themeColor(background: .layer4)
+            .themeColor(background: .layer3)
             .cornerRadius(12, corners: .allCorners)
             .onTapGesture { [weak self] in
                 self?.tapAction?()

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileHeaderView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileHeaderView.swift
@@ -106,7 +106,7 @@ public class dydxProfileHeaderViewModel: PlatformViewModel {
                     }
                 }
                     .padding(.all, 20)
-                    .themeColor(background: .layer4)
+                    .themeColor(background: .layer3)
                     .cornerRadius(12, corners: .allCorners)
                 if let sourceAddress = self.sourceAddress {
                     HStack(spacing: 0) {

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileHistoryView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileHistoryView.swift
@@ -60,6 +60,7 @@ public class dydxProfileHistoryViewModel: PlatformViewModel {
                 VStack(spacing: 0) {
                     HStack {
                         Text(DataLocalizer.localize(path: "APP.GENERAL.HISTORY"))
+                            .themeColor(foreground: .textSecondary)
                             .themeFont(fontSize: .small)
                         Spacer()
                         PlatformIconViewModel(type: .system(name: "chevron.right"),
@@ -145,7 +146,7 @@ public class dydxProfileHistoryViewModel: PlatformViewModel {
                 }
                 .frame(maxWidth: .infinity)
                 .frame(minHeight: 210)
-                .themeColor(background: .layer4)
+                .themeColor(background: .layer3)
                 .cornerRadius(12, corners: .allCorners)
                 .onTapGesture { [weak self] in
                     self?.tapAction?()

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileRewardsView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxProfileRewardsView.swift
@@ -51,7 +51,7 @@ public class dydxProfileRewardsViewModel: PlatformViewModel {
                 }
                 .padding(.horizontal, 16)
                 .padding(.vertical, 16)
-                .themeColor(background: .layer4)
+                .themeColor(background: .layer3)
                 .cornerRadius(14, corners: .allCorners)
             )
         }
@@ -66,7 +66,7 @@ public class dydxProfileRewardsViewModel: PlatformViewModel {
             }
 
             Text(nativeTokenName ?? "")
-                .themeColor(foreground: .textPrimary)
+                .themeColor(foreground: .textSecondary)
                 .themeFont(fontSize: .medium)
 
             Spacer()
@@ -94,17 +94,18 @@ public class dydxProfileRewardsViewModel: PlatformViewModel {
     private func createAmountPanel(style: ThemeStyle, title: String, amount: String) -> some View {
         VStack(spacing: 16) {
             Text(title)
+                .themeColor(foreground: .textSecondary)
                 .themeFont(fontSize: .small)
                 .leftAligned()
 
             Text(amount)
-                .themeColor(foreground: .textPrimary)
+                .themeColor(foreground: .textTertiary)
                 .themeFont(fontType: .number, fontSize: .largest)
                 .leftAligned()
 
         }
         .padding(16)
-        .themeColor(background: .layer6)
+        .themeColor(background: .layer4)
         .cornerRadius(10, corners: .allCorners)
         .frame(maxWidth: .infinity)
     }

diff --git a/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxSettingsHelpRowView.swift b/dydx/dydxViews/dydxViews/_v4/Profile/Components/dydxSettingsHelpRowView.swift
@@ -56,7 +56,7 @@ public class dydxSettingsHelpRowViewModel: PlatformViewModel {
         }
         .padding(.horizontal, 16)
         .padding(.vertical, 22)
-        .themeColor(background: .layer4)
+        .themeColor(background: .layer3)
         .cornerRadius(12, corners: .allCorners)
         .frame(maxWidth: .infinity)
         .onTapGesture {

diff --git a/dydx/dydxViews/dydxViews/_v4/Wallet/WalletConnectionView.swift b/dydx/dydxViews/dydxViews/_v4/Wallet/WalletConnectionView.swift
@@ -74,7 +74,7 @@ public class WalletConnectionViewModel: PlatformViewModel {
                         .padding(.vertical, buttonContentVerticalPadding)
                         .themeColor(background: .layer3)
                     })
-                        .borderAndClip(style: .capsule, borderColor: .layer6, lineWidth: buttonBorderWidth)
+                        .borderAndClip(style: .cornerRadius(8), borderColor: .layer6, lineWidth: buttonBorderWidth)
 
                     let exportPhraseButton = Button(action: {
                         self?.exportSecretPhraseTapped?()

diff --git a/dydx/dydxViews/dydxViews/_v4/Wallet/Wallets2View.swift b/dydx/dydxViews/dydxViews/_v4/Wallet/Wallets2View.swift
@@ -32,6 +32,7 @@ public class Wallets2ViewModel: PlatformViewModel {
                 Text(DataLocalizer.localize(path: "APP.GENERAL.MANAGE_WALLET", params: nil))
                     .themeFont(fontType: .bold, fontSize: .largest)
                     .padding(.top, 40)
+                    .padding(.leading, 16)
 
                 VStack {
                     ForEach(self.walletConnections, id: \.id) { walletConnection in