Skip to content

Commit adaac4f

Browse files
intitniintitni
committed
Apply theme to UI components
1 parent 6447b3c commit adaac4f

7 files changed

Lines changed: 163 additions & 18 deletions

File tree

‎Core/Sources/ChatGPTChatTab/Styles.swift‎

Lines changed: 60 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,22 +37,75 @@ extension View {
3737
var messageBubbleCornerRadius: Double { 8 }
3838

3939
func codeBlockLabelStyle() -> some View {
40-
relativeLineSpacing(.em(0.225))
40+
CodeBlockLabelStyle(content: self)
41+
}
42+
43+
func codeBlockStyle(_ configuration: CodeBlockConfiguration) -> some View {
44+
CodeBlockStyle(configuration: configuration, content: self)
45+
}
46+
}
47+
48+
struct CodeBlockLabelStyle<Content: View>: View {
49+
@AppStorage(\.syncChatCodeHighlightTheme) var syncCodeHighlightTheme
50+
@AppStorage(\.codeForegroundColorLight) var codeForegroundColorLight
51+
@AppStorage(\.codeBackgroundColorLight) var codeBackgroundColorLight
52+
@AppStorage(\.codeForegroundColorDark) var codeForegroundColorDark
53+
@AppStorage(\.codeBackgroundColorDark) var codeBackgroundColorDark
54+
55+
let content: Content
56+
57+
var body: some View {
58+
content
59+
.relativeLineSpacing(.em(0.225))
4160
.markdownTextStyle {
4261
FontFamilyVariant(.monospaced)
4362
FontSize(.em(0.85))
4463
}
4564
.padding(16)
4665
.padding(.top, 14)
4766
}
67+
}
4868

49-
func codeBlockStyle(_ configuration: CodeBlockConfiguration) -> some View {
50-
background(Color(nsColor: .textBackgroundColor).opacity(0.7))
69+
struct CodeBlockStyle<Content: View>: View {
70+
@AppStorage(\.syncChatCodeHighlightTheme) var syncCodeHighlightTheme
71+
@AppStorage(\.codeForegroundColorLight) var codeForegroundColorLight
72+
@AppStorage(\.codeBackgroundColorLight) var codeBackgroundColorLight
73+
@AppStorage(\.codeForegroundColorDark) var codeForegroundColorDark
74+
@AppStorage(\.codeBackgroundColorDark) var codeBackgroundColorDark
75+
@Environment(\.colorScheme) var colorScheme
76+
77+
let configuration: CodeBlockConfiguration
78+
let content: Content
79+
80+
var body: some View {
81+
content
82+
.background({
83+
if syncCodeHighlightTheme {
84+
if colorScheme == .light, let color = codeBackgroundColorLight.value {
85+
return color.swiftUIColor
86+
} else if let color = codeBackgroundColorDark.value {
87+
return color.swiftUIColor
88+
}
89+
}
90+
91+
return Color(nsColor: .textBackgroundColor).opacity(0.7)
92+
}() as Color)
5193
.clipShape(RoundedRectangle(cornerRadius: 6))
5294
.overlay(alignment: .top) {
5395
HStack(alignment: .center) {
5496
Text(configuration.language ?? "code")
55-
.foregroundStyle(.tertiary)
97+
.foregroundStyle({
98+
if syncCodeHighlightTheme {
99+
if colorScheme == .light,
100+
let color = codeForegroundColorLight.value
101+
{
102+
return color.swiftUIColor.opacity(0.5)
103+
} else if let color = codeForegroundColorDark.value {
104+
return color.swiftUIColor.opacity(0.5)
105+
}
106+
}
107+
return Color.secondary.opacity(0.7)
108+
}() as Color)
56109
.font(.callout)
57110
.padding(.leading, 8)
58111
.lineLimit(1)
@@ -63,6 +116,9 @@ extension View {
63116
}
64117
}
65118
}
119+
.overlay {
120+
RoundedRectangle(cornerRadius: 6).stroke(Color.primary.opacity(0.05), lineWidth: 1)
121+
}
66122
.markdownMargin(top: 4, bottom: 16)
67123
}
68124
}

‎Core/Sources/HostApp/FeatureSettings/ChatSettingsView.swift‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,12 @@ struct ChatSettingsView: View {
166166
Toggle(isOn: $settings.wrapCodeInCodeBlock) {
167167
Text("Wrap code in code block")
168168
}
169+
170+
#if canImport(ProHostApp)
171+
172+
CodeHighlightThemePicker(scenario: .chat)
173+
174+
#endif
169175
}
170176
}
171177

