Create reusable expandable toggle component for all settings sections with auto-expand on enable and consistent alignment

This commit is contained in:
Beingpax 2025-12-31 16:43:23 +05:45
parent c9d57e5b89
commit a6c47240e7
3 changed files with 55 additions and 68 deletions

View File

@ -29,6 +29,15 @@ struct ExpandableToggleSection<Content: View>: View {
} }
.toggleStyle(.switch) .toggleStyle(.switch)
.help(helpText) .help(helpText)
.onChange(of: isEnabled) { _, newValue in
if newValue {
withAnimation(.easeInOut(duration: 0.2)) {
isExpanded = true
}
} else {
isExpanded = false
}
}
if isEnabled { if isEnabled {
Spacer() Spacer()

View File

@ -67,7 +67,6 @@ struct ExperimentalFeaturesSection: View {
Spacer() Spacer()
} }
.padding(.leading, 16)
} }
} }
} }

View File

@ -25,6 +25,8 @@ struct SettingsView: View {
@State private var isCustomSoundsExpanded = false @State private var isCustomSoundsExpanded = false
@State private var isSystemMuteExpanded = false @State private var isSystemMuteExpanded = false
@State private var isClipboardRestoreExpanded = false @State private var isClipboardRestoreExpanded = false
@State private var isCustomCancelExpanded = false
@State private var isMiddleClickExpanded = false
var body: some View { var body: some View {
@ -138,26 +140,12 @@ struct SettingsView: View {
// Custom Cancel Shortcut ExpandableToggleSection(
VStack(alignment: .leading, spacing: 12) { title: "Custom Cancel Shortcut",
HStack(spacing: 8) { helpText: "Shortcut for cancelling the current recording session. Default: double-tap Escape.",
Toggle(isOn: $isCustomCancelEnabled.animation()) { isEnabled: $isCustomCancelEnabled,
Text("Custom Cancel Shortcut") isExpanded: $isCustomCancelExpanded
} ) {
.toggleStyle(.switch)
.onChange(of: isCustomCancelEnabled) { _, newValue in
if !newValue {
KeyboardShortcuts.setShortcut(nil, for: .cancelRecorder)
}
}
InfoTip(
title: "Dismiss Recording",
message: "Shortcut for cancelling the current recording session. Default: double-tap Escape."
)
}
if isCustomCancelEnabled {
HStack(spacing: 12) { HStack(spacing: 12) {
Text("Cancel Shortcut") Text("Cancel Shortcut")
.font(.system(size: 13, weight: .medium)) .font(.system(size: 13, weight: .medium))
@ -168,26 +156,21 @@ struct SettingsView: View {
Spacer() Spacer()
} }
.padding(.leading, 16) }
.transition(.opacity.combined(with: .move(edge: .top))) .onChange(of: isCustomCancelEnabled) { _, newValue in
if !newValue {
KeyboardShortcuts.setShortcut(nil, for: .cancelRecorder)
} }
} }
Divider() Divider()
// Middle-Click Toggle ExpandableToggleSection(
VStack(alignment: .leading, spacing: 12) { title: "Enable Middle-Click Toggle",
HStack(spacing: 8) { helpText: "Use middle mouse button to toggle VoiceInk recording.",
Toggle("Enable Middle-Click Toggle", isOn: $hotkeyManager.isMiddleClickToggleEnabled) isEnabled: $hotkeyManager.isMiddleClickToggleEnabled,
.toggleStyle(.switch) isExpanded: $isMiddleClickExpanded
) {
InfoTip(
title: "Middle-Click Toggle",
message: "Use middle mouse button to toggle VoiceInk recording."
)
}
if hotkeyManager.isMiddleClickToggleEnabled {
HStack(spacing: 8) { HStack(spacing: 8) {
Text("Activation Delay") Text("Activation Delay")
.font(.system(size: 13, weight: .medium)) .font(.system(size: 13, weight: .medium))
@ -210,8 +193,6 @@ struct SettingsView: View {
Spacer() Spacer()
} }
.padding(.leading, 16)
}
} }
} }
} }
@ -261,7 +242,6 @@ struct SettingsView: View {
Spacer() Spacer()
} }
.padding(.leading, 16)
} }
Divider() Divider()
@ -289,7 +269,6 @@ struct SettingsView: View {
Spacer() Spacer()
} }
.padding(.leading, 16)
} }
} }