Improve video banner and playback queue view

Model/PlaylistsModel.swift

@@ -26,7 +26,7 @@ final class PlaylistsModel: ObservableObject {
     }
 
     func load(force: Bool = false, onSuccess: @escaping () -> Void = {}) {
-        let request = force ? resource.load() : resource.loadIfNeeded()
+        let request = force ? resource?.load() : resource?.loadIfNeeded()
 
         request?
             .onSuccess { resource in
@@ -66,8 +66,8 @@ final class PlaylistsModel: ObservableObject {
         selectedPlaylistID = id ?? ""
     }
 
-    private var resource: Resource {
+    private var resource: Resource? {
-        accounts.api.playlists!
+        accounts.api.playlists
     }
 
     private var selectedPlaylist: Playlist? {

Pearvidious.xcodeproj/project.pbxproj

@@ -292,7 +292,6 @@
 		37CC3F47270CE30600608308 /* PlayerQueueItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F44270CE30600608308 /* PlayerQueueItem.swift */; };
 		37CC3F4C270CFE1700608308 /* PlayerQueueView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4B270CFE1700608308 /* PlayerQueueView.swift */; };
 		37CC3F4D270CFE1700608308 /* PlayerQueueView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4B270CFE1700608308 /* PlayerQueueView.swift */; };
-		37CC3F4E270CFE1700608308 /* PlayerQueueView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4B270CFE1700608308 /* PlayerQueueView.swift */; };
 		37CC3F50270D010D00608308 /* VideoBanner.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4F270D010D00608308 /* VideoBanner.swift */; };
 		37CC3F51270D010D00608308 /* VideoBanner.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4F270D010D00608308 /* VideoBanner.swift */; };
 		37CC3F52270D010D00608308 /* VideoBanner.swift in Sources */ = {isa = PBXBuildFile; fileRef = 37CC3F4F270D010D00608308 /* VideoBanner.swift */; };
@@ -1714,7 +1713,6 @@
 				37AAF2A226741C97007FC770 /* SubscriptionsView.swift in Sources */,
 				37484C1B26FC837400287258 /* PlaybackSettingsView.swift in Sources */,
 				372915E82687E3B900F5A35B /* Defaults.swift in Sources */,
-				37CC3F4E270CFE1700608308 /* PlayerQueueView.swift in Sources */,
 				37BAB54C269B39FD00E75ED1 /* TVNavigationView.swift in Sources */,
 				3797758D2689345500DD52A8 /* Store.swift in Sources */,
 				37484C2F26FC844700287258 /* AccountsSettingsView.swift in Sources */,

Shared/Player/PlayerQueueView.swift

