mirror of
https://github.com/yattee/yattee.git
synced 2025-08-06 10:44:06 +00:00
Unify forms, add to/remove from playlist on all platforms, UI improvements
This commit is contained in:
Arkadiusz Fal
@@ -20,12 +20,18 @@ struct AccountFormView: View {
|
||||
|
||||
var body: some View {
|
||||
VStack {
|
||||
header
|
||||
form
|
||||
footer
|
||||
Group {
|
||||
header
|
||||
form
|
||||
footer
|
||||
}
|
||||
.frame(maxWidth: 1000)
|
||||
}
|
||||
#if os(iOS)
|
||||
.padding(.vertical)
|
||||
#elseif os(tvOS)
|
||||
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
|
||||
.background(.thickMaterial)
|
||||
#else
|
||||
.frame(width: 400, height: 145)
|
||||
#endif
|
||||
@@ -48,18 +54,30 @@ struct AccountFormView: View {
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
var form: some View {
|
||||
Form {
|
||||
private var form: some View {
|
||||
Group {
|
||||
#if !os(tvOS)
|
||||
Form {
|
||||
formFields
|
||||
#if os(macOS)
|
||||
.padding(.horizontal)
|
||||
#endif
|
||||
}
|
||||
#else
|
||||
formFields
|
||||
#endif
|
||||
}
|
||||
.onAppear(perform: initializeForm)
|
||||
.onChange(of: sid) { _ in validate() }
|
||||
}
|
||||
|
||||
var formFields: some View {
|
||||
Group {
|
||||
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 {
|
||||
@@ -75,6 +93,9 @@ struct AccountFormView: View {
|
||||
#endif
|
||||
}
|
||||
.frame(minHeight: 35)
|
||||
#if os(tvOS)
|
||||
.padding(.top, 30)
|
||||
#endif
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
|
||||
@@ -15,15 +15,16 @@ struct InstanceDetailsSettingsView: View {
|
||||
var body: some View {
|
||||
List {
|
||||
Section(header: Text("Accounts")) {
|
||||
ForEach(instances.accounts(instanceID)) { account in
|
||||
HStack(spacing: 2) {
|
||||
Text(account.description)
|
||||
if instances.defaultAccount == account {
|
||||
Text("— default")
|
||||
.foregroundColor(.secondary)
|
||||
}
|
||||
}
|
||||
ForEach(instances.accounts(instanceID), id: \.self) { account in
|
||||
|
||||
#if !os(tvOS)
|
||||
HStack(spacing: 2) {
|
||||
Text(account.description)
|
||||
if instances.defaultAccount == account {
|
||||
Text("— default")
|
||||
.foregroundColor(.secondary)
|
||||
}
|
||||
}
|
||||
.swipeActions(edge: .leading, allowsFullSwipe: true) {
|
||||
if instances.defaultAccount != account {
|
||||
Button("Make Default", action: { makeDefault(account) })
|
||||
@@ -34,6 +35,21 @@ struct InstanceDetailsSettingsView: View {
|
||||
.swipeActions(edge: .trailing, allowsFullSwipe: false) {
|
||||
Button("Remove", role: .destructive, action: { removeAccount(account) })
|
||||
}
|
||||
|
||||
#else
|
||||
Button(action: { toggleDefault(account) }) {
|
||||
HStack(spacing: 2) {
|
||||
Text(account.description)
|
||||
if instances.defaultAccount == account {
|
||||
Text("— default")
|
||||
.foregroundColor(.secondary)
|
||||
}
|
||||
}
|
||||
}
|
||||
.contextMenu {
|
||||
Button("Toggle Default", action: { toggleDefault(account) })
|
||||
Button("Remove", role: .destructive, action: { removeAccount(account) })
|
||||
}
|
||||
#endif
|
||||
}
|
||||
.redrawOn(change: accountsChanged)
|
||||
@@ -45,6 +61,8 @@ struct InstanceDetailsSettingsView: View {
|
||||
}
|
||||
#if os(iOS)
|
||||
.listStyle(.insetGrouped)
|
||||
#elseif os(tvOS)
|
||||
.frame(maxWidth: 1000)
|
||||
#endif
|
||||
|
||||
.navigationTitle(instance.shortDescription)
|
||||
@@ -58,6 +76,14 @@ struct InstanceDetailsSettingsView: View {
|
||||
accountsChanged.toggle()
|
||||
}
|
||||
|
||||
private func toggleDefault(_ account: Instance.Account) {
|
||||
if account == instances.defaultAccount {
|
||||
resetDefaultAccount()
|
||||
} else {
|
||||
makeDefault(account)
|
||||
}
|
||||
}
|
||||
|
||||
private func resetDefaultAccount() {
|
||||
instances.resetDefaultAccount()
|
||||
accountsChanged.toggle()
|
||||
|
||||
@@ -19,69 +19,104 @@ struct InstanceFormView: View {
|
||||
|
||||
var body: some View {
|
||||
VStack(alignment: .leading) {
|
||||
HStack(alignment: .center) {
|
||||
Text("Add Instance")
|
||||
.font(.title2.bold())
|
||||
Group {
|
||||
header
|
||||
|
||||
Spacer()
|
||||
form
|
||||
|
||||
Button("Cancel") {
|
||||
dismiss()
|
||||
}
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.cancelAction)
|
||||
#endif
|
||||
footer
|
||||
}
|
||||
.padding(.horizontal)
|
||||
|
||||
Form {
|
||||
TextField("Name", text: $name, prompt: Text("Instance Name (optional)"))
|
||||
.frame(maxWidth: 450)
|
||||
.focused($nameFieldFocused)
|
||||
|
||||
TextField("URL", text: $url, prompt: Text("https://invidious.home.net"))
|
||||
.frame(maxWidth: 450)
|
||||
}
|
||||
#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 ? "Connected successfully" : "Connection failed")
|
||||
if !valid {
|
||||
Text(validationError ?? "Unknown Error")
|
||||
.font(.caption2)
|
||||
.foregroundColor(.secondary)
|
||||
.truncationMode(.tail)
|
||||
.lineLimit(1)
|
||||
}
|
||||
}
|
||||
.frame(minHeight: 40)
|
||||
}
|
||||
.opacity(validated ? 1 : 0)
|
||||
Spacer()
|
||||
|
||||
Button("Save", action: submitForm)
|
||||
.disabled(!valid)
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.defaultAction)
|
||||
#endif
|
||||
}
|
||||
.padding(.horizontal)
|
||||
.frame(maxWidth: 1000)
|
||||
}
|
||||
.onChange(of: url) { _ in validate() }
|
||||
.onAppear(perform: initializeForm)
|
||||
#if os(iOS)
|
||||
.padding(.vertical)
|
||||
#elseif os(tvOS)
|
||||
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
|
||||
.background(.thickMaterial)
|
||||
#else
|
||||
.frame(width: 400, height: 150)
|
||||
#endif
|
||||
}
|
||||
|
||||
private var header: some View {
|
||||
HStack(alignment: .center) {
|
||||
Text("Add Instance")
|
||||
.font(.title2.bold())
|
||||
|
||||
Spacer()
|
||||
|
||||
Button("Cancel") {
|
||||
dismiss()
|
||||
}
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.cancelAction)
|
||||
#endif
|
||||
}
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
private var form: some View {
|
||||
#if !os(tvOS)
|
||||
Form {
|
||||
formFields
|
||||
#if os(macOS)
|
||||
.padding(.horizontal)
|
||||
#endif
|
||||
}
|
||||
#else
|
||||
formFields
|
||||
#endif
|
||||
}
|
||||
|
||||
private var formFields: some View {
|
||||
Group {
|
||||
TextField("Name", text: $name, prompt: Text("Instance Name (optional)"))
|
||||
|
||||
.focused($nameFieldFocused)
|
||||
|
||||
TextField("URL", text: $url, prompt: Text("https://invidious.home.net"))
|
||||
}
|
||||
}
|
||||
|
||||
private var footer: some View {
|
||||
HStack(alignment: .center) {
|
||||
validationStatus
|
||||
|
||||
Spacer()
|
||||
|
||||
Button("Save", action: submitForm)
|
||||
.disabled(!valid)
|
||||
#if !os(tvOS)
|
||||
.keyboardShortcut(.defaultAction)
|
||||
#endif
|
||||
}
|
||||
#if os(tvOS)
|
||||
.padding(.top, 30)
|
||||
#endif
|
||||
.padding(.horizontal)
|
||||
}
|
||||
|
||||
private 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 ? "Connected successfully" : "Connection failed")
|
||||
if !valid {
|
||||
Text(validationError ?? "Unknown Error")
|
||||
.font(.caption2)
|
||||
.foregroundColor(.secondary)
|
||||
.truncationMode(.tail)
|
||||
.lineLimit(1)
|
||||
}
|
||||
}
|
||||
.frame(minHeight: 35)
|
||||
}
|
||||
.opacity(validated ? 1 : 0)
|
||||
}
|
||||
|
||||
var validator: AccountValidator {
|
||||
AccountValidator(
|
||||
url: url,
|
||||
|
||||
@@ -34,7 +34,7 @@ struct InstancesSettingsView: View {
|
||||
var body: some View {
|
||||
Group {
|
||||
#if os(iOS)
|
||||
Section(header: instancesHeader, footer: instancesFooter) {
|
||||
Section(header: instancesHeader, footer: defaultAccountSection) {
|
||||
ForEach(instances) { instance in
|
||||
Button(action: {
|
||||
self.selectedInstanceID = instance.id
|
||||
@@ -59,11 +59,33 @@ struct InstancesSettingsView: View {
|
||||
.buttonStyle(.plain)
|
||||
}
|
||||
|
||||
Button("Add Instance...") {
|
||||
presentingInstanceForm = true
|
||||
}
|
||||
addInstanceButton
|
||||
}
|
||||
.listStyle(.insetGrouped)
|
||||
#elseif os(tvOS)
|
||||
Section(header: instancesHeader) {
|
||||
ForEach(instances) { instance in
|
||||
Button(action: {
|
||||
self.selectedInstanceID = instance.id
|
||||
self.presentingInstanceDetails = true
|
||||
}) {
|
||||
Text(instance.description)
|
||||
}
|
||||
.contextMenu {
|
||||
Button("Remove", role: .destructive) {
|
||||
instancesModel.remove(instance)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
addInstanceButton
|
||||
|
||||
defaultAccountSection
|
||||
}
|
||||
.frame(maxWidth: 1000, alignment: .leading)
|
||||
.sheet(isPresented: $presentingAccountForm) {
|
||||
AccountFormView(instance: selectedInstance, selectedAccount: $selectedAccount)
|
||||
}
|
||||
#else
|
||||
Section {
|
||||
Text("Instance")
|
||||
@@ -157,22 +179,33 @@ struct InstancesSettingsView: View {
|
||||
Text("Instances").background(instanceDetailsNavigationLink)
|
||||
}
|
||||
|
||||
var instancesFooter: some View {
|
||||
var defaultAccountSection: some View {
|
||||
Group {
|
||||
if let account = instancesModel.defaultAccount {
|
||||
HStack(spacing: 2) {
|
||||
Text("**\(account.description)** account on instance **\(account.instance.shortDescription)** is your default.")
|
||||
.truncationMode(.middle)
|
||||
.lineLimit(1)
|
||||
VStack {
|
||||
HStack(spacing: 2) {
|
||||
Text("**\(account.description)** account on instance **\(account.instance.shortDescription)** is your default.")
|
||||
.truncationMode(.middle)
|
||||
.lineLimit(1)
|
||||
|
||||
Button("Reset", action: resetDefaultAccount)
|
||||
.buttonStyle(.plain)
|
||||
.foregroundColor(.red)
|
||||
#if !os(tvOS)
|
||||
|
||||
Button("Reset", action: resetDefaultAccount)
|
||||
.buttonStyle(.plain)
|
||||
.foregroundColor(.red)
|
||||
#endif
|
||||
}
|
||||
}
|
||||
} else {
|
||||
Text("You have no default account set")
|
||||
}
|
||||
}
|
||||
#if os(tvOS)
|
||||
.foregroundColor(.gray)
|
||||
#elseif os(macOS)
|
||||
.font(.caption2)
|
||||
.foregroundColor(.secondary)
|
||||
#endif
|
||||
}
|
||||
|
||||
var instanceDetailsNavigationLink: some View {
|
||||
@@ -181,25 +214,13 @@ struct InstancesSettingsView: View {
|
||||
destination: { InstanceDetailsSettingsView(instanceID: selectedInstanceID) },
|
||||
label: { EmptyView() }
|
||||
)
|
||||
.opacity(0)
|
||||
}
|
||||
|
||||
private var defaultAccountSection: some View {
|
||||
Group {
|
||||
if let account = instancesModel.defaultAccount {
|
||||
HStack(spacing: 2) {
|
||||
Text("**\(account.description)** account on instance **\(account.instance.shortDescription)** is your default.")
|
||||
.truncationMode(.middle)
|
||||
.lineLimit(1)
|
||||
Button("Reset", action: resetDefaultAccount)
|
||||
.buttonStyle(.plain)
|
||||
.foregroundColor(.red)
|
||||
}
|
||||
} else {
|
||||
Text("You have no default account set")
|
||||
}
|
||||
private var addInstanceButton: some View {
|
||||
Button("Add Instance...") {
|
||||
presentingInstanceForm = true
|
||||
}
|
||||
.font(.caption2)
|
||||
.foregroundColor(.secondary)
|
||||
}
|
||||
|
||||
private func resetDefaultAccount() {
|
||||
|
||||
@@ -15,6 +15,8 @@ struct PlaybackSettingsView: View {
|
||||
|
||||
#if os(iOS)
|
||||
.pickerStyle(.automatic)
|
||||
#elseif os(tvOS)
|
||||
.pickerStyle(.inline)
|
||||
#endif
|
||||
|
||||
#if os(macOS)
|
||||
|
||||
@@ -33,24 +33,31 @@ struct SettingsView: View {
|
||||
#else
|
||||
NavigationView {
|
||||
List {
|
||||
#if os(tvOS)
|
||||
AccountSelectionView()
|
||||
#endif
|
||||
InstancesSettingsView()
|
||||
PlaybackSettingsView()
|
||||
}
|
||||
.navigationTitle("Settings")
|
||||
.toolbar {
|
||||
ToolbarItem(placement: .navigationBarTrailing) {
|
||||
Button("Done") {
|
||||
dismiss()
|
||||
}
|
||||
#if !os(tvOS)
|
||||
Button("Done") {
|
||||
dismiss()
|
||||
}
|
||||
.keyboardShortcut(.cancelAction)
|
||||
#endif
|
||||
}
|
||||
}
|
||||
.frame(maxWidth: 1000)
|
||||
#if os(iOS)
|
||||
.listStyle(.insetGrouped)
|
||||
#endif
|
||||
}
|
||||
#if os(tvOS)
|
||||
.background(.thickMaterial)
|
||||
#endif
|
||||
#endif
|
||||
}
|
||||
}
|
||||
@@ -58,6 +65,11 @@ struct SettingsView: View {
|
||||
struct SettingsView_Previews: PreviewProvider {
|
||||
static var previews: some View {
|
||||
SettingsView()
|
||||
.environmentObject(InstancesModel())
|
||||
.environmentObject(InvidiousAPI())
|
||||
.environmentObject(NavigationModel())
|
||||
.environmentObject(SearchModel())
|
||||
.environmentObject(SubscriptionsModel())
|
||||
#if os(macOS)
|
||||
.frame(width: 600, height: 300)
|
||||
#endif
|
||||
|
||||
Reference in New Issue
Block a user