update setting UI

ski-u · Oct 30, 2024 · f4b3d87 · f4b3d87
1 parent c18ccbc
commit f4b3d87
Showing 1 changed file with 56 additions and 35 deletions.
diff --git a/Features/Sources/Settings/Settings/SettingsView.swift b/Features/Sources/Settings/Settings/SettingsView.swift
@@ -12,44 +12,65 @@ public struct SettingsView: View {
     public var body: some View {
         NavigationStack(path: $store.scope(state: \.path, action: \.path)) {
             List {
-                NavigationLink(
-                    state: Settings.Path.State.apiKeySetting(
-                        APIKeySetting.State()
-                    )
-                ) {
-                    HStack {
-                        RoundedRectangle(cornerRadius: 8)
-                            .frame(width: 30, height: 30)
-                            .foregroundColor(.yellow)
-                            .overlay {
-                                Image(systemName: "key.fill")
-                                    .foregroundColor(.white)
-                            }
-                            .padding(.trailing, 8)
-
-                        Text("API Key")
-
-                        Spacer()
-
-                        Text(APIClient.apiKey?.rawValue.masked ?? "None")
-                            .foregroundStyle(Color.secondary)
+                Section {
+                    NavigationLink(
+                        state: Settings.Path.State.apiKeySetting(
+                            APIKeySetting.State()
+                        )
+                    ) {
+                        HStack {
+                            RoundedRectangle(cornerRadius: 8)
+                                .frame(width: 30, height: 30)
+                                .foregroundColor(.yellow)
+                                .overlay {
+                                    Image(systemName: "key.fill")
+                                        .foregroundColor(.white)
+                                }
+                                .padding(.trailing, 8)
+
+                            Text("API Key")
+
+                            Spacer()
+
+                            Text(APIClient.apiKey?.rawValue.masked ?? "None")
+                                .foregroundStyle(Color.secondary)
+                        }
                     }
                 }
 
-                NavigationLink {
-                    LanguageView()
-                } label: {
-                    HStack {
-                        RoundedRectangle(cornerRadius: 8)
-                            .frame(width: 30, height: 30)
-                            .foregroundColor(.green)
-                            .overlay {
-                                Image(systemName: "globe")
-                                    .foregroundColor(.white)
-                            }
-                            .padding(.trailing, 8)
-
-                        Text("Language")
+                Section {
+                    NavigationLink {
+                        LanguageView()
+                    } label: {
+                        HStack {
+                            RoundedRectangle(cornerRadius: 8)
+                                .frame(width: 30, height: 30)
+                                .foregroundColor(.green)
+                                .overlay {
+                                    Image(systemName: "globe")
+                                        .foregroundColor(.white)
+                                }
+                                .padding(.trailing, 8)
+
+                            Text("Language")
+                        }
+                    }
+
+                    NavigationLink {
+                        Text("Appearance")
+                    } label: {
+                        HStack {
+                            RoundedRectangle(cornerRadius: 8)
+                                .frame(width: 30, height: 30)
+                                .foregroundColor(.cyan)
+                                .overlay {
+                                    Image(systemName: "circle.lefthalf.filled")
+                                        .foregroundColor(.white)
+                                }
+                                .padding(.trailing, 8)
+
+                            Text("Appearance")
+                        }
                     }
                 }
             }