Update UI

Author: intitni

Core/Sources/Service/GUI/RealtimeSuggestionIndicatorController.swift

@@ -48,6 +48,7 @@ final class RealtimeSuggestionIndicatorController {
         var body: some View {
             Circle()
                 .fill(Color.accentColor.opacity(opacityA))
+                .opacity(0.7)
                 .scaleEffect(.init(width: scaleA, height: scaleA))
                 .frame(width: 8, height: 8)
                 .overlay {

Core/Sources/SuggestionWidget/SuggestionPanelView.swift

@@ -36,25 +36,31 @@ struct SuggestionPanelView: View {
                     ScrollView {
                         CodeBlock(viewModel: viewModel)
                     }
+                    .background(Color(red: 31 / 255, green: 31 / 255, blue: 36 / 255))
 
                     ToolBar(viewModel: viewModel)
                 }
             }
             .frame(maxWidth: .infinity, maxHeight: Style.panelHeight)
             .fixedSize(horizontal: false, vertical: true)
-            .background(Color(red: 31 / 255, green: 31 / 255, blue: 36 / 255))
             .clipShape(RoundedRectangle(cornerRadius: 8, style: .continuous))
             .overlay(
                 RoundedRectangle(cornerRadius: 8, style: .continuous)
                     .stroke(Color.black.opacity(0.3), style: .init(lineWidth: 1))
             )
+            .overlay(
+                RoundedRectangle(cornerRadius: 7, style: .continuous)
+                    .stroke(Color.white.opacity(0.2), style: .init(lineWidth: 1))
+                    .padding(2)
+            )
 
             .onHover { yes in
                 withAnimation(.easeInOut(duration: 0.2)) {
                     isHovering = yes
                 }
             }
             .allowsHitTesting(viewModel.isPanelDisplayed && !viewModel.suggestion.isEmpty)
+            .preferredColorScheme(.dark)
 
             Spacer()
                 .frame(minHeight: 0, maxHeight: .infinity)
@@ -101,35 +107,52 @@ struct CodeBlock: View {
         }))
     }
 }
-
+        
 struct ToolBar: View {
     @ObservedObject var viewModel: SuggestionPanelViewModel
 
     var body: some View {
         HStack {
-            Text("\(viewModel.currentSuggestionIndex + 1)/\(viewModel.suggestionCount)")
+            Button(action: {
+                Task {
+                    try await Environment.triggerAction("Previous Suggestion")
+                }
+            }) {
+                Image(systemName: "chevron.left")
+            }.buttonStyle(.plain)
+            
+            Text("\(viewModel.currentSuggestionIndex + 1) / \(viewModel.suggestionCount)")
                 .monospacedDigit()
+            
+            Button(action: {
+                Task {
+                    try await Environment.triggerAction("Next Suggestion")
+                }
+            }) {
+                Image(systemName: "chevron.right")     
+            }.buttonStyle(.plain)
 
             Spacer()
 
             Button(action: {
                 Task {
-                    try await Environment.triggerAction("Accept Suggestion")
+                    try await Environment.triggerAction("Reject Suggestion")
                 }
             }) {
-                Text("Accept")
-            }.buttonStyle(CommandButtonStyle(color: .green))
+                Text("Reject")
+            }.buttonStyle(CommandButtonStyle(color: .gray))
+
             Button(action: {
                 Task {
-                    try await Environment.triggerAction("Reject Suggestion")
+                    try await Environment.triggerAction("Accept Suggestion")
                 }
             }) {
-                Text("Reject")
-            }.buttonStyle(CommandButtonStyle(color: .red))
+                Text("Accept")
+            }.buttonStyle(CommandButtonStyle(color: .indigo))
         }
         .padding()
-        .foregroundColor(.white)
-        .background(Color.white.opacity(0.1))
+        .foregroundColor(.secondary)
+        .background(.thickMaterial)
     }
 }
 
@@ -171,5 +194,12 @@ struct SuggestionPanelView_Preview: PreviewProvider {
             isPanelDisplayed: true
         ))
         .frame(width: 450, height: 400)
+        .background {
+            HStack {
+                Color.red
+                Color.green
+                Color.blue
+            }
+        }
     }
 }