‎Core/Sources/HostApp/FeatureSettings/PromptToCodeSettingsView.swift‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,12 @@ struct PromptToCodeSettingsView: View {
103103

104104
Text("pt")
105105
}
106+
107+
#if canImport(ProHostApp)
108+
109+
CodeHighlightThemePicker(scenario: .promptToCode)
110+
111+
#endif
106112
}
107113

108114
ScopeForm()

‎Core/Sources/HostApp/FeatureSettings/SuggestionSettingsView.swift‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,7 @@ struct SuggestionSettingsView: View {
187187
Text("Accept Suggestion with Tab")
188188
}
189189
}
190-
190+
191191
Toggle(isOn: $settings.dismissSuggestionWithEsc) {
192192
Text("Dismiss Suggestion with ESC")
193193
}
@@ -259,6 +259,12 @@ struct SuggestionSettingsView: View {
259259

260260
Text("pt")
261261
}
262+
263+
#if canImport(ProHostApp)
264+
265+
CodeHighlightThemePicker(scenario: .suggestion)
266+
267+
#endif
262268
}
263269
}
264270
}

‎Core/Sources/SuggestionWidget/SuggestionPanelContent/CodeBlockSuggestionPanel.swift‎

Lines changed: 33 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@ struct CodeBlockSuggestionPanel: View {
88
@AppStorage(\.suggestionDisplayCompactMode) var suggestionDisplayCompactMode
99
@AppStorage(\.suggestionPresentationMode) var suggestionPresentationMode
1010
@AppStorage(\.hideCommonPrecedingSpacesInSuggestion) var hideCommonPrecedingSpaces
11+
@AppStorage(\.syncSuggestionHighlightTheme) var syncHighlightTheme
12+
@AppStorage(\.codeForegroundColorLight) var codeForegroundColorLight
13+
@AppStorage(\.codeForegroundColorDark) var codeForegroundColorDark
14+
@AppStorage(\.codeBackgroundColorLight) var codeBackgroundColorLight
15+
@AppStorage(\.codeBackgroundColorDark) var codeBackgroundColorDark
1116

1217
struct ToolBar: View {
1318
@ObservedObject var suggestion: CodeSuggestionProvider
@@ -38,7 +43,7 @@ struct CodeBlockSuggestionPanel: View {
3843
}) {
3944
Text("Dismiss").foregroundStyle(.tertiary).padding(.trailing, 4)
4045
}.buttonStyle(.plain)
41-
46+
4247
Button(action: {
4348
suggestion.rejectSuggestion()
4449
}) {
@@ -100,15 +105,38 @@ struct CodeBlockSuggestionPanel: View {
100105
CodeBlock(
101106
code: suggestion.code,
102107
language: suggestion.language,
103-
startLineIndex: suggestion.startLineIndex,
108+
startLineIndex: suggestion.startLineIndex,
104109
scenario: "suggestion",
105110
colorScheme: colorScheme,
106-
fontSize: fontSize,
107-
droppingLeadingSpaces: hideCommonPrecedingSpaces
111+
fontSize: fontSize,
112+
droppingLeadingSpaces: hideCommonPrecedingSpaces,
113+
proposedForegroundColor: {
114+
if syncHighlightTheme {
115+
if colorScheme == .light,
116+
let color = codeForegroundColorLight.value?.swiftUIColor
117+
{
118+
return color
119+
} else if let color = codeForegroundColorDark.value?.swiftUIColor {
120+
return color
121+
}
122+
}
123+
return nil
124+
}()
108125
)
109126
.frame(maxWidth: .infinity)
127+
.background({ () -> Color in
128+
if syncHighlightTheme {
129+
if colorScheme == .light,
130+
let color = codeBackgroundColorLight.value?.swiftUIColor
131+
{
132+
return color
133+
} else if let color = codeBackgroundColorDark.value?.swiftUIColor {
134+
return color
135+
}
136+
}
137+
return Color.contentBackground
138+
}())
110139
}
111-
.background(Color.contentBackground)
112140

113141
if suggestionDisplayCompactMode {
114142
CompactToolBar(suggestion: suggestion)

‎Core/Sources/SuggestionWidget/SuggestionPanelContent/PromptToCodePanel.swift‎

Lines changed: 37 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -204,14 +204,45 @@ extension PromptToCodePanel {
204204
@Environment(\.colorScheme) var colorScheme
205205
@AppStorage(\.promptToCodeCodeFontSize) var fontSize
206206
@AppStorage(\.hideCommonPrecedingSpacesInPromptToCode) var hideCommonPrecedingSpaces
207-
207+
@AppStorage(\.syncPromptToCodeHighlightTheme) var syncHighlightTheme
208+
@AppStorage(\.codeForegroundColorLight) var codeForegroundColorLight
209+
@AppStorage(\.codeForegroundColorDark) var codeForegroundColorDark
210+
@AppStorage(\.codeBackgroundColorLight) var codeBackgroundColorLight
211+
@AppStorage(\.codeBackgroundColorDark) var codeBackgroundColorDark
212+
208213
struct CodeContent: Equatable {
209214
var code: String
210215
var language: String
211216
var startLineIndex: Int
212217
var firstLinePrecedingSpaceCount: Int
213218
var isResponding: Bool
214219
}
220+
221+
var codeForegroundColor: Color? {
222+
if syncHighlightTheme {
223+
if colorScheme == .light,
224+
let color = codeForegroundColorLight.value?.swiftUIColor
225+
{
226+
return color
227+
} else if let color = codeForegroundColorDark.value?.swiftUIColor {
228+
return color
229+
}
230+
}
231+
return nil
232+
}
233+
234+
var codeBackgroundColor: Color {
235+
if syncHighlightTheme {
236+
if colorScheme == .light,
237+
let color = codeBackgroundColorLight.value?.swiftUIColor
238+
{
239+
return color
240+
} else if let color = codeBackgroundColorDark.value?.swiftUIColor {
241+
return color
242+
}
243+
}
244+
return Color.clear
245+
}
215246

216247
var body: some View {
217248
CustomScrollView {
@@ -243,6 +274,7 @@ extension PromptToCodePanel {
243274
.textSelection(.enabled)
244275
.markdownTheme(.gitHub.text {
245276
BackgroundColor(Color.clear)
277+
ForegroundColor(codeForegroundColor)
246278
})
247279
.padding()
248280
.frame(maxWidth: .infinity)
@@ -266,7 +298,7 @@ extension PromptToCodePanel {
266298
? "Thinking..."
267299
: "Enter your requirement to generate code."
268300
)
269-
.foregroundColor(.secondary)
301+
.foregroundColor(codeForegroundColor?.opacity(0.7) ?? .secondary)
270302
.padding()
271303
.multilineTextAlignment(.center)
272304
.frame(maxWidth: .infinity)
@@ -281,13 +313,15 @@ extension PromptToCodePanel {
281313
firstLinePrecedingSpaceCount: viewStore.state
282314
.firstLinePrecedingSpaceCount,
283315
fontSize: fontSize,
284-
droppingLeadingSpaces: hideCommonPrecedingSpaces
316+
droppingLeadingSpaces: hideCommonPrecedingSpaces,
317+
proposedForegroundColor:codeForegroundColor
285318
)
286319
.frame(maxWidth: .infinity)
287320
.scaleEffect(x: 1, y: -1, anchor: .center)
288321
}
289322
}
290323
}
324+
.background(codeBackgroundColor)
291325
}
292326
.scaleEffect(x: 1, y: -1, anchor: .center)
293327
}

‎Tool/Sources/SharedUIComponents/CodeBlock.swift‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Preferences
12
import SwiftUI
23

34
public struct CodeBlock: View {
@@ -11,6 +12,7 @@ public struct CodeBlock: View {
1112
public let firstLinePrecedingSpaceCount: Int
1213
public let fontSize: Double
1314
public let droppingLeadingSpaces: Bool
15+
public let proposedForegroundColor: Color?
1416

1517
public init(
1618
code: String,
@@ -20,7 +22,8 @@ public struct CodeBlock: View {
2022
colorScheme: ColorScheme,
2123
firstLinePrecedingSpaceCount: Int = 0,
2224
fontSize: Double,
23-
droppingLeadingSpaces: Bool
25+
droppingLeadingSpaces: Bool,
26+
proposedForegroundColor: Color?
2427
) {
2528
self.code = code
2629
self.language = language
@@ -30,6 +33,7 @@ public struct CodeBlock: View {
3033
self.droppingLeadingSpaces = droppingLeadingSpaces
3134
self.firstLinePrecedingSpaceCount = firstLinePrecedingSpaceCount
3235
self.fontSize = fontSize
36+
self.proposedForegroundColor = proposedForegroundColor
3337
let padding = firstLinePrecedingSpaceCount > 0
3438
? String(repeating: " ", count: firstLinePrecedingSpaceCount)
3539
: ""
@@ -44,17 +48,21 @@ public struct CodeBlock: View {
4448
commonPrecedingSpaceCount = result.commonLeadingSpaceCount
4549
highlightedCode = result.code
4650
}
51+
52+
var foregroundColor: Color {
53+
proposedForegroundColor ?? (colorScheme == .dark ? .white : .black)
54+
}
4755

4856
public var body: some View {
4957
VStack(spacing: 2) {
5058
ForEach(0..<highlightedCode.endIndex, id: \.self) { index in
5159
HStack(alignment: .firstTextBaseline, spacing: 4) {
5260
Text("\(index + startLineIndex + 1)")
5361
.multilineTextAlignment(.trailing)
54-
.foregroundColor(.secondary)
62+
.foregroundColor(foregroundColor.opacity(0.5))
5563
.frame(minWidth: 40)
5664
Text(AttributedString(highlightedCode[index]))
57-
.foregroundColor(.white.opacity(0.1))
65+
.foregroundColor(foregroundColor.opacity(0.3))
5866
.frame(maxWidth: .infinity, alignment: .leading)
5967
.multilineTextAlignment(.leading)
6068
.lineSpacing(4)
@@ -63,7 +71,7 @@ public struct CodeBlock: View {
6371
Text("\(commonPrecedingSpaceCount + 1)")
6472
.padding(.top, -12)
6573
.font(.footnote)
66-
.foregroundStyle(colorScheme == .dark ? .white : .black)
74+
.foregroundStyle(foregroundColor)
6775
.opacity(0.3)
6876
}
6977
}
@@ -110,7 +118,8 @@ struct CodeBlock_Previews: PreviewProvider {
110118
colorScheme: .dark,
111119
firstLinePrecedingSpaceCount: 0,
112120
fontSize: 12,
113-
droppingLeadingSpaces: true
121+
droppingLeadingSpaces: true,
122+
proposedForegroundColor: nil
114123
)
115124
}
116125
}

0 commit comments

Comments
 (0)