show less/more + display error

ethanndickson · ethanndickson · commit 09bcf7cffdaf · 2024-12-03T19:32:03.000+11:00
diff --git a/.swiftlint.yml b/.swiftlint.yml
@@ -1,2 +1,3 @@
 disabled_rules:
-  - todo
+  - todo
+  - trailing_comma
diff --git a/Desktop/AgentRow.swift b/Desktop/AgentRow.swift
@@ -1,6 +1,6 @@
 import SwiftUI
 
-struct AgentRow: Identifiable {
+struct AgentRow: Identifiable, Equatable {
     let id: UUID
     let name: String
     let status: Color
@@ -55,11 +55,11 @@ struct AgentRowView: View {
                     .padding(3)
             }.foregroundStyle(copyIsSelected ? Color.white : .primary)
                 .imageScale(.small)
-            .background(copyIsSelected ? Color.accentColor.opacity(0.8) : .clear)
-            .clipShape(.rect(cornerRadius: 4))
-            .onHover { hovering in copyIsSelected = hovering }
-            .buttonStyle(.plain)
-            .padding(.trailing, 5)
+                .background(copyIsSelected ? Color.accentColor.opacity(0.8) : .clear)
+                .clipShape(.rect(cornerRadius: 4))
+                .onHover { hovering in copyIsSelected = hovering }
+                .buttonStyle(.plain)
+                .padding(.trailing, 5)
         }
     }
 }
diff --git a/Desktop/CoderVPN.swift b/Desktop/CoderVPN.swift
@@ -8,9 +8,20 @@ protocol CoderVPN: ObservableObject {
 }
 
 enum CoderVPNState: Equatable {
-        case disabled
-        case connecting
-        case disconnecting
-        case connected
-        case failed(String)
+    case disabled
+    case connecting
+    case disconnecting
+    case connected
+    case failed(CoderVPNError)
+}
+
+enum CoderVPNError: Error {
+    case exampleError
+
+    var description: String {
+        switch self {
+        case .exampleError:
+            return "This is a long error to test the UI with long errors"
+        }
+    }
 }
diff --git a/Desktop/Preview Content/PreviewVPN.swift b/Desktop/Preview Content/PreviewVPN.swift
@@ -7,39 +7,48 @@ class PreviewVPN: Desktop.CoderVPN {
         AgentRow(id: UUID(), name: "testing-a-very-long-name", status: .green, copyableDNS: "asdf.coder"),
         AgentRow(id: UUID(), name: "opensrc", status: .yellow, copyableDNS: "asdf.coder"),
         AgentRow(id: UUID(), name: "gvisor", status: .gray, copyableDNS: "asdf.coder"),
-        AgentRow(id: UUID(), name: "example", status: .gray, copyableDNS: "asdf.coder")
+        AgentRow(id: UUID(), name: "example", status: .gray, copyableDNS: "asdf.coder"),
+        AgentRow(id: UUID(), name: "dogfood2", status: .red, copyableDNS: "asdf.coder"),
+        AgentRow(id: UUID(), name: "testing-a-very-long-name", status: .green, copyableDNS: "asdf.coder"),
+        AgentRow(id: UUID(), name: "opensrc", status: .yellow, copyableDNS: "asdf.coder"),
+        AgentRow(id: UUID(), name: "gvisor", status: .gray, copyableDNS: "asdf.coder"),
+        AgentRow(id: UUID(), name: "example", status: .gray, copyableDNS: "asdf.coder"),
     ]
-    func start() async {
-            await MainActor.run {
-                state = .connecting
-            }
-            do {
-                try await Task.sleep(nanoseconds: 1_000_000_000)
-            } catch {
-                await MainActor.run {
-                    state = .failed("Timed out starting CoderVPN")
-                }
-                return
-            }
-            await MainActor.run {
-                state = .connected
-            }
-        }
+    let shouldFail: Bool
 
