Skip to content

Commit 0891863

Browse files
austincondiffaustincondiff
authored
Status Bar and Debugger Drawer UI Improvements (#1199)
Various UI improvements mostly around the status bar and debug area.
1 parent f8bc2b5 commit 0891863

15 files changed

+176
-84
lines changed

‎CodeEdit.xcodeproj/project.pbxproj‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -201,7 +201,7 @@
201201
587D9B772933BF5700BF7490 /* Live.swift in Sources */ = {isa = PBXBuildFile; fileRef = 587D9B712933BF5700BF7490 /* Live.swift */; };
202202
587D9B782933BF5700BF7490 /* Interface.swift in Sources */ = {isa = PBXBuildFile; fileRef = 587D9B722933BF5700BF7490 /* Interface.swift */; };
203203
58822524292C280D00E83CDE /* StatusBarView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 58822509292C280D00E83CDE /* StatusBarView.swift */; };
204-
58822525292C280D00E83CDE /* StatusBarMenuLabel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5882250B292C280D00E83CDE /* StatusBarMenuLabel.swift */; };
204+
58822525292C280D00E83CDE /* StatusBarMenuStyle.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5882250B292C280D00E83CDE /* StatusBarMenuStyle.swift */; };
205205
58822526292C280D00E83CDE /* StatusBarBreakpointButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5882250C292C280D00E83CDE /* StatusBarBreakpointButton.swift */; };
206206
58822527292C280D00E83CDE /* StatusBarIndentSelector.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5882250D292C280D00E83CDE /* StatusBarIndentSelector.swift */; };
207207
58822528292C280D00E83CDE /* StatusBarEncodingSelector.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5882250E292C280D00E83CDE /* StatusBarEncodingSelector.swift */; };
@@ -340,6 +340,7 @@
340340
B66A4E5129C917D5004573B4 /* AboutWindow.swift in Sources */ = {isa = PBXBuildFile; fileRef = B66A4E5029C917D5004573B4 /* AboutWindow.swift */; };
341341
B66A4E5329C91831004573B4 /* CodeEditCommands.swift in Sources */ = {isa = PBXBuildFile; fileRef = B66A4E5229C91831004573B4 /* CodeEditCommands.swift */; };
342342
B66A4E5629C918A0004573B4 /* SceneID.swift in Sources */ = {isa = PBXBuildFile; fileRef = B66A4E5529C918A0004573B4 /* SceneID.swift */; };
343+
B685DE7929CC9CCD002860C8 /* StatusBarIcon.swift in Sources */ = {isa = PBXBuildFile; fileRef = B685DE7829CC9CCD002860C8 /* StatusBarIcon.swift */; };
343344
B6C6A42A297716A500A3D28F /* TabBarItemCloseButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = B6C6A429297716A500A3D28F /* TabBarItemCloseButton.swift */; };
344345
B6C6A42E29771A8D00A3D28F /* TabBarItemButtonStyle.swift in Sources */ = {isa = PBXBuildFile; fileRef = B6C6A42D29771A8D00A3D28F /* TabBarItemButtonStyle.swift */; };
345346
B6C6A43029771F7100A3D28F /* TabBarItemBackground.swift in Sources */ = {isa = PBXBuildFile; fileRef = B6C6A42F29771F7100A3D28F /* TabBarItemBackground.swift */; };
@@ -606,7 +607,7 @@
606607
587D9B712933BF5700BF7490 /* Live.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = Live.swift; sourceTree = "<group>"; };
607608
587D9B722933BF5700BF7490 /* Interface.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = Interface.swift; sourceTree = "<group>"; };
608609
58822509292C280D00E83CDE /* StatusBarView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarView.swift; sourceTree = "<group>"; };
609-
5882250B292C280D00E83CDE /* StatusBarMenuLabel.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarMenuLabel.swift; sourceTree = "<group>"; };
610+
5882250B292C280D00E83CDE /* StatusBarMenuStyle.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarMenuStyle.swift; sourceTree = "<group>"; };
610611
5882250C292C280D00E83CDE /* StatusBarBreakpointButton.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarBreakpointButton.swift; sourceTree = "<group>"; };
611612
5882250D292C280D00E83CDE /* StatusBarIndentSelector.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarIndentSelector.swift; sourceTree = "<group>"; };
612613
5882250E292C280D00E83CDE /* StatusBarEncodingSelector.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StatusBarEncodingSelector.swift; sourceTree = "<group>"; };
@@ -742,6 +743,7 @@
742743
B66A4E5029C917D5004573B4 /* AboutWindow.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = AboutWindow.swift; sourceTree = "<group>"; };
743744
B66A4E5229C91831004573B4 /* CodeEditCommands.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = CodeEditCommands.swift; sourceTree = "<group>"; };
744745
B66A4E5529C918A0004573B4 /* SceneID.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SceneID.swift; sourceTree = "<group>"; };
746+
B685DE7829CC9CCD002860C8 /* StatusBarIcon.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StatusBarIcon.swift; sourceTree = "<group>"; };
745747
B6C6A429297716A500A3D28F /* TabBarItemCloseButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabBarItemCloseButton.swift; sourceTree = "<group>"; };
746748
B6C6A42D29771A8D00A3D28F /* TabBarItemButtonStyle.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = TabBarItemButtonStyle.swift; sourceTree = "<group>"; };
747749
B6C6A42F29771F7100A3D28F /* TabBarItemBackground.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabBarItemBackground.swift; sourceTree = "<group>"; };
@@ -1711,14 +1713,15 @@
17111713
58822512292C280D00E83CDE /* StatusBarDrawer */,
17121714
5882250A292C280D00E83CDE /* StatusBarItems */,
17131715
58822509292C280D00E83CDE /* StatusBarView.swift */,
1716+
B685DE7829CC9CCD002860C8 /* StatusBarIcon.swift */,
17141717
);
17151718
path = Views;
17161719
sourceTree = "<group>";
17171720
};
17181721
5882250A292C280D00E83CDE /* StatusBarItems */ = {
17191722
isa = PBXGroup;
17201723
children = (
1721-
5882250B292C280D00E83CDE /* StatusBarMenuLabel.swift */,
1724+
5882250B292C280D00E83CDE /* StatusBarMenuStyle.swift */,
17221725
5882250C292C280D00E83CDE /* StatusBarBreakpointButton.swift */,
17231726
5882250D292C280D00E83CDE /* StatusBarIndentSelector.swift */,
17241727
5882250E292C280D00E83CDE /* StatusBarEncodingSelector.swift */,
@@ -2794,6 +2797,7 @@
27942797
286471AB27ED51FD0039369D /* ProjectNavigatorView.swift in Sources */,
27952798
6CAAF68A29BC9C2300A1F48A /* (null) in Sources */,
27962799
6CFF967629BEBCD900182D6F /* FileCommands.swift in Sources */,
2800+
B685DE7929CC9CCD002860C8 /* StatusBarIcon.swift in Sources */,
27972801
587B9DA629300ABD00AC7927 /* ToolbarBranchPicker.swift in Sources */,
27982802
58F2EB05292FB2B0004A9BDE /* AppPreferencesModel.swift in Sources */,
27992803
6CBD1BC62978DE53006639D5 /* Font+Caption3.swift in Sources */,
@@ -2870,7 +2874,7 @@
28702874
6C147C4029A328BC0089B630 /* SplitViewData.swift in Sources */,
28712875
587B9E9029301D8F00AC7927 /* BitBucketTokenRouter.swift in Sources */,
28722876
B6C6A42E29771A8D00A3D28F /* TabBarItemButtonStyle.swift in Sources */,
2873-
58822525292C280D00E83CDE /* StatusBarMenuLabel.swift in Sources */,
2877+
58822525292C280D00E83CDE /* StatusBarMenuStyle.swift in Sources */,
28742878
58F2EB11292FB2B0004A9BDE /* PreferencesToolbar.swift in Sources */,
28752879
6C147C4229A328C10089B630 /* TabGroupData.swift in Sources */,
28762880
6C2C155829B4F49100EA60A5 /* SplitViewItem.swift in Sources */,

‎CodeEdit/Features/StatusBar/ViewModels/StatusBarViewModel.swift‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ class StatusBarViewModel: ObservableObject {
5656
var searchText: String = ""
5757

5858
/// Returns the font for status bar items to use
59-
private(set) var toolbarFont: Font = .system(size: 11)
59+
private(set) var toolbarFont: Font = .system(size: 11, weight: .medium)
6060

6161
/// The maximum height of the drawer
6262
/// when isMaximized is true the height gets set to maxHeight

‎CodeEdit/Features/StatusBar/Views/StatusBarDrawer/BottomBar/FilterTextField.swift‎

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,25 +13,35 @@ struct FilterTextField: View {
1313
@Binding
1414
var text: String
1515

16+
@FocusState
17+
private var isFocused: Bool
18+
1619
var body: some View {
17-
HStack {
20+
HStack(spacing: 5) {
1821
Image(systemName: "line.3.horizontal.decrease.circle")
19-
.foregroundColor(Color(nsColor: .secondaryLabelColor))
22+
.foregroundColor(Color(nsColor: .labelColor))
23+
.font(.system(size: 13, weight: .regular))
24+
.padding(.leading, -1)
25+
.padding(.trailing, -2)
2026
textField
2127
if !text.isEmpty { clearButton }
2228
}
2329
.padding(.horizontal, 5)
24-
.padding(.vertical, 3)
30+
.frame(height: 22)
31+
.background(Color(nsColor: isFocused ? .textBackgroundColor : .quaternaryLabelColor))
32+
.cornerRadius(7)
2533
.overlay(
26-
RoundedRectangle(cornerRadius: 4)
27-
.stroke(Color.gray, lineWidth: 0.5).cornerRadius(4)
34+
RoundedRectangle(cornerRadius: 7)
35+
.stroke(isFocused ? .secondary : .tertiary, lineWidth: 0.75).cornerRadius(7)
2836
)
2937
}
3038

3139
private var textField: some View {
3240
TextField(title, text: $text)
41+
.font(.system(size: 11, weight: .regular))
3342
.disableAutocorrection(true)
3443
.textFieldStyle(PlainTextFieldStyle())
44+
.focused($isFocused)
3545
}
3646

3747
private var clearButton: some View {

‎CodeEdit/Features/StatusBar/Views/StatusBarDrawer/BottomBar/StatusBarMaximizeButton.swift‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ struct StatusBarMaximizeButton: View {
1616
model.isMaximized.toggle()
1717
} label: {
1818
Image(systemName: "arrowtriangle.up.square")
19-
.foregroundColor(model.isMaximized ? .accentColor : .primary)
19+
.foregroundColor(model.isMaximized ? .accentColor : .secondary)
2020
}
2121
.buttonStyle(.plain)
2222
}

‎CodeEdit/Features/StatusBar/Views/StatusBarDrawer/StatusBarDrawer.swift‎

Lines changed: 39 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,26 +14,57 @@ struct StatusBarDrawer: View {
1414
@Environment(\.colorScheme)
1515
private var colorScheme
1616

17+
@EnvironmentObject
18+
private var model: StatusBarViewModel
19+
20+
@StateObject
21+
private var prefs: AppPreferencesModel = .shared
22+
23+
@StateObject
24+
private var themeModel: ThemeModel = .shared
25+
1726
@State
1827
private var searchText = ""
1928

29+
/// Returns the `background` color of the selected theme
30+
private var backgroundColor: NSColor {
31+
if let selectedTheme = themeModel.selectedTheme,
32+
let index = themeModel.themes.firstIndex(of: selectedTheme) {
33+
return NSColor(themeModel.themes[index].terminal.background.swiftColor)
34+
}
35+
return .windowBackgroundColor
36+
}
37+
2038
var body: some View {
2139
if let url = workspace.workspaceClient?.folderURL() {
2240
VStack(spacing: 0) {
2341
TerminalEmulatorView(url: url)
24-
HStack(alignment: .center, spacing: 10) {
42+
.padding(.top, 10)
43+
.padding(.horizontal, 10)
44+
.contentShape(Rectangle())
45+
HStack(alignment: .center, spacing: 6.5) {
2546
FilterTextField(title: "Filter", text: $searchText)
26-
.frame(maxWidth: 300)
47+
.frame(maxWidth: 175)
48+
.padding(.leading, -2)
2749
Spacer()
28-
StatusBarClearButton()
50+
StatusBarIcon(icon: Image(systemName: "trash")) {
51+
// clear logs
52+
}
2953
Divider()
30-
StatusBarSplitTerminalButton()
31-
StatusBarMaximizeButton()
54+
HStack(alignment: .center, spacing: 3.5) {
55+
StatusBarIcon(icon: Image(systemName: "square.split.2x1")) {
56+
// split terminal
57+
}
58+
StatusBarIcon(icon: Image(systemName: "arrowtriangle.up.square"), active: model.isMaximized) {
59+
model.isMaximized.toggle()
60+
}
61+
}
3262
}
33-
.padding(10)
34-
.frame(maxHeight: 29)
35-
.background(.bar)
63+
.padding(.horizontal, 7)
64+
.padding(.vertical, 8)
65+
.frame(maxHeight: 28)
3666
}
67+
.background(Color(nsColor: backgroundColor))
3768
}
3869
}
3970
}

‎CodeEdit/Features/StatusBar/Views/StatusBarIcon.swift‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
//
2+
// StatusBarIcon.swift
3+
// CodeEdit
4+
//
5+
// Created by Austin Condiff on 3/23/23.
6+
//
7+
8+
import SwiftUI
9+
10+
/// Accessory icon view for status bar.
11+
struct StatusBarIcon: View {
12+
/// Unifies icon font for status bar accessories.
13+
static let iconFont = Font.system(size: 14.5, weight: .regular, design: .default)
14+
15+
private let icon: Image
16+
private let active: Bool
17+
private let action: () -> Void
18+
19+
init(icon: Image, active: Bool? = false, action: @escaping () -> Void) {
20+
self.icon = icon
21+
self.action = action
22+
self.active = active ?? false
23+
}
24+
25+
var body: some View {
26+
Button(
27+
action: action,
28+
label: {
29+
icon
30+
.font(StatusBarIcon.iconFont)
31+
.foregroundColor(active ? .accentColor : .secondary)
32+
.contentShape(Rectangle())
33+
}
34+
)
35+
.buttonStyle(.plain)
36+
}
37+
}
38+
39+
struct StatusBarIcon_Previews: PreviewProvider {
40+
static var previews: some View {
41+
StatusBarIcon(icon: Image(systemName: "square.bottomthird.inset.filled")) {
42+
print("Clicked")
43+
}
44+
}
45+
}

‎CodeEdit/Features/StatusBar/Views/StatusBarItems/StatusBarCursorLocationLabel.swift‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,6 @@ struct StatusBarCursorLocationLabel: View {
2424
}
2525

2626
private var foregroundColor: Color {
27-
controlActive == .inactive ? Color(nsColor: .disabledControlTextColor) : .primary
27+
controlActive == .inactive ? Color(nsColor: .disabledControlTextColor) : Color(nsColor: .secondaryLabelColor)
2828
}
2929
}

‎CodeEdit/Features/StatusBar/Views/StatusBarItems/StatusBarEncodingSelector.swift‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,9 @@ struct StatusBarEncodingSelector: View {
1313
Menu {
1414
// UTF 8, ASCII, ...
1515
} label: {
16-
StatusBarMenuLabel("UTF 8")
16+
Text("UTF 8")
1717
}
18-
.menuIndicator(.hidden)
19-
.menuStyle(.borderlessButton)
20-
.fixedSize()
18+
.menuStyle(StatusBarMenuStyle())
2119
.onHover { isHovering($0) }
2220
}
2321
}

‎CodeEdit/Features/StatusBar/Views/StatusBarItems/StatusBarIndentSelector.swift‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,11 +31,9 @@ struct StatusBarIndentSelector: View {
3131
}
3232
}
3333
} label: {
34-
StatusBarMenuLabel("\(prefs.preferences.textEditing.defaultTabWidth) Spaces")
34+
Text("\(prefs.preferences.textEditing.defaultTabWidth) Spaces")
3535
}
36-
.menuIndicator(.hidden)
37-
.menuStyle(.borderlessButton)
38-
.fixedSize()
36+
.menuStyle(StatusBarMenuStyle())
3937
.onHover { isHovering($0) }
4038
}
4139
}

‎CodeEdit/Features/StatusBar/Views/StatusBarItems/StatusBarLineEndSelector.swift‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,9 @@ struct StatusBarLineEndSelector: View {
1313
Menu {
1414
// LF, CRLF
1515
} label: {
16-
StatusBarMenuLabel("LF")
16+
Text("LF")
1717
}
18-
.menuIndicator(.hidden)
19-
.menuStyle(.borderlessButton)
20-
.fixedSize()
18+
.menuStyle(StatusBarMenuStyle())
2119
.onHover { isHovering($0) }
2220
}
2321
}

0 commit comments

Comments
 (0)