feat: show when workspace apps are loading (#163)

ethanndickson · web-flow · commit 117d8fdf3996 · 2025-05-22T14:02:33.000+10:00
Also switches all the stock ProgressViews to our new CircularProgressView https://github.com/user-attachments/assets/7d800856-5dc3-4ae2-8193-41debbf676bd https://github.com/user-attachments/assets/c6a953b4-c14f-437c-8e02-2c21348386e7
diff --git a/Coder-Desktop/Coder-Desktop/Views/FileSync/FilePicker.swift b/Coder-Desktop/Coder-Desktop/Views/FileSync/FilePicker.swift
@@ -23,8 +23,7 @@ struct FilePicker: View {
         VStack(spacing: 0) {
             if model.rootIsLoading {
                 Spacer()
-                ProgressView()
-                    .controlSize(.large)
+                CircularProgressView(value: nil)
                 Spacer()
             } else if let loadError = model.error {
                 Text("\(loadError.description)")
@@ -125,7 +124,8 @@ struct FilePickerEntry: View {
             Label {
                 Text(entry.name)
                 ZStack {
-                    ProgressView().controlSize(.small).opacity(entry.isLoading && entry.error == nil ? 1 : 0)
+                    CircularProgressView(value: nil, strokeWidth: 2, diameter: 10)
+                        .opacity(entry.isLoading && entry.error == nil ? 1 : 0)
                     Image(systemName: "exclamationmark.triangle.fill")
                         .opacity(entry.error != nil ? 1 : 0)
                 }
diff --git a/Coder-Desktop/Coder-Desktop/Views/FileSync/FileSyncSessionModal.swift b/Coder-Desktop/Coder-Desktop/Views/FileSync/FileSyncSessionModal.swift
@@ -68,7 +68,7 @@ struct FileSyncSessionModal<VPN: VPNService, FS: FileSyncDaemon>: View {
                     Text(msg).foregroundStyle(.secondary)
                 }
                 if loading {
-                    ProgressView().controlSize(.small)
+                    CircularProgressView(value: nil, strokeWidth: 3, diameter: 15)
                 }
                 Button("Cancel", action: { dismiss() }).keyboardShortcut(.cancelAction)
                 Button(existingSession == nil ? "Add" : "Save") { Task { await submit() }}
diff --git a/Coder-Desktop/Coder-Desktop/Views/VPN/VPNMenuItem.swift b/Coder-Desktop/Coder-Desktop/Views/VPN/VPNMenuItem.swift
@@ -72,6 +72,8 @@ struct MenuItemView: View {
 
     @State private var apps: [WorkspaceApp] = []
 
+    @State private var loadingApps: Bool = true
+
     var hasApps: Bool { !apps.isEmpty }
 
     private var itemName: AttributedString {
@@ -129,9 +131,13 @@ struct MenuItemView: View {
                 MenuItemIcons(item: item, wsURL: wsURL)
             }
             if isExpanded {
-                if hasApps {
+                switch (loadingApps, hasApps) {
+                case (true, _):
+                    CircularProgressView(value: nil, strokeWidth: 3, diameter: 15)
+                        .padding(.top, 5)
+                case (false, true):
                     MenuItemCollapsibleView(apps: apps)
-                } else {
+                case (false, false):
                     HStack {
                         Text(item.status == .off ? "Workspace is offline." : "No apps available.")
                             .font(.body)
@@ -146,6 +152,7 @@ struct MenuItemView: View {
     }
 
     func loadApps() async {
+        defer { loadingApps = false }
         // If this menu item is an agent, and the user is logged in
         if case let .agent(agent) = item,
            let client = state.client,
diff --git a/Coder-Desktop/Coder-Desktop/Views/VPN/WorkspaceAppIcon.swift b/Coder-Desktop/Coder-Desktop/Views/VPN/WorkspaceAppIcon.swift
@@ -19,7 +19,7 @@ struct WorkspaceAppIcon: View {
                 ) { $0 }
                     placeholder: {
                         if app.icon != nil {
-                            ProgressView().controlSize(.small)
+                            CircularProgressView(value: nil, strokeWidth: 2, diameter: 10)
                         } else {
                             Image(systemName: "questionmark").frame(
                                 width: Theme.Size.appIconWidth,

Original file line number	Diff line number	Diff line change
`@@ -68,7 +68,7 @@ struct FileSyncSessionModal<VPN: VPNService, FS: FileSyncDaemon>: View {`
`68`	`68`	`Text(msg).foregroundStyle(.secondary)`
`69`	`69`	`}`
`70`	`70`	`if loading {`
`71`		`- ProgressView().controlSize(.small)`
	`71`	`+ CircularProgressView(value: nil, strokeWidth: 3, diameter: 15)`
`72`	`72`	`}`
`73`	`73`	`Button("Cancel", action: { dismiss() }).keyboardShortcut(.cancelAction)`
`74`	`74`	`Button(existingSession == nil ? "Add" : "Save") { Task { await submit() }}`