Skip to content

Commit 2adace3

Browse files
ethanndicksonethanndickson
authored
feat: add coder connect startup progress indicator (#161)
Closes #159. https://github.com/user-attachments/assets/26391aef-31a1-4d5a-8db0-910a9fbe97ea
1 parent 48afa7a commit 2adace3

File tree

13 files changed

+381
-51
lines changed

13 files changed

+381
-51
lines changed

‎Coder-Desktop/Coder-Desktop/Preview Content/PreviewVPN.swift

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ final class PreviewVPN: Coder_Desktop.VPNService {
3333
self.shouldFail = shouldFail
3434
}
3535

36+
@Published var progress: VPNProgress = .init(stage: .initial, downloadProgress: nil)
37+
3638
var startTask: Task<Void, Never>?
3739
func start() async {
3840
if await startTask?.value != nil {

‎Coder-Desktop/Coder-Desktop/VPN/VPNProgress.swift

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import SwiftUI
2+
import VPNLib
3+
4+
struct VPNProgress {
5+
let stage: ProgressStage
6+
let downloadProgress: DownloadProgress?
7+
}
8+
9+
struct VPNProgressView: View {
10+
let state: VPNServiceState
11+
let progress: VPNProgress
12+
13+
var body: some View {
14+
VStack {
15+
CircularProgressView(value: value)
16+
// We estimate that the last half takes 8 seconds
17+
// so it doesn't appear stuck
18+
.autoComplete(threshold: 0.5, duration: 8)
19+
Text(progressMessage)
20+
.multilineTextAlignment(.center)
21+
}
22+
.padding()
23+
.foregroundStyle(.secondary)
24+
}
25+
26+
var progressMessage: String {
27+
"\(progress.stage.description ?? defaultMessage)\(downloadProgressMessage)"
28+
}
29+
30+
var downloadProgressMessage: String {
31+
progress.downloadProgress.flatMap { "\n\($0.description)" } ?? ""
32+
}
33+
34+
var defaultMessage: String {
35+
state == .connecting ? "Starting Coder Connect..." : "Stopping Coder Connect..."
36+
}
37+
38+
var value: Float? {
39+
guard state == .connecting else {
40+
return nil
41+
}
42+
switch progress.stage {
43+
case .initial:
44+
return 0
45+
case .downloading:
46+
guard let downloadProgress = progress.downloadProgress else {
47+
// We can't make this illegal state unrepresentable because XPC
48+
// doesn't support enums with associated values.
49+
return 0.05
50+
}
51+
// 35MB if the server doesn't give us the expected size
52+
let totalBytes = downloadProgress.totalBytesToWrite ?? 35_000_000
53+
let downloadPercent = min(1.0, Float(downloadProgress.totalBytesWritten) / Float(totalBytes))
54+
return 0.4 * downloadPercent
55+
case .validating:
56+
return 0.43
57+
case .removingQuarantine:
58+
return 0.46
59+
case .startingTunnel:
60+
return 0.50
61+
}
62+
}
63+
}

‎Coder-Desktop/Coder-Desktop/VPN/VPNService.swift

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import VPNLib
77
protocol VPNService: ObservableObject {
88
var state: VPNServiceState { get }
99
var menuState: VPNMenuState { get }
10+
var progress: VPNProgress { get }
1011
func start() async
1112
func stop() async
1213
func configureTunnelProviderProtocol(proto: NETunnelProviderProtocol?)
@@ -55,7 +56,14 @@ final class CoderVPNService: NSObject, VPNService {
5556
var logger = Logger(subsystem: Bundle.main.bundleIdentifier!, category: "vpn")
5657
lazy var xpc: VPNXPCInterface = .init(vpn: self)
5758

58-
@Published var tunnelState: VPNServiceState = .disabled
59+
@Published var tunnelState: VPNServiceState = .disabled {
60+
didSet {
61+
if tunnelState == .connecting {
62+
progress = .init(stage: .initial, downloadProgress: nil)
63+
}
64+
}
65+
}
66+
5967
@Published var sysExtnState: SystemExtensionState = .uninstalled
6068
@Published var neState: NetworkExtensionState = .unconfigured
6169
var state: VPNServiceState {
@@ -72,6 +80,8 @@ final class CoderVPNService: NSObject, VPNService {
7280
return tunnelState
7381
}
7482

83+
@Published var progress: VPNProgress = .init(stage: .initial, downloadProgress: nil)
84+
7585
@Published var menuState: VPNMenuState = .init()
7686

7787
// Whether the VPN should start as soon as possible
@@ -155,6 +165,10 @@ final class CoderVPNService: NSObject, VPNService {
155165
}
156166
}
157167

168+
func onProgress(stage: ProgressStage, downloadProgress: DownloadProgress?) {
169+
progress = .init(stage: stage, downloadProgress: downloadProgress)
170+
}
171+
158172
func applyPeerUpdate(with update: Vpn_PeerUpdate) {
159173
// Delete agents
160174
update.deletedAgents.forEach { menuState.deleteAgent(withId: $0.id) }

‎Coder-Desktop/Coder-Desktop/Views/CircularProgressView.swift

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import SwiftUI
2+
3+
struct CircularProgressView: View {
4+
let value: Float?
5+
6+
var strokeWidth: CGFloat = 4
7+
var diameter: CGFloat = 22
8+
var primaryColor: Color = .secondary
9+
var backgroundColor: Color = .secondary.opacity(0.3)
10+
11+
@State private var rotation = 0.0
12+
@State private var trimAmount: CGFloat = 0.15
13+
14+
var autoCompleteThreshold: Float?
15+
var autoCompleteDuration: TimeInterval?
16+
17+
var body: some View {
18+
ZStack {
19+
// Background circle
20+
Circle()
21+
.stroke(backgroundColor, style: StrokeStyle(lineWidth: strokeWidth, lineCap: .round))
22+
.frame(width: diameter, height: diameter)
23+
Group {
24+
if let value {
25+
// Determinate gauge
26+
Circle()
27+
.trim(from: 0, to: CGFloat(displayValue(for: value)))
28+
.stroke(primaryColor, style: StrokeStyle(lineWidth: strokeWidth, lineCap: .round))
29+
.frame(width: diameter, height: diameter)
30+
.rotationEffect(.degrees(-90))
31+
.animation(autoCompleteAnimation(for: value), value: value)
32+
} else {
33+
// Indeterminate gauge
34+
Circle()
35+
.trim(from: 0, to: trimAmount)
36+
.stroke(primaryColor, style: StrokeStyle(lineWidth: strokeWidth, lineCap: .round))
37+
.frame(width: diameter, height: diameter)
38+
.rotationEffect(.degrees(rotation))
39+
}
40+
}
41+
}
42+
.frame(width: diameter + strokeWidth * 2, height: diameter + strokeWidth * 2)
43+
.onAppear {
44+
if value == nil {
45+
withAnimation(.linear(duration: 0.8).repeatForever(autoreverses: false)) {
46+
rotation = 360
47+
}
48+
}
49+
}
50+
}
51+
52+
private func displayValue(for value: Float) -> Float {
53+
if let threshold = autoCompleteThreshold,
54+
value >= threshold, value < 1.0
55+
{
56+
return 1.0
57+
}
58+
return value
59+
}
60+
61+
private func autoCompleteAnimation(for value: Float) -> Animation? {
62+
guard let threshold = autoCompleteThreshold,
63+
let duration = autoCompleteDuration,
64+
value >= threshold, value < 1.0
65+
else {
66+
return .default
67+
}
68+
69+
return .easeOut(duration: duration)
70+
}
71+
}
72+
73+
extension CircularProgressView {
74+
func autoComplete(threshold: Float, duration: TimeInterval) -> CircularProgressView {
75+
var view = self
76+
view.autoCompleteThreshold = threshold
77+
view.autoCompleteDuration = duration
78+
return view
79+
}
80+
}

‎Coder-Desktop/Coder-Desktop/Views/VPN/Agents.swift

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,9 @@ struct Agents<VPN: VPNService>: View {
3333
if hasToggledExpansion {
3434
return
3535
}
36-
expandedItem = visibleItems.first?.id
36+
withAnimation(.snappy(duration: Theme.Animation.collapsibleDuration)) {
37+
expandedItem = visibleItems.first?.id
38+
}
3739
hasToggledExpansion = true
3840
}
3941
if items.count == 0 {

‎Coder-Desktop/Coder-Desktop/Views/VPN/VPNState.swift

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,7 @@ struct VPNState<VPN: VPNService>: View {
2828
case (.connecting, _), (.disconnecting, _):
2929
HStack {
3030
Spacer()
31-
ProgressView(
32-
vpn.state == .connecting ? "Starting Coder Connect..." : "Stopping Coder Connect..."
33-
).padding()
31+
VPNProgressView(state: vpn.state, progress: vpn.progress)
3432
Spacer()
3533
}
3634
case let (.failed(vpnErr), _):

‎Coder-Desktop/Coder-Desktop/XPCInterface.swift

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,12 @@ import VPNLib
7171
}
7272
}
7373

74+
func onProgress(stage: ProgressStage, downloadProgress: DownloadProgress?) {
75+
Task { @MainActor in
76+
svc.onProgress(stage: stage, downloadProgress: downloadProgress)
77+
}
78+
}
79+
7480
// The NE has verified the dylib and knows better than Gatekeeper
7581
func removeQuarantine(path: String, reply: @escaping (Bool) -> Void) {
7682
let reply = CallbackWrapper(reply)

‎Coder-Desktop/Coder-DesktopTests/Util.swift

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ class MockVPNService: VPNService, ObservableObject {
1010
@Published var state: Coder_Desktop.VPNServiceState = .disabled
1111
@Published var baseAccessURL: URL = .init(string: "https://dev.coder.com")!
1212
@Published var menuState: VPNMenuState = .init()
13+
@Published var progress: VPNProgress = .init(stage: .initial, downloadProgress: nil)
1314
var onStart: (() async -> Void)?
1415
var onStop: (() async -> Void)?
1516

‎Coder-Desktop/Coder-DesktopTests/VPNStateTests.swift

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,7 @@ struct VPNStateTests {
3838

3939
try await ViewHosting.host(view) {
4040
try await sut.inspection.inspect { view in
41-
let progressView = try view.find(ViewType.ProgressView.self)
42-
#expect(try progressView.labelView().text().string() == "Starting Coder Connect...")
41+
_ = try view.find(text: "Starting Coder Connect...")
4342
}
4443
}
4544
}
@@ -50,8 +49,7 @@ struct VPNStateTests {
5049

5150
try await ViewHosting.host(view) {
5251
try await sut.inspection.inspect { view in
53-
let progressView = try view.find(ViewType.ProgressView.self)
54-
#expect(try progressView.labelView().text().string() == "Stopping Coder Connect...")
52+
_ = try view.find(text: "Stopping Coder Connect...")
5553
}
5654
}
5755
}

‎Coder-Desktop/VPN/Manager.swift

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,10 +35,18 @@ actor Manager {
3535
// Timeout after 5 minutes, or if there's no data for 60 seconds
3636
sessionConfig.timeoutIntervalForRequest = 60
3737
sessionConfig.timeoutIntervalForResource = 300
38-
try await download(src: dylibPath, dest: dest, urlSession: URLSession(configuration: sessionConfig))
38+
try await download(
39+
src: dylibPath,
40+
dest: dest,
41+
urlSession: URLSession(configuration: sessionConfig)
42+
) { progress in
43+
// TODO: Debounce, somehow
44+
pushProgress(stage: .downloading, downloadProgress: progress)
45+
}
3946
} catch {
4047
throw .download(error)
4148
}
49+
pushProgress(stage: .validating)
4250
let client = Client(url: cfg.serverUrl)
4351
let buildInfo: BuildInfoResponse
4452
do {
@@ -158,6 +166,7 @@ actor Manager {
158166
}
159167

160168
func startVPN() async throws(ManagerError) {
169+
pushProgress(stage: .startingTunnel)
161170
logger.info("sending start rpc")
162171
guard let tunFd = ptp.tunnelFileDescriptor else {
163172
logger.error("no fd")
@@ -234,6 +243,15 @@ actor Manager {
234243
}
235244
}
236245

246+
func pushProgress(stage: ProgressStage, downloadProgress: DownloadProgress? = nil) {
247+
guard let conn = globalXPCListenerDelegate.conn else {
248+
logger.warning("couldn't send progress message to app: no connection")
249+
return
250+
}
251+
logger.debug("sending progress message to app")
252+
conn.onProgress(stage: stage, downloadProgress: downloadProgress)
253+
}
254+
237255
struct ManagerConfig {
238256
let apiToken: String
239257
let serverUrl: URL
@@ -312,6 +330,7 @@ private func removeQuarantine(_ dest: URL) async throws(ManagerError) {
312330
let file = NSURL(fileURLWithPath: dest.path)
313331
try? file.getResourceValue(&flag, forKey: kCFURLQuarantinePropertiesKey as URLResourceKey)
314332
if flag != nil {
333+
pushProgress(stage: .removingQuarantine)
315334
// Try the privileged helper first (it may not even be registered)
316335
if await globalHelperXPCSpeaker.tryRemoveQuarantine(path: dest.path) {
317336
// Success!

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy