TRCL-3513 Have price on the left for bids when show orderbook side by…

… side (#67)
dydxprotocol · Jan 24, 2024 · 0468a9d · 0468a9d
1 parent 6b1ed14
commit 0468a9d
Showing 1 changed file with 56 additions and 38 deletions.
diff --git a/...dydxViews/dydxViews/_v4/Trade/TradeInput/Components/Orderbook/dydxOrderbookSideView.swift b/...dydxViews/dydxViews/_v4/Trade/TradeInput/Components/Orderbook/dydxOrderbookSideView.swift
@@ -5,18 +5,18 @@
 //  Created by John Huang on 1/4/23.
 //
 
+import dydxFormatter
 import PlatformUI
 import SwiftUI
 import Utilities
-import dydxFormatter
 
 public struct dydxOrderbookLine: Identifiable, Equatable {
     public static func == (lhs: dydxOrderbookLine, rhs: dydxOrderbookLine) -> Bool {
         lhs.price == rhs.price &&
-        lhs.size == rhs.size &&
-        lhs.sizeText == rhs.sizeText &&
-        lhs.depth == rhs.depth &&
-        lhs.taken == rhs.taken
+            lhs.size == rhs.size &&
+            lhs.sizeText == rhs.sizeText &&
+            lhs.depth == rhs.depth &&
+            lhs.taken == rhs.taken
     }
 
     public var id: String {
@@ -41,12 +41,11 @@ public struct dydxOrderbookLine: Identifiable, Equatable {
 }
 
 public class dydxOrderbookSideViewModel: PlatformViewModel, Equatable {
-
     public static func == (lhs: dydxOrderbookSideViewModel, rhs: dydxOrderbookSideViewModel) -> Bool {
         lhs.tickSize == rhs.tickSize &&
-        lhs.lines == rhs.lines &&
-        lhs.maxDepth == rhs.maxDepth &&
-        lhs.displayStyle == rhs.displayStyle
+            lhs.lines == rhs.lines &&
+            lhs.maxDepth == rhs.maxDepth &&
+            lhs.displayStyle == rhs.displayStyle
     }
 
     public enum DisplayStyle {
@@ -97,7 +96,6 @@ public class dydxOrderbookSideViewModel: PlatformViewModel, Equatable {
                 let actualLineHeight: CGFloat = intendedLineHeight + additionalLineHeight
 
                 LazyVStack(spacing: spacing) {
-
                     ForEach(lines.prefix(numLinesToDisplayInt), id: \.self.id) { line in
                         AnyView(
                             self.cell(line: line, maxDepth: maxDepth, fixedHeight: actualLineHeight)
@@ -115,34 +113,27 @@ public class dydxOrderbookSideViewModel: PlatformViewModel, Equatable {
 
     func cell(line: dydxOrderbookLine, maxDepth: Double, fixedHeight: Double?) -> any View {
         let lineView =
-        ZStack {
-            AnyView(depthBar(line: line, maxDepth: maxDepth))
-
-            let textContent =
-            HStack {
-                let priceText = dydxFormatter.shared.dollar(number: line.price, size: tickSize)
-
-                Text(line.sizeText)
-
-                Spacer()
-
-                Text(priceText ?? "")
-            }
-            .themeColor(foreground: line.textColor)
-
-            switch displayStyle {
-
-            case .sideBySide:
-                textContent
-                    .padding(.horizontal, 12)
-                    .padding(.vertical, 4)
-                    .themeFont(fontType: .number, fontSize: .medium)
-            case .topDown:
-                textContent
-                    .padding(.horizontal, 8)
-                    .themeFont(fontType: .number, fontSize: .smaller)
+            ZStack {
+                AnyView(depthBar(line: line, maxDepth: maxDepth))
+
+                switch displayStyle {
+                case .sideBySide:
+                    AnyView(
+                        sideBySideView(line: line)
+                            .themeColor(foreground: line.textColor)
+                            .padding(.horizontal, 12)
+                            .padding(.vertical, 4)
+                            .themeFont(fontType: .number, fontSize: .medium)
+                    )
+                case .topDown:
+                    AnyView(
+                        topDownView(line: line)
+                            .themeColor(foreground: line.textColor)
+                            .padding(.horizontal, 8)
+                            .themeFont(fontType: .number, fontSize: .smaller)
+                    )
+                }
             }
-        }
 
         if let fixedHeight = fixedHeight, fixedHeight > 0 {
             return lineView
@@ -155,10 +146,28 @@ public class dydxOrderbookSideViewModel: PlatformViewModel, Equatable {
         }
     }
 
+    func sideBySideView(line: dydxOrderbookLine) -> any View {
+        HStack {
+            let priceText = dydxFormatter.shared.dollar(number: line.price, size: tickSize)
+            Text(priceText ?? "")
+            Spacer()
+            Text(line.sizeText)
+        }
+    }
+
+    func topDownView(line: dydxOrderbookLine) -> any View {
+        HStack {
+            let priceText = dydxFormatter.shared.dollar(number: line.price, size: tickSize)
+            Text(line.sizeText)
+            Spacer()
+            Text(priceText ?? "")
+        }
+    }
+
     func depthBar(line: dydxOrderbookLine, maxDepth: Double) -> any View {
         GeometryReader { [weak self] geometry in
             let width = geometry.size.width
-            let sizeRatio = min(1.0, (line.size ) / maxDepth)
+            let sizeRatio = min(1.0, (line.size) / maxDepth)
             let depthRatio = min(1.0, (line.depth ?? 0.0) / maxDepth)
             let takenRatio = min(1.0, (line.taken ?? 0.0) / maxDepth)
             ZStack {
@@ -220,6 +229,15 @@ public class dydxOrderbookAsksViewModel: dydxOrderbookSideViewModel {
     override func color() -> ThemeColor.SemanticColor {
         return ThemeSettings.negativeColor
     }
+
+    override func sideBySideView(line: dydxOrderbookLine) -> any View {
+        HStack {
+            let priceText = dydxFormatter.shared.dollar(number: line.price, size: tickSize)
+            Text(line.sizeText)
+            Spacer()
+            Text(priceText ?? "")
+        }
+    }
 }
 
 public class dydxOrderbookBidsViewModel: dydxOrderbookSideViewModel {}