[feat] Login with Quick Connect

[DanielC7205]

This PR adds support for logging into AmpFin with the Quick Connect feature. There is still an option to use credentials (username/password), but Quick Connect is offered as an alternative.

This PR will remain a draft until the following are completed:

• [x] Approval from the developer (ex. design-wise, using different elements, etc.)
• [x] Test on different Jellyfin server versions (Note: AmpFin appears to be broken with version 10.6.x or lower, showing a error about the instance not being found, unrelated to this change)
• [x] Test on real hardware
• [x] Code cleanup

If there is something else I should be doing, let me know! I have also enabled Allow edits by maintainers on this PR, so the developer can edit the code directly on my fork if they want to.

Videos

Quick Connect Supported

https://github.com/user-attachments/assets/39ac06f6-0666-483e-b104-0bb2641ab32e

[rasmuslos]

This looks pretty good, Thanks in advance! But I honestly wouldn't bother to support quick connect on servers that are not running >= 10.9.x

[rasmuslos]

Also providing a help text might be neat but unnecessary. The spinner makes it quite clear that AmpFin will automatically detect authorization. I would change the label to something like "Awaiting authorization" and just add a "Learn more" button in a new section below.

[rasmuslos]

I don't think this needs to be inside a list layout, here is a quick mockup I made which I prefer:

struct QuickConnectMock: View {
    var body: some View {
        ScrollView {
            VStack {
                Text("123456")
                    .font(.largeTitle)
                    .fontDesign(.monospaced)
                    .padding(.bottom, 20)
                
                ProgressView()
                
                Text("Waiting for authorization")
                    .font(.caption)
                    .foregroundStyle(.secondary)
                    .padding(.top, 4)
            }
            .padding(.vertical, 40)
            .frame(maxWidth: .infinity)
        }
        .background(.background.secondary)
        .navigationTitle("Quick Connect")
        .navigationBarTitleDisplayMode(.inline)
        .safeAreaInset(edge: .bottom) {
            Button {
                
            } label: {
                Text("Learn more")
            }
        }
    }
}

What do you think?

[DanielC7205]

@rasmuslos what do you think of this UI/UX?

Unsupported	Supported	Quick Connect View

[rasmuslos]

Looks pretty good, but I would make the bottom text a Section footer and shorten it to something like "Requires Jellyfin 10.9+". Also the copy button seems a bit redundant, tapping the text should copy the code instead, which should be displayed in a monospaced font.

[DanielC7205]

@rasmuslos my apologies for my late response, college has been a bit more busy (and been a bit sick) the past few days, so I haven't had much time to put towards this PR. Here are some screenshots of the updated UIs, please let me know if you would like anything changed.

LoginView	LoginQuickConnectView

[rasmuslos]

Hey, take your time, I will be very busy next week, so my respond times will get even worse, sorry 😅

The only thing I can think of is applying .buttonStyle(.plain) to the code, so that it does not change its color. I have never done this, but because you enabled edit by maintainers I would like to make some adjustments to the spacing (By default SwiftUI applies some values but AmpFin is designed around a 4 unit grid system, otherwise the UI looks inconsistent) and actually create the LoginViewModel. But like a said, this may sadly take some time.

Otherwise this looks great, Thanks for your work!

[DanielC7205]

The only thing I can think of is applying .buttonStyle(.plain) to the code, so that it does not change its color.

This may be a dumb question, but wouldn't the text being colored be better UX? In my mind it helps call out that the text is interactive (and can be copied to clipboard) upon tapping it.

I would like to make some adjustments to the spacing [...] But like a said, this may sadly take some time.

👍🏽 take your time, there is no rush to finish this PR.

Otherwise this looks great, Thanks for your work!

Thanks! 😄 I kinda wish I was a bit better at Swift so I could (understand and) help you do all the changes you want, but sadly I'm not that good at it so some of the changes are up to you. 😅

[rasmuslos]

Hey,

i apologize for keeping you waiting for so long. I will merge this into the main branch now and then make some additional changes. This will be especially useful when AmpFin comes to tvOS someday.

Thanks a lot for your work! Also your code is not bad, there are just some really strange pitfalls in SwiftUI. This is just some time I picked up while doing this. If you want to get better I recommend you just do stuff, that is how I learned 😀