feat: 3-column proxies

ClashX Dashboard/Views/ContentTabs/Proxies/ProxiesView.swift

@@ -5,6 +5,7 @@
 //
 
 import SwiftUI
+import Introspect
 
 class ProxiesSearchString: ObservableObject, Identifiable {
 	let id = UUID().uuidString
@@ -13,72 +14,37 @@ class ProxiesSearchString: ObservableObject, Identifiable {
 
 struct ProxiesView: View {
 	
-	@State var proxyInfo: ClashProxyResp?
-	@State var proxyGroups = [ClashProxy]()
-	
-	@State var providerInfo: ClashProviderResp?
-	@State var providers = [ClashProvider]()
-	
-//	@State var proxyProviderList
+	@ObservedObject var proxyStorage = DBProxyStorage()
 	
 	@State private var searchString = ProxiesSearchString()
 	@State private var isGlobalMode = false
-	@State private var proxyListColumnCount = 3
 	
     var body: some View {
-		List() {
-			Text("Proxies")
-				.font(.title)
-			ForEach(proxyGroups, id: \.id) { group in
-				ProxyGroupView(columnCount: $proxyListColumnCount, proxyGroup: group, proxyInfo: proxyInfo!)
+		NavigationView {
+			List(proxyStorage.groups, id: \.id) { group in
+				ProxyGroupRowView(proxyGroup: group)
 			}
-			
-			Text("Proxy Provider")
-				.font(.title)
-				.padding(.top)
-			
-			ForEach($providers, id: \.id) { provider in
-				ProxyProviderGroupView(columnCount: $proxyListColumnCount, providerInfo: provider)
+			.introspectTableView {
+				$0.refusesFirstResponder = true
+				$0.doubleAction = nil
 			}
-		}
-		.background {
-			GeometryReader { geometry in
-				Rectangle()
-					.fill(.clear)
-					.frame(height: 1)
-					.onChange(of: geometry.size.width) { newValue in
-						updateColumnCount(newValue)
-					}
-					.onAppear {
-						updateColumnCount(geometry.size.width)
-					}
-			}.padding()
+			.listStyle(.plain)
+			EmptyView()
 		}
 		.searchable(text: $searchString.string)
 		.environmentObject(searchString)
 		.onAppear {
-			
-//			self.isGlobalMode = ConfigManager.shared.currentConfig?.mode == .global
-			ApiRequest.getMergedProxyData {
-				proxyInfo = $0
-				proxyGroups = ($0?.proxyGroups ?? []).filter {
-					isGlobalMode ? true : $0.name != "GLOBAL"
-				}
-				
-				providerInfo = proxyInfo?.enclosingProviderResp
-				providers = providerInfo?.providers.map {
-					$0.value
-				} ?? []
-			}
+			loadProxies()
 		}
     }
 	
-	func updateColumnCount(_ width: Double) {
-		let v = Int(Int(width) / 200)
-		let new = v == 0 ? 1 : v
-		
-		if new != proxyListColumnCount {
-			proxyListColumnCount = new
+	
+	func loadProxies() {
+//			self.isGlobalMode = ConfigManager.shared.currentConfig?.mode == .global
+		ApiRequest.requestProxyGroupList {
+			proxyStorage.groups = DBProxyStorage($0).groups.filter {
+				isGlobalMode ? true : $0.name != "GLOBAL"
+			}
 		}
 	}
 }

ClashX Dashboard/Views/ContentTabs/Proxies/ProxyGroupRowView.swift

@@ -0,0 +1,45 @@
+//
+//  ProxyGroupInfoView.swift
+//  ClashX Dashboard
+//
+//
+
+import SwiftUI
+
+struct ProxyGroupRowView: View {
+	
+	@ObservedObject var proxyGroup: DBProxyGroup
+
+    var body: some View {
+		NavigationLink {
+			ProxyGroupView(proxyGroup: proxyGroup)
+		} label: {
+			labelView
+		}
+    }
+	
+	var labelView: some View {
+		VStack(spacing: 2) {
+			HStack(alignment: .center) {
+				Text(proxyGroup.name)
+					.font(.system(size: 15))
+				Spacer()
+				if let proxy = proxyGroup.currentProxy {
+					Text(proxy.delayString)
+						.foregroundColor(proxy.delayColor)
+						.font(.system(size: 12))
+				}
+			}
+			
+			HStack {
+				Text(proxyGroup.type.rawValue)
+				Spacer()
+				Text(proxyGroup.now ?? "")
+			}
+			.font(.system(size: 11))
+			.foregroundColor(.secondary)
+		}
+		.padding(EdgeInsets(top: 3, leading: 4, bottom: 3, trailing: 4))
+	}
+}
+

ClashX Dashboard/Views/ContentTabs/Proxies/ProxyGroupView.swift

@@ -8,68 +8,83 @@ import SwiftUI
 
 struct ProxyGroupView: View {
 	
-	@Binding var columnCount: Int
-	
-	@State var proxyGroup: ClashProxy
-	@State var proxyInfo: ClashProxyResp
-	@State private var proxyItems: [ProxyItemData]
-	@State private var currentProxy: ClashProxyName
-	@State private var isUpdatingSelect = false
-	@State private var selectable = false
-	
-	@State private var isListExpanded = false
-	@State private var isTesting = false
-	
+	@ObservedObject var proxyGroup: DBProxyGroup
 	@EnvironmentObject var searchString: ProxiesSearchString
 	
-	init(columnCount: Binding<Int>,
-		 proxyGroup: ClashProxy,
-		 proxyInfo: ClashProxyResp) {
+	@State private var columnCount: Int = 3
+	@State private var isUpdatingSelect = false
+	@State private var selectable = false
+	@State private var isTesting = false
+	
+	var body: some View {
+		ScrollView {
+			Section {
+				proxyListView
+			} header: {
+				proxyInfoView
+			}
+			.padding()
+		}
 		
-		self._columnCount = columnCount
-		self.proxyGroup = proxyGroup
-		self.proxyInfo = proxyInfo
-		self.currentProxy = proxyGroup.now ?? ""
-		self.selectable = [.select, .fallback].contains(proxyGroup.type)
-
-		self.proxyItems = proxyGroup.all?.compactMap { name in
-			proxyInfo.proxiesMap[name]
-		}.map(ProxyItemData.init) ?? []
+		.background {
+			GeometryReader { geometry in
+				Rectangle()
+					.fill(.clear)
+					.frame(height: 1)
+					.onChange(of: geometry.size.width) { newValue in
+						updateColumnCount(newValue)
+					}
+					.onAppear {
+						updateColumnCount(geometry.size.width)
+					}
+			}.padding()
+		}
+		.onAppear {
+			self.selectable = [.select, .fallback].contains(proxyGroup.type)
+		}
 	}
 	
-	
-    var body: some View {
-		Section {
-			proxyListView
-				.background {
-					Rectangle()
-						.frame(width: 2, height: listHeight(columnCount))
-						.foregroundColor(.clear)
-				}
-				.show(isVisible: !isListExpanded)
-			
-		} header: {
-			proxyInfoView
+	func updateColumnCount(_ width: Double) {
+		let v = Int(Int(width) / 180)
+		let new = v == 0 ? 1 : v
+		
+		if new != columnCount {
+			columnCount = new
 		}
-    }
+	}
+	
 	
 	var proxyInfoView: some View {
 		HStack() {
 			Text(proxyGroup.name)
-				.font(.title)
-				.fontWeight(.medium)
+				.font(.system(size: 17))
 			Text(proxyGroup.type.rawValue)
-			Text("\(proxyGroup.all?.count ?? 0)")
-			Button() {
-				isListExpanded = !isListExpanded
-			} label: {
-				Image(systemName: isListExpanded ? "chevron.up" : "chevron.down")
-			}
+				.font(.system(size: 13))
+				.foregroundColor(.secondary)
+			Text("\(proxyGroup.proxies.count)")
+				.font(.system(size: 11))
+				.padding(EdgeInsets(top: 2, leading: 4, bottom: 2, trailing: 4))
+				.background(Color.gray.opacity(0.5))
+				.cornerRadius(4)
+			
+			Spacer()
 			
 			Button() {
 				startBenchmark()
 			} label: {
-				Image(systemName: "bolt.fill")
+				HStack {
+					if isTesting {
+						ProgressView()
+							.controlSize(.small)
+							.frame(width: 12)
+					} else {
+						Image(systemName: "bolt.fill")
+							.frame(width: 12)
+					}
+					Text(isTesting ? "Testing" : (proxyGroup.type == .urltest ? "Retest" : "Benchmark"))
+						.frame(width: 70)
+				}
+				.foregroundColor(isTesting ? .gray : .blue)
 			}
 			.disabled(isTesting)
 		}
@@ -78,46 +93,44 @@ struct ProxyGroupView: View {
 	var proxyListView: some View {
 		LazyVGrid(columns: Array(repeating: GridItem(.flexible()),
 								 count: columnCount)) {
-			ForEach($proxyItems, id: \.id) { item in
+			ForEach($proxyGroup.proxies, id: \.id) { proxy in
 				ProxyItemView(
-					proxy: item,
+					proxy: proxy,
 					selectable: selectable
 				)
-				.background(currentProxy == item.wrappedValue.name ? Color.teal : Color.white)
+				.background(proxyGroup.now == proxy.wrappedValue.name ? Color.teal : Color.white)
 				.cornerRadius(8)
 				.onTapGesture {
-					let item = item.wrappedValue
+					let item = proxy.wrappedValue
 					updateSelect(item.name)
 				}
 				.show(isVisible: {
 					if searchString.string.isEmpty {
 						return true
 					} else {
-						return item.wrappedValue.name.lowercased().contains(searchString.string.lowercased())
+						return proxy.wrappedValue.name.lowercased().contains(searchString.string.lowercased())
 					}
 				}())
 			}
 		}
 	}
-	
-	func listHeight(_ columnCount: Int) -> Double {
-		let lineCount = ceil(Double(proxyItems.count) / Double(columnCount))
-		return lineCount * 60 + (lineCount - 1) * 8
-	}
-	
 
 	func startBenchmark() {
 		isTesting = true
 		ApiRequest.getGroupDelay(groupName: proxyGroup.name) { delays in
-			proxyGroup.all?.forEach { proxyName in
+			proxyGroup.proxies.enumerated().forEach {
 				var delay = 0
-				if let d = delays[proxyName], d != 0 {
+				if let d = delays[$0.element.name], d != 0 {
 					delay = d
 				}
+				guard $0.offset < proxyGroup.proxies.count,
+					  proxyGroup.proxies[$0.offset].name == $0.element.name
+				else { return }
+				proxyGroup.proxies[$0.offset].delay = delay
 				
-				proxyItems.first {
-					$0.name == proxyName
-				}?.delay = delay
+				if proxyGroup.currentProxy?.name == $0.element.name {
+					proxyGroup.currentProxy = proxyGroup.proxies[$0.offset]
+				}
 			}
 			isTesting = false
 		}
@@ -129,7 +142,7 @@ struct ProxyGroupView: View {
 		ApiRequest.updateProxyGroup(group: proxyGroup.name, selectProxy: name) { success in
 			isUpdatingSelect = false
 			guard success else { return }
-			currentProxy = name
+			proxyGroup.now = name
 		}
 	}
 	

ClashX Dashboard/Views/ContentTabs/Proxies/ProxyItemData.swift

@@ -1,75 +0,0 @@
-//
-//  ProxyItemData.swift
-//  ClashX Dashboard
-//
-//
-
-import Cocoa
-import SwiftUI
-
-class ProxyItemData: NSObject, ObservableObject {
-	let id: String
-	@objc let name: ClashProxyName
-	let type: ClashProxyType
-	let udpString: String
-	let tfo: Bool
-	let all: [ClashProxyName]
-	
-	var delay: Int {
-		didSet {
-			switch delay {
-			case 0:
-				delayString = NSLocalizedString("fail", comment: "")
-			default:
-				delayString = "\(delay) ms"
-			}
-			
-			let httpsTest = true
-			
-			switch delay {
-			case 0:
-				delayColor = .gray
-			case ..<200 where !httpsTest:
-				delayColor = .green
-			case ..<800 where httpsTest:
-				delayColor = .green
-			case 200..<500 where !httpsTest:
-				delayColor = .yellow
-			case 800..<1500 where httpsTest:
-				delayColor = .yellow
-			default:
-				delayColor = .orange
-			}
-		}
-	}
-	
-	@Published var delayString = ""
-	@Published var delayColor = Color.clear
-	
-	init(clashProxy: ClashProxy) {
-		id = clashProxy.id
-		name = clashProxy.name
-		type = clashProxy.type
-		tfo = clashProxy.tfo
-		all = clashProxy.all ?? []
-		
-		
-		udpString = {
-			if clashProxy.udp {
-				return "UDP"
-			} else if clashProxy.xudp {
-				return "XUDP"
-			} else {
-				return ""
-			}
-		}()
-		
-		delay = 0
-		super.init()
-		defer {
-			delay = clashProxy.history.last?.meanDelay ?? clashProxy.history.last?.delay ?? 0
-		}
-		
-		
-	}
-}

ClashX Dashboard/Views/ContentTabs/Proxies/ProxyItemView.swift

@@ -8,10 +8,10 @@ import SwiftUI
 
 struct ProxyItemView: View {
 	
-	@Binding var proxy: ProxyItemData
+	@Binding var proxy: DBProxy
 	@State var selectable: Bool
 	
-	init(proxy: Binding<ProxyItemData>, selectable: Bool) {
+	init(proxy: Binding<DBProxy>, selectable: Bool) {
 		self._proxy = proxy
 		self.selectable = selectable
 		

ClashX Dashboard/Views/ContentTabs/Proxies/ProxyProviderGroupView.swift

@@ -6,199 +6,199 @@
 
 import SwiftUI
 
-struct ProxyProviderGroupView: View {
-	@Binding var columnCount: Int
-	
-	@Binding var providerInfo: ClashProvider
-	
-	@State private var proxyItems: [ProxyItemData]
-	
-	@State private var trafficInfo: String
-	@State private var expireDate: String
-	@State private var updateAt: String
-	
-	
-	@State private var isListExpanded = false
-	@State private var isTesting = false
-	@State private var isUpdating = false
-	
-	@EnvironmentObject var searchString: ProxiesSearchString
-	
-	init(columnCount: Binding<Int>,
-		 providerInfo: Binding<ClashProvider>) {
-		self._columnCount = columnCount
-		self._providerInfo = providerInfo
-		
-		let info = providerInfo.wrappedValue
-		
-		self.proxyItems = info.proxies.map(ProxyItemData.init)
-		
-		if let info = info.subscriptionInfo {
-			let used = info.download + info.upload
-			let total = info.total
-			
-			let formatter = ByteCountFormatter()
-			
-			trafficInfo = formatter.string(fromByteCount: used)
-			+ " / "
-			+ formatter.string(fromByteCount: total)
-			+ " ( \(String(format: "%.2f", Double(used)/Double(total/100)))% )"
-			
-			
-			let expire = info.expire
-			
-			expireDate = "Expire: "
-			+ Date(timeIntervalSince1970: TimeInterval(expire))
-				.formatted()
-		} else {
-			trafficInfo = ""
-			expireDate = ""
-		}
-		
-		if let updatedAt = info.updatedAt {
-			let formatter = RelativeDateTimeFormatter()
-			self.updateAt = formatter.localizedString(for: updatedAt, relativeTo: .now)
-		} else {
-			self.updateAt = ""
-		}
-	}
-	
-
-    var body: some View {
-		Section {
-			providerListView
-				.background {
-					Rectangle()
-						.frame(width: 2, height: listHeight(columnCount))
-						.foregroundColor(.clear)
-				}
-				.show(isVisible: !isListExpanded)
-			
-		} header: {
-			providerInfoView
-		} footer: {
-			HStack {
-				Button {
-					update()
-				} label: {
-					Label("Update", systemImage: "arrow.clockwise")
-				}
-				
-				.disabled(isUpdating)
-				
-				Button {
-					startBenchmark()
-				} label: {
-					Label("Benchmark", systemImage: "bolt.fill")
-				}
-				.disabled(isTesting)
-			}
-		}
-    }
-	
-	var providerInfoView: some View {
-		VStack(alignment: .leading) {
-			HStack {
-				Text(providerInfo.name)
-					.font(.title)
-					.fontWeight(.medium)
-				Text(providerInfo.vehicleType.rawValue)
-					.fontWeight(.regular)
-				Text("\(providerInfo.proxies.count)")
-				Button() {
-					isListExpanded = !isListExpanded
-				} label: {
-					Image(systemName: isListExpanded ? "chevron.up" : "chevron.down")
-				}
-				Button() {
-					update()
-				} label: {
-					Image(systemName: "arrow.clockwise")
-				}
-				.disabled(isUpdating)
-				
-				Button() {
-					startBenchmark()
-				} label: {
-					Image(systemName: "bolt.fill")
-				}
-				.disabled(isTesting)
-			}
-			
-			HStack {
-				if trafficInfo != "" {
-					Text(trafficInfo)
-						.fontWeight(.regular)
-				}
-				if expireDate != "" {
-					Text(expireDate)
-						.fontWeight(.regular)
-				}
-			}
-			if updateAt != "" {
-				Text("Updated \(updateAt)")
-					.fontWeight(.regular)
-			}
-		}
-	}
-	
-	var providerListView: some View {
-		LazyVGrid(columns: Array(repeating: GridItem(.flexible()),
-								 count: columnCount)) {
-			ForEach($proxyItems, id: \.id) { item in
-				ProxyItemView(
-					proxy: item,
-					selectable: false
-				)
-				.background(.white)
-				.cornerRadius(8)
-//				.onTapGesture {
-//					let item = item.wrappedValue
-//					updateSelect(item.name)
+//struct ProxyProviderGroupView: View {
+//	@Binding var columnCount: Int
+//	
+//	@Binding var providerInfo: ClashProvider
+//	
+//	@State private var proxyItems: [ProxyItemData]
+//	
+//	@State private var trafficInfo: String
+//	@State private var expireDate: String
+//	@State private var updateAt: String
+//	
+//	
+//	@State private var isListExpanded = false
+//	@State private var isTesting = false
+//	@State private var isUpdating = false
+//	
+//	@EnvironmentObject var searchString: ProxiesSearchString
+//	
+//	init(columnCount: Binding<Int>,
+//		 providerInfo: Binding<ClashProvider>) {
+//		self._columnCount = columnCount
+//		self._providerInfo = providerInfo
+//		
+//		let info = providerInfo.wrappedValue
+//		
+//		self.proxyItems = info.proxies.map(ProxyItemData.init)
+//		
+//		if let info = info.subscriptionInfo {
+//			let used = info.download + info.upload
+//			let total = info.total
+//			
+//			let formatter = ByteCountFormatter()
+//			
+//			trafficInfo = formatter.string(fromByteCount: used)
+//			+ " / "
+//			+ formatter.string(fromByteCount: total)
+//			+ " ( \(String(format: "%.2f", Double(used)/Double(total/100)))% )"
+//			
+//			
+//			let expire = info.expire
+//			
+//			expireDate = "Expire: "
+//			+ Date(timeIntervalSince1970: TimeInterval(expire))
+//				.formatted()
+//		} else {
+//			trafficInfo = ""
+//			expireDate = ""
+//		}
+//		
+//		if let updatedAt = info.updatedAt {
+//			let formatter = RelativeDateTimeFormatter()
+//			self.updateAt = formatter.localizedString(for: updatedAt, relativeTo: .now)
+//		} else {
+//			self.updateAt = ""
+//		}
+//	}
+//	
+//
+//    var body: some View {
+//		Section {
+//			providerListView
+//				.background {
+//					Rectangle()
+//						.frame(width: 2, height: listHeight(columnCount))
+//						.foregroundColor(.clear)
 //				}
-				.show(isVisible: {
-					if searchString.string.isEmpty {
-						return true
-					} else {
-						return item.wrappedValue.name.lowercased().contains(searchString.string.lowercased())
-					}
-				}())
-			}
-		}
-	}
-	
-	func listHeight(_ columnCount: Int) -> Double {
-		let lineCount = ceil(Double(providerInfo.proxies.count) / Double(columnCount))
-		return lineCount * 60 + (lineCount - 1) * 8
-	}
-	
-	func startBenchmark() {
-		isTesting = true
-		let name = providerInfo.name
-		ApiRequest.healthCheck(proxy: name) {
-			ApiRequest.requestProxyProviderList {
-				isTesting = false
-				
-				guard let provider = $0.allProviders[name] else { return }
-				self.proxyItems = provider.proxies.map(ProxyItemData.init)
-			}
-		}
-	}
-	
-	func update() {
-		isUpdating = true
-		let name = providerInfo.name
-		ApiRequest.updateProvider(for: .proxy, name: name) { _ in
-			ApiRequest.requestProxyProviderList {
-				isUpdating = false
-				guard let provider = $0.allProviders[name] else { return }
-				self.providerInfo = provider
-			}
-		}
-	}
-	
-	
-}
+//				.show(isVisible: !isListExpanded)
+//			
+//		} header: {
+//			providerInfoView
+//		} footer: {
+//			HStack {
+//				Button {
+//					update()
+//				} label: {
+//					Label("Update", systemImage: "arrow.clockwise")
+//				}
+//				
+//				.disabled(isUpdating)
+//				
+//				Button {
+//					startBenchmark()
+//				} label: {
+//					Label("Benchmark", systemImage: "bolt.fill")
+//				}
+//				.disabled(isTesting)
+//			}
+//		}
+//    }
+//	
+//	var providerInfoView: some View {
+//		VStack(alignment: .leading) {
+//			HStack {
+//				Text(providerInfo.name)
+//					.font(.title)
+//					.fontWeight(.medium)
+//				Text(providerInfo.vehicleType.rawValue)
+//					.fontWeight(.regular)
+//				Text("\(providerInfo.proxies.count)")
+//				Button() {
+//					isListExpanded = !isListExpanded
+//				} label: {
+//					Image(systemName: isListExpanded ? "chevron.up" : "chevron.down")
+//				}
+//				Button() {
+//					update()
+//				} label: {
+//					Image(systemName: "arrow.clockwise")
+//				}
+//				.disabled(isUpdating)
+//				
+//				Button() {
+//					startBenchmark()
+//				} label: {
+//					Image(systemName: "bolt.fill")
+//				}
+//				.disabled(isTesting)
+//			}
+//			
+//			HStack {
+//				if trafficInfo != "" {
+//					Text(trafficInfo)
+//						.fontWeight(.regular)
+//				}
+//				if expireDate != "" {
+//					Text(expireDate)
+//						.fontWeight(.regular)
+//				}
+//			}
+//			if updateAt != "" {
+//				Text("Updated \(updateAt)")
+//					.fontWeight(.regular)
+//			}
+//		}
+//	}
+//	
+//	var providerListView: some View {
+//		LazyVGrid(columns: Array(repeating: GridItem(.flexible()),
+//								 count: columnCount)) {
+//			ForEach($proxyItems, id: \.id) { item in
+//				ProxyItemView(
+//					proxy: item,
+//					selectable: false
+//				)
+//				.background(.white)
+//				.cornerRadius(8)
+////				.onTapGesture {
+////					let item = item.wrappedValue
+////					updateSelect(item.name)
+////				}
+//				.show(isVisible: {
+//					if searchString.string.isEmpty {
+//						return true
+//					} else {
+//						return item.wrappedValue.name.lowercased().contains(searchString.string.lowercased())
+//					}
+//				}())
+//			}
+//		}
+//	}
+//	
+//	func listHeight(_ columnCount: Int) -> Double {
+//		let lineCount = ceil(Double(providerInfo.proxies.count) / Double(columnCount))
+//		return lineCount * 60 + (lineCount - 1) * 8
+//	}
+//	
+//	func startBenchmark() {
+//		isTesting = true
+//		let name = providerInfo.name
+//		ApiRequest.healthCheck(proxy: name) {
+//			ApiRequest.requestProxyProviderList {
+//				isTesting = false
+//				
+//				guard let provider = $0.allProviders[name] else { return }
+//				self.proxyItems = provider.proxies.map(ProxyItemData.init)
+//			}
+//		}
+//	}
+//	
+//	func update() {
+//		isUpdating = true
+//		let name = providerInfo.name
+//		ApiRequest.updateProvider(for: .proxy, name: name) { _ in
+//			ApiRequest.requestProxyProviderList {
+//				isUpdating = false
+//				guard let provider = $0.allProviders[name] else { return }
+//				self.providerInfo = provider
+//			}
+//		}
+//	}
+//	
+//	
+//}
 
 //struct ProviderGroupView_Previews: PreviewProvider {
 //    static var previews: some View {