-    func stop() async {
+    init(shouldFail: Bool = false) {
+        self.shouldFail = shouldFail
+    }
+
+    private func setState(_ newState: Desktop.CoderVPNState) async {
         await MainActor.run {
-            state = .disconnecting
+            self.state = newState
         }
+    }
+
+    func start() async {
+        await setState(.connecting)
         do {
-            try await Task.sleep(nanoseconds: 1_000_000_000) // Simulate network delay
+            try await Task.sleep(nanoseconds: 1000000000)
         } catch {
-            await MainActor.run {
-                state = .failed("Timed out stopping CoderVPN")
-            }
+            await setState(.failed(.exampleError))
             return
         }
-        await MainActor.run {
-            state = .disabled
+        if shouldFail {
+            await setState(.failed(.exampleError))
+        } else {
+            await setState(.connected)
+        }
+    }
+
+    func stop() async {
+        await setState(.disconnecting)
+        do {
+            try await Task.sleep(nanoseconds: 1000000000) // Simulate network delay
+        } catch {
+            await setState(.failed(.exampleError))
+            return
         }
+        await setState(.disabled)
     }
 }
diff --git a/Desktop/VPNMenu.swift b/Desktop/VPNMenu.swift
@@ -2,24 +2,27 @@ import SwiftUI
 
 struct VPNMenu<VPN: CoderVPN>: View {
     @ObservedObject var vpnService: VPN
+    @State var viewAll = false
+
+    private let defaultVisibleRows = 5
 
     var body: some View {
         // Main stack
-        VStack(alignment: .leading) {
+        VStackLayout(alignment: .leading) {
             // CoderVPN Stack
             VStack(alignment: .leading, spacing: 10) {
                 HStack {
                     Toggle(isOn: Binding(
                         get: { self.vpnService.state == .connected || self.vpnService.state == .connecting },
                         set: { isOn in Task {
-                                if isOn { await self.vpnService.start() } else { await self.vpnService.stop() }
-                            }
+                            if isOn { await self.vpnService.start() } else { await self.vpnService.stop() }
+                        }
                         }
                     )) {
                         Text("CoderVPN")
                             .frame(maxWidth: .infinity, alignment: .leading)
                     }.toggleStyle(.switch)
-                    .disabled(self.vpnService.state == .connecting || self.vpnService.state == .disconnecting)
+                        .disabled(self.vpnService.state == .connecting || self.vpnService.state == .disconnecting)
                 }
                 Divider()
                 Text("Workspace Agents")
@@ -35,12 +38,34 @@ struct VPNMenu<VPN: CoderVPN>: View {
                         ).padding()
                         Spacer()
                     }
+                } else if case let .failed(vpnErr) = self.vpnService.state {
+                    Text("\(vpnErr.description)")
+                        .font(.headline)
+                        .foregroundColor(.red)
+                        .multilineTextAlignment(.center)
+                        .fixedSize(horizontal: false, vertical: true)
+                        .padding(.horizontal, 15)
+                        .padding(.top, 5)
+                        .frame(maxWidth: .infinity)
                 }
             }.padding([.horizontal, .top], 15)
+            // Workspaces List
             if self.vpnService.state == .connected {
-                ForEach(self.vpnService.data) { workspace in
+                let visibleData = viewAll ? vpnService.data : Array(vpnService.data.prefix(defaultVisibleRows))
+                ForEach(visibleData) { workspace in
                     AgentRowView(workspace: workspace).padding(.horizontal, 5)
                 }
+                if vpnService.data.count > defaultVisibleRows {
+                    Button(action: {
+                        viewAll.toggle()
+                    }, label: {
+                        Text(viewAll ? "Show Less" : "Show All")
+                            .font(.headline)
+                            .foregroundColor(.gray)
+                            .padding(.horizontal, 15)
+                            .padding(.top, 5)
+                    }).buttonStyle(.plain)
+                }
             }
             // Trailing stack
             VStack(alignment: .leading, spacing: 3) {
@@ -49,29 +74,29 @@ struct VPNMenu<VPN: CoderVPN>: View {
                     Text("Create workspace")
                     EmptyView()
                 } action: {
-                    // TODO
+                    // TODO:
                 }
                 Divider().padding([.horizontal], 10).padding(.vertical, 4)
                 ButtonRowView {
                     Text("About")
                 } action: {
-                    // TODO
+                    // TODO:
                 }
                 ButtonRowView {
                     Text("Preferences")
                 } action: {
-                    // TODO
+                    // TODO:
                 }
                 ButtonRowView {
                     Text("Sign out")
                 } action: {
-                    // TODO
+                    // TODO:
                 }
             }.padding([.horizontal, .bottom], 5)
         }.padding(.bottom, 5)
     }
 }
 
 #Preview {
-    VPNMenu(vpnService: PreviewVPN()).frame(width: 256)
+    VPNMenu(vpnService: PreviewVPN(shouldFail: true)).frame(width: 256)
 }
diff --git a/DesktopTests/DesktopTests.swift b/DesktopTests/DesktopTests.swift
@@ -1,10 +1,8 @@
-import Testing
 @testable import Desktop
+import Testing
 
 struct DesktopTests {
-
     @Test func example() async throws {
         // Write your test here and use APIs like `#expect(...)` to check expected conditions.
     }
-
 }
diff --git a/DesktopUITests/DesktopUITests.swift b/DesktopUITests/DesktopUITests.swift
@@ -1,7 +1,6 @@
 import XCTest
 
 final class DesktopUITests: XCTestCase {
-
     override func setUpWithError() throws {
         // Put setup code here. This method is called before the invocation of each test method in the class.
 
diff --git a/DesktopUITests/DesktopUITestsLaunchTests.swift b/DesktopUITests/DesktopUITestsLaunchTests.swift
@@ -1,7 +1,6 @@
 import XCTest
 
 final class DesktopUITestsLaunchTests: XCTestCase {
-
     override class var runsForEachTargetApplicationUIConfiguration: Bool {
         true
     }

-Original file line number
+Diff line change
@@ @@ -1,2 +1,3 @@ @@
 disabled_rules:
 -  - todo
 +  - todo
 +  - trailing_comma
Original file line number	Diff line number	Diff line change
`@@ -1,10 +1,8 @@`
`1`		`-import Testing`
`2`	`1`	`@testable import Desktop`
	`2`	`+import Testing`
`3`	`3`
`4`	`4`	`struct DesktopTests {`
`5`		`-`
`6`	`5`	`@Test func example() async throws {`
`7`	`6`	// Write your test here and use APIs like `#expect(...)` to check expected conditions.
`8`	`7`	`}`
`9`		`-`
`10`	`8`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,6 @@`
`1`	`1`	`import XCTest`
`2`	`2`
`3`	`3`	`final class DesktopUITestsLaunchTests: XCTestCase {`
`4`		`-`
`5`	`4`	`override class var runsForEachTargetApplicationUIConfiguration: Bool {`
`6`	`5`	`true`
`7`	`6`	`}`