mirror of
https://github.com/yattee/yattee.git
synced 2025-08-06 18:54:11 +00:00
Debouncing and form validation improvements
This commit is contained in:
15
Shared/Debounce.swift
Normal file
15
Shared/Debounce.swift
Normal file
@@ -0,0 +1,15 @@
|
||||
import Foundation
|
||||
|
||||
struct Debounce {
|
||||
private var timer: Timer?
|
||||
|
||||
mutating func debouncing(_ interval: TimeInterval, action: @escaping () -> Void) {
|
||||
timer = Timer.scheduledTimer(withTimeInterval: interval, repeats: false) { _ in
|
||||
action()
|
||||
}
|
||||
}
|
||||
|
||||
func invalidate() {
|
||||
timer?.invalidate()
|
||||
}
|
||||
}
|
@@ -8,12 +8,12 @@ struct AccountsMenuView: View {
|
||||
|
||||
var body: some View {
|
||||
Menu {
|
||||
ForEach(instances, id: \.self) { instance in
|
||||
ForEach(instances) { instance in
|
||||
Button(accountButtonTitle(instance: instance, account: instance.anonymousAccount)) {
|
||||
api.setAccount(instance.anonymousAccount)
|
||||
}
|
||||
|
||||
ForEach(instance.accounts, id: \.self) { account in
|
||||
ForEach(instance.accounts) { account in
|
||||
Button(accountButtonTitle(instance: instance, account: account)) {
|
||||
api.setAccount(account)
|
||||
}
|
||||
|
@@ -10,6 +10,7 @@ struct AccountFormView: View {
|
||||
|
||||
@State private var valid = false
|
||||
@State private var validated = false
|
||||
@State private var validationDebounce = Debounce()
|
||||
|
||||
@FocusState private var focused: Bool
|
||||
|
||||
@@ -19,55 +20,10 @@ struct AccountFormView: View {
|
||||
|
||||
var body: some View {
|
||||
VStack {
|
||||
HStack(alignment: .center) {
|
||||
Text("Add Account")
|
||||
.font(.title2.bold())
|
||||
|
||||
Spacer()
|
||||
|
||||
Button("Cancel") {
|
||||
dismiss()
|
||||
}
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.cancelAction)
|
||||
#endif
|
||||
}
|
||||
.padding(.horizontal)
|
||||
|
||||
Form {
|
||||
TextField("Name", text: $name, prompt: Text("Account Name (optional)"))
|
||||
.focused($focused)
|
||||
|
||||
TextField("SID", text: $sid, prompt: Text("Invidious SID Cookie"))
|
||||
}
|
||||
.onAppear(perform: initializeForm)
|
||||
.onChange(of: sid) { _ in validate() }
|
||||
|
||||
#if os(macOS)
|
||||
.padding(.horizontal)
|
||||
#endif
|
||||
|
||||
HStack {
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: valid ? "checkmark.circle.fill" : "xmark.circle.fill")
|
||||
.foregroundColor(valid ? .green : .red)
|
||||
VStack(alignment: .leading) {
|
||||
Text(valid ? "Account found" : "Invalid account details")
|
||||
}
|
||||
}
|
||||
.opacity(validated ? 1 : 0)
|
||||
Spacer()
|
||||
|
||||
Button("Save", action: submitForm)
|
||||
.disabled(!valid)
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.defaultAction)
|
||||
#endif
|
||||
}
|
||||
.frame(minHeight: 35)
|
||||
.padding(.horizontal)
|
||||
header
|
||||
form
|
||||
footer
|
||||
}
|
||||
|
||||
#if os(iOS)
|
||||
.padding(.vertical)
|
||||
#else
|
||||
@@ -75,35 +31,97 @@ struct AccountFormView: View {
|
||||
#endif
|
||||
}
|
||||
|
||||
func initializeForm() {
|
||||
var header: some View {
|
||||
HStack(alignment: .center) {
|
||||
Text("Add Account")
|
||||
.font(.title2.bold())
|
||||
|
||||
Spacer()
|
||||
|
||||
Button("Cancel") {
|
||||
dismiss()
|
||||
}
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.cancelAction)
|
||||
#endif
|
||||
}
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
var form: some View {
|
||||
Form {
|
||||
TextField("Name", text: $name, prompt: Text("Account Name (optional)"))
|
||||
.focused($focused)
|
||||
|
||||
TextField("SID", text: $sid, prompt: Text("Invidious SID Cookie"))
|
||||
}
|
||||
.onAppear(perform: initializeForm)
|
||||
.onChange(of: sid) { _ in validate() }
|
||||
#if os(macOS)
|
||||
.padding(.horizontal)
|
||||
#endif
|
||||
}
|
||||
|
||||
var footer: some View {
|
||||
HStack {
|
||||
validationStatus
|
||||
|
||||
Spacer()
|
||||
|
||||
Button("Save", action: submitForm)
|
||||
.disabled(!valid)
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.defaultAction)
|
||||
#endif
|
||||
}
|
||||
.frame(minHeight: 35)
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
var validationStatus: some View {
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: valid ? "checkmark.circle.fill" : "xmark.circle.fill")
|
||||
.foregroundColor(valid ? .green : .red)
|
||||
VStack(alignment: .leading) {
|
||||
Text(valid ? "Account found" : "Invalid account details")
|
||||
}
|
||||
}
|
||||
.opacity(validated ? 1 : 0)
|
||||
}
|
||||
|
||||
private func initializeForm() {
|
||||
focused = true
|
||||
}
|
||||
|
||||
func validate() {
|
||||
private func validate() {
|
||||
validationDebounce.invalidate()
|
||||
|
||||
guard !sid.isEmpty else {
|
||||
validator.reset()
|
||||
return
|
||||
}
|
||||
|
||||
validator.validateAccount()
|
||||
validationDebounce.debouncing(2) {
|
||||
validator.validateAccount()
|
||||
}
|
||||
}
|
||||
|
||||
func submitForm() {
|
||||
private func submitForm() {
|
||||
guard valid else {
|
||||
return
|
||||
}
|
||||
|
||||
let account = instances.addAccount(instance: instance, name: name, sid: sid)
|
||||
let account = instances.addAccount(instance: instance, name: name.serializationSafe, sid: sid)
|
||||
selectedAccount?.wrappedValue = account
|
||||
|
||||
dismiss()
|
||||
}
|
||||
|
||||
private var validator: InstanceAccountValidator {
|
||||
InstanceAccountValidator(
|
||||
private var validator: AccountValidator {
|
||||
AccountValidator(
|
||||
url: instance.url,
|
||||
account: Instance.Account(url: instance.url, sid: sid),
|
||||
formObjectID: $sid,
|
||||
id: $sid,
|
||||
valid: $valid,
|
||||
validated: $validated
|
||||
)
|
||||
|
@@ -15,7 +15,7 @@ struct InstanceDetailsSettingsView: View {
|
||||
var body: some View {
|
||||
List {
|
||||
Section(header: Text("Accounts")) {
|
||||
ForEach(instance.accounts, id: \.self) { account in
|
||||
ForEach(instance.accounts) { account in
|
||||
Text(account.description)
|
||||
#if !os(tvOS)
|
||||
.swipeActions(edge: .trailing, allowsFullSwipe: false) {
|
||||
|
@@ -9,6 +9,7 @@ struct InstanceFormView: View {
|
||||
@State private var valid = false
|
||||
@State private var validated = false
|
||||
@State private var validationError: String?
|
||||
@State private var validationDebounce = Debounce()
|
||||
|
||||
@FocusState private var nameFieldFocused: Bool
|
||||
|
||||
@@ -78,14 +79,13 @@ struct InstanceFormView: View {
|
||||
.padding(.vertical)
|
||||
#else
|
||||
.frame(width: 400, height: 150)
|
||||
|
||||
#endif
|
||||
}
|
||||
|
||||
var validator: InstanceAccountValidator {
|
||||
InstanceAccountValidator(
|
||||
var validator: AccountValidator {
|
||||
AccountValidator(
|
||||
url: url,
|
||||
formObjectID: $url,
|
||||
id: $url,
|
||||
valid: $valid,
|
||||
validated: $validated,
|
||||
error: $validationError
|
||||
@@ -93,15 +93,16 @@ struct InstanceFormView: View {
|
||||
}
|
||||
|
||||
func validate() {
|
||||
valid = false
|
||||
validated = false
|
||||
validationError = nil
|
||||
validationDebounce.invalidate()
|
||||
|
||||
guard !url.isEmpty else {
|
||||
validator.reset()
|
||||
return
|
||||
}
|
||||
|
||||
validator.validateInstance()
|
||||
validationDebounce.debouncing(2) {
|
||||
validator.validateInstance()
|
||||
}
|
||||
}
|
||||
|
||||
func initializeForm() {
|
||||
|
@@ -27,7 +27,7 @@ struct InstancesSettingsView: View {
|
||||
Group {
|
||||
#if os(iOS)
|
||||
Section(header: instancesHeader) {
|
||||
ForEach(instances, id: \.self) { instance in
|
||||
ForEach(instances) { instance in
|
||||
Button(action: {
|
||||
self.selectedInstanceID = instance.id
|
||||
self.presentingInstanceDetails = true
|
||||
@@ -62,7 +62,7 @@ struct InstancesSettingsView: View {
|
||||
|
||||
if !instances.isEmpty {
|
||||
Picker("Instance", selection: $selectedInstanceID) {
|
||||
ForEach(instances, id: \.url) { instance in
|
||||
ForEach(instances) { instance in
|
||||
Text(instance.description).tag(Optional(instance.id))
|
||||
}
|
||||
}
|
||||
@@ -81,7 +81,7 @@ struct InstancesSettingsView: View {
|
||||
} else {
|
||||
Text("Accounts")
|
||||
List(selection: $selectedAccount) {
|
||||
ForEach(instance.accounts, id: \.self) { account in
|
||||
ForEach(instance.accounts) { account in
|
||||
AccountSettingsView(instance: instance, account: account,
|
||||
selectedAccount: $selectedAccount)
|
||||
}
|
||||
|
@@ -12,21 +12,21 @@ struct SearchView: View {
|
||||
@State private var presentingClearConfirmation = false
|
||||
@State private var recentsChanged = false
|
||||
|
||||
@State private var searchDebounce = Debounce()
|
||||
@State private var recentsDebounce = Debounce()
|
||||
|
||||
@Environment(\.navigationStyle) private var navigationStyle
|
||||
|
||||
@EnvironmentObject<RecentsModel> private var recents
|
||||
@EnvironmentObject<SearchModel> private var state
|
||||
|
||||
@State private var searchDebounceTimer: Timer?
|
||||
@State private var recentSearchDebounceTimer: Timer?
|
||||
|
||||
init(_ query: SearchQuery? = nil) {
|
||||
self.query = query
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
VStack {
|
||||
if navigationStyle == .tab && state.queryText.isEmpty {
|
||||
if showRecentQueries {
|
||||
recentQueries
|
||||
} else {
|
||||
#if os(tvOS)
|
||||
@@ -40,15 +40,11 @@ struct SearchView: View {
|
||||
VideosView(videos: state.store.collection)
|
||||
#endif
|
||||
|
||||
if state.store.collection.isEmpty && !state.isLoading && !state.query.isEmpty {
|
||||
if noResults {
|
||||
Text("No results")
|
||||
|
||||
if searchFiltersActive {
|
||||
Button("Reset search filters") {
|
||||
self.searchSortOrder = .relevance
|
||||
self.searchDate = .any
|
||||
self.searchDuration = .any
|
||||
}
|
||||
Button("Reset search filters", action: resetFilters)
|
||||
}
|
||||
|
||||
Spacer()
|
||||
@@ -101,14 +97,14 @@ struct SearchView: View {
|
||||
state.loadSuggestions(newQuery)
|
||||
|
||||
#if os(tvOS)
|
||||
searchDebounceTimer?.invalidate()
|
||||
recentSearchDebounceTimer?.invalidate()
|
||||
searchDebounce.invalidate()
|
||||
recentsDebounce.invalidate()
|
||||
|
||||
searchDebounceTimer = Timer.scheduledTimer(withTimeInterval: 2, repeats: false) { _ in
|
||||
searchDebounce.debouncing(2) {
|
||||
state.changeQuery { query in query.query = newQuery }
|
||||
}
|
||||
|
||||
recentSearchDebounceTimer = Timer.scheduledTimer(withTimeInterval: 10, repeats: false) { _ in
|
||||
recentsDebounce.debouncing(10) {
|
||||
recents.addQuery(newQuery)
|
||||
}
|
||||
#endif
|
||||
@@ -147,10 +143,24 @@ struct SearchView: View {
|
||||
#endif
|
||||
}
|
||||
|
||||
var filtersActive: Bool {
|
||||
fileprivate var showRecentQueries: Bool {
|
||||
navigationStyle == .tab && state.queryText.isEmpty
|
||||
}
|
||||
|
||||
fileprivate var filtersActive: Bool {
|
||||
searchDuration != .any || searchDate != .any
|
||||
}
|
||||
|
||||
fileprivate func resetFilters() {
|
||||
searchSortOrder = .relevance
|
||||
searchDate = .any
|
||||
searchDuration = .any
|
||||
}
|
||||
|
||||
fileprivate var noResults: Bool {
|
||||
state.store.collection.isEmpty && !state.isLoading && !state.query.isEmpty
|
||||
}
|
||||
|
||||
var recentQueries: some View {
|
||||
VStack {
|
||||
List {
|
||||
@@ -282,6 +292,7 @@ struct SearchView: View {
|
||||
searchSortOrderButton
|
||||
}
|
||||
.frame(maxWidth: .infinity, alignment: .trailing)
|
||||
|
||||
HStack(spacing: 30) {
|
||||
Text("Duration")
|
||||
.foregroundColor(.secondary)
|
||||
|
Reference in New Issue
Block a user