@@ -8,14 +8,21 @@ struct PlayerQueueView: View {
 
     var body: some View {
         List {
-            playingNext
+            Group {
-            playedPreviously
+                playingNext
+                playedPreviously
+            }
+            .padding(.vertical, 5)
+            .listRowInsets(EdgeInsets())
+            #if os(iOS)
+                .padding(.horizontal, 10)
+            #endif
         }
 
         #if os(macOS)
             .listStyle(.inset)
         #elseif os(iOS)
-            .listStyle(.insetGrouped)
+            .listStyle(.grouped)
         #else
             .listStyle(.plain)
         #endif
@@ -44,23 +51,22 @@ struct PlayerQueueView: View {
     }
 
     var playedPreviously: some View {
-        Section(header: Text("Played Previously")) {
+        Group {
-            if player.history.isEmpty {
+            if !player.history.isEmpty {
-                Text("History is empty")
+                Section(header: Text("Played Previously")) {
-                    .foregroundColor(.secondary)
+                    ForEach(player.history) { item in
-            }
+                        PlayerQueueRow(item: item, history: true, fullScreen: $fullScreen)
-
+                            .contextMenu {
-            ForEach(player.history) { item in
+                                removeButton(item, history: true)
-                PlayerQueueRow(item: item, history: true, fullScreen: $fullScreen)
+                                removeAllButton(history: true)
-                    .contextMenu {
+                            }
-                        removeButton(item, history: true)
+                        #if os(iOS)
-                        removeAllButton(history: true)
+                            .swipeActions(edge: .trailing, allowsFullSwipe: true) {
+                                removeButton(item, history: true)
+                            }
+                        #endif
                     }
-                #if os(iOS)
+                }
-                    .swipeActions(edge: .trailing, allowsFullSwipe: true) {
-                        removeButton(item, history: true)
-                    }
-                #endif
             }
         }
     }

Shared/Player/PlayerViewController.swift

@@ -6,7 +6,6 @@ final class PlayerViewController: UIViewController {
     var playerLoaded = false
     var playerModel: PlayerModel!
     var playerViewController = AVPlayerViewController()
-    var shouldResume = false
 
     override func viewWillAppear(_ animated: Bool) {
         super.viewWillAppear(animated)
@@ -73,15 +72,9 @@ extension PlayerViewController: AVPlayerViewControllerDelegate {
         false
     }
 
-    func playerViewControllerWillBeginDismissalTransition(_: AVPlayerViewController) {
+    func playerViewControllerWillBeginDismissalTransition(_: AVPlayerViewController) {}
-        shouldResume = playerModel.isPlaying
-    }
 
     func playerViewControllerDidEndDismissalTransition(_: AVPlayerViewController) {
-        if shouldResume {
-            playerModel.play()
-        }
-
         dismiss(animated: false)
     }
 

Shared/Player/VideoDetails.swift

@@ -87,6 +87,10 @@ struct VideoDetails: View {
             }
         }
         .onAppear {
+            if video.isNil {
+                currentPage = .queue
+            }
+
             guard video != nil, accounts.app.supportsSubscriptions else {
                 subscribed = false
                 return
@@ -94,6 +98,15 @@ struct VideoDetails: View {
 
             subscribed = subscriptions.isSubscribing(video!.channel.id)
         }
+        .onChange(of: sidebarQueue) { queue in
+            #if !os(macOS)
+                if queue {
+                    currentPage = .details
+                } else {
+                    currentPage = .queue
+                }
+            #endif
+        }
         .edgesIgnoringSafeArea(.horizontal)
         .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
     }
@@ -112,11 +125,6 @@ struct VideoDetails: View {
             } else {
                 Text("Not playing")
                     .foregroundColor(.secondary)
-                    .onAppear {
-                        #if !os(macOS)
-                            currentPage = .queue
-                        #endif
-                    }
             }
 
             Spacer()

Shared/Playlists/PlaylistsView.swift

@@ -3,15 +3,16 @@ import Siesta
 import SwiftUI
 
 struct PlaylistsView: View {
-    @EnvironmentObject<PlayerModel> private var player
-    @EnvironmentObject<PlaylistsModel> private var model
-
     @State private var showingNewPlaylist = false
     @State private var createdPlaylist: Playlist?
 
     @State private var showingEditPlaylist = false
     @State private var editedPlaylist: Playlist?
 
+    @EnvironmentObject<AccountsModel> private var accounts
+    @EnvironmentObject<PlayerModel> private var player
+    @EnvironmentObject<PlaylistsModel> private var model
+
     @Namespace private var focusNamespace
 
     var items: [ContentItem] {
@@ -101,6 +102,9 @@ struct PlaylistsView: View {
         .onAppear {
             model.load()
         }
+        .onChange(of: accounts.current) { _ in
+            model.load(force: true)
+        }
     }
 
     #if os(tvOS)

Shared/Videos/VideoBanner.swift

@@ -15,15 +15,13 @@ struct VideoBanner: View {
     }
 
     var body: some View {
-        HStack(alignment: .top, spacing: 12) {
+        HStack(alignment: stackAlignment, spacing: 12) {
             VStack(spacing: thumbnailStackSpacing) {
                 smallThumbnail
 
-                if !playbackTime.isNil {
+                #if !os(tvOS)
-                    ProgressView(value: progressViewValue, total: progressViewTotal)
+                    progressView
-                        .progressViewStyle(.linear)
+                #endif
-                        .frame(maxWidth: thumbnailWidth)
-                }
             }
             VStack(alignment: .leading, spacing: 4) {
                 Text(video.title)
@@ -38,6 +36,10 @@ struct VideoBanner: View {
 
                     Spacer()
 
+                    #if os(tvOS)
+                        progressView
+                    #endif
+
                     if let time = (videoDuration ?? video.length).formattedAsPlaybackTime() {
                         Text(time)
                             .fontWeight(.light)
@@ -52,11 +54,19 @@ struct VideoBanner: View {
         .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: 100, alignment: .center)
     }
 
+    private var stackAlignment: VerticalAlignment {
+        #if os(macOS)
+            playbackTime.isNil ? .center : .top
+        #else
+            .center
+        #endif
+    }
+
     private var thumbnailStackSpacing: Double {
         #if os(tvOS)
             8
         #else
-            3
+            2
         #endif
     }
 
@@ -68,22 +78,32 @@ struct VideoBanner: View {
             }
             .indicator(.activity)
         #if os(tvOS)
-            .frame(width: thumbnailWidth, height: 100)
+            .frame(width: thumbnailWidth, height: 140)
             .mask(RoundedRectangle(cornerRadius: 12))
         #else
-            .frame(width: thumbnailWidth, height: 50)
+            .frame(width: thumbnailWidth, height: 60)
             .mask(RoundedRectangle(cornerRadius: 6))
         #endif
     }
 
     private var thumbnailWidth: Double {
         #if os(tvOS)
-            177
+            230
         #else
-            88
+            100
         #endif
     }
 
+    private var progressView: some View {
+        Group {
+            if !playbackTime.isNil {
+                ProgressView(value: progressViewValue, total: progressViewTotal)
+                    .progressViewStyle(.linear)
+                    .frame(maxWidth: thumbnailWidth)
+            }
+        }
+    }
+
     private var progressViewValue: Double {
         [playbackTime?.seconds, videoDuration].compactMap { $0 }.min() ?? 0
     }

tvOS/NowPlayingView.swift

@@ -16,12 +16,10 @@ struct NowPlayingView: View {
     }
 
     var content: some View {
-        ScrollView(.vertical) {
+        List {
-            VStack(alignment: .leading) {
+            Group {
                 if !inInfoViewController, let item = player.currentItem {
-                    Group {
+                    Section(header: Text("Now Playing")) {
-                        header("Now Playing")
-
                         Button {
                             player.presentPlayer()
                         } label: {
@@ -29,72 +27,66 @@ struct NowPlayingView: View {
                         }
                     }
                     .onPlayPauseCommand(perform: player.togglePlay)
-                    .padding(.bottom, 20)
                 }
 
-                header("Playing Next")
+                Section(header: Text("Playing Next")) {
-
+                    if player.queue.isEmpty {
-                if player.queue.isEmpty {
+                        Text("Playback queue is empty")
-                    Spacer()
+                            .padding([.vertical, .leading], 40)
-
+                            .foregroundColor(.secondary)
-                    Text("Playback queue is empty")
-                        .padding([.vertical, .leading], 40)
-                        .foregroundColor(.secondary)
-                }
-
-                ForEach(player.queue) { item in
-                    Button {
-                        player.advanceToItem(item)
-                        player.presentPlayer()
-                    } label: {
-                        VideoBanner(video: item.video)
                     }
-                    .contextMenu {
+
-                        Button("Delete", role: .destructive) {
+                    ForEach(player.queue) { item in
-                            player.remove(item)
+                        Button {
+                            player.advanceToItem(item)
+                            player.presentPlayer()
+                        } label: {
+                            VideoBanner(video: item.video)
+                        }
+                        .contextMenu {
+                            Button("Delete", role: .destructive) {
+                                player.remove(item)
+                            }
                         }
                     }
                 }
 
-                header("Played Previously")
+                if !player.history.isEmpty {
+                    Section(header: Text("Played Previously")) {
+                        ForEach(player.history) { item in
+                            Button {
+                                player.playHistory(item)
+                                player.presentPlayer()
+                            } label: {
+                                VideoBanner(video: item.video, playbackTime: item.playbackTime, videoDuration: item.videoDuration)
+                            }
+                            .contextMenu {
+                                Button("Delete", role: .destructive) {
+                                    player.removeHistory(item)
+                                }
 
-                if player.history.isEmpty {
+                                Button("Delete History", role: .destructive) {
-                    Spacer()
+                                    player.removeHistoryItems()
-
+                                }
-                    Text("History is empty")
+                            }
-                        .padding([.vertical, .leading], 40)
-                        .foregroundColor(.secondary)
-                }
-
-                ForEach(player.history) { item in
-                    Button {
-                        player.playHistory(item)
-                        player.presentPlayer()
-                    } label: {
-                        VideoBanner(video: item.video, playbackTime: item.playbackTime, videoDuration: item.videoDuration)
-                    }
-                    .contextMenu {
-                        Button("Delete", role: .destructive) {
-                            player.removeHistory(item)
-                        }
-
-                        Button("Delete History", role: .destructive) {
-                            player.removeHistoryItems()
                         }
                     }
                 }
             }
-            .padding(.vertical)
+            .listRowInsets(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 20))
-            .padding(.horizontal, 40)
+            .padding(.vertical, 20)
+//            .padding(.horizontal, 40)
         }
-        .frame(minWidth: 0, maxWidth: .infinity, minHeight: 260, maxHeight: .infinity, alignment: .leading)
+        .padding(.horizontal, inInfoViewController ? 40 : 0)
+        .listStyle(.grouped)
+        .frame(minWidth: 0, maxWidth: .infinity, minHeight: 560, maxHeight: .infinity, alignment: .leading)
     }
 
     func header(_ text: String) -> some View {
         Text(text)
             .font((inInfoViewController ? Font.system(size: 40) : .title3).bold())
             .foregroundColor(.secondary)
-            .padding(.leading, 40)
+//            .padding(.leading, 40)
     }
 }