fix picker but making it a cusotm one

fix symbol preview not updating
undo change to simplify symbolpreview
add hashable to host

ShhShell/Host/Host.swift

@@ -8,7 +8,7 @@
 import Foundation
 import SwiftUI
 
-protocol HostPr: Codable, Identifiable, Equatable {
+protocol HostPr: Codable, Identifiable, Equatable, Hashable {
 	var id: UUID { get set }
 	var name: String { get set }
 	var symbol: Symbol { get set }

ShhShell/Host/SymbolPreview.swift

@@ -8,28 +8,29 @@
 import SwiftUI
 
 struct SymbolPreview: View {
-	@State var host: Host
+	@State var symbol: Symbol
+	@State var label: String
 	
     var body: some View {
 		ZStack(alignment: .center) {
-			if host.symbol.isCustom {
-				Image(host.symbol.sf)
+			if symbol.isCustom {
+				Image(symbol.sf)
 					.resizable().scaledToFit()
 					.symbolRenderingMode(.monochrome)
 					.padding(5)
 			} else {
-				Image(systemName: host.symbol.sf)
+				Image(systemName: symbol.sf)
 					.resizable().scaledToFit()
 					.symbolRenderingMode(.monochrome)
 					.padding(5)
 			}
-			Text(host.label)
+			Text(label)
 				.font(.headline)
-				.offset(host.symbol.offset)
+				.offset(symbol.offset)
 		}
     }
 }
 
 #Preview {
-	SymbolPreview(host: Host.debug)
+	SymbolPreview(symbol: Symbol.desktopcomputer, label: "lo0")
 }

ShhShell/Views/Hosts/ConnectionView.swift

@@ -25,26 +25,28 @@ struct ConnectionView: View {
 		NavigationStack {
 			List {
 				Section {
-					HStack {
-						Picker("", selection: $handler.host.symbol) {
+					ScrollView(.horizontal) {
+						HStack {
 							ForEach(Symbol.allCases, id: \.self) { symbol in
-								Group {
-									if symbol.isCustom {
-										Image(symbol.sf)
-											.resizable().scaledToFit()
-									} else {
-										Image(systemName: symbol.sf)
-											.resizable().scaledToFit()
+								ZStack {
+									if handler.host.symbol == symbol {
+										RoundedRectangle(cornerRadius: 10)
+											.fill(.gray.opacity(0.5))
 									}
+									SymbolPreview(symbol: symbol, label: handler.host.label)
+										.padding(5)
+								}
+								.frame(width: 60, height: 60)
+								.onTapGesture {
+									withAnimation { handler.host.symbol = symbol }
 								}
-								.padding(5)
-								.tag(symbol)
 							}
 						}
-						.controlSize(.large)
-						.pickerStyle(SegmentedPickerStyle())
-						
-						SymbolPreview(host: handler.host)
+					}
+					
+					HStack {
+						SymbolPreview(symbol: handler.host.symbol, label: handler.host.label)
+							.id(handler.host)
 							.frame(width: 60, height: 60)
 						
 						TextField("label", text: $handler.host.label)
@@ -60,7 +62,7 @@ struct ConnectionView: View {
 							.modifier(foregroundColorStyle(checkAuth(handler.state) ? .green : .red))
 						Text("\(handler.state)")
 					}
-
+					
 					TextField("name", text: $handler.host.name)
 						.textFieldStyle(.roundedBorder)
 					

ShhShell/Views/Hosts/HostsView.swift

@@ -44,7 +44,7 @@ struct HostsView: View {
 							keyManager: keyManager
 						)
 					} label: {
-						SymbolPreview(host: host)
+						SymbolPreview(symbol: host.symbol, label: host.label)
 							.frame(width: 40, height: 40)
 						Text(hostsManager.makeLabel(forHost: host))
 					}