Listing styles

Model/Accounts/Account.swift

@@ -74,6 +74,10 @@ struct Account: Defaults.Serializable, Hashable, Identifiable {
     }
 
     var description: String {
+        guard !isPublic else {
+            return name
+        }
+
         guard !name.isEmpty else {
             return shortUsername
         }

Model/Applications/PeerTubeAPI.swift

@@ -250,7 +250,7 @@ final class PeerTubeAPI: Service, ObservableObject, VideosAPI {
         resource(baseURL: account.url, path: "\(Self.basePath)/popular")
     }
 
-    func trending(country: Country, category: TrendingCategory?) -> Resource {
+    func trending(country _: Country, category _: TrendingCategory?) -> Resource {
         resource(baseURL: account.url, path: "\(Self.basePath)/videos")
             .withParam("isLocal", "true")
 //            .withParam("type", category?.name)
@@ -391,7 +391,7 @@ final class PeerTubeAPI: Service, ObservableObject, VideosAPI {
         resource(baseURL: account.url, path: basePathAppending("playlists/\(id)"))
     }
 
-    func search(_ query: SearchQuery, page: String?) -> Resource {
+    func search(_ query: SearchQuery, page _: String?) -> Resource {
         var resource = resource(baseURL: account.url, path: basePathAppending("search/videos"))
             .withParam("search", query.query)
 //            .withParam("sort_by", query.sortBy.parameter)

Shared/Defaults.swift

@@ -203,6 +203,13 @@ extension Defaults.Keys {
     static let mpvEnableLogging = Key<Bool>("mpvEnableLogging", default: false)
 
     static let subscriptionsViewPage = Key<SubscriptionsView.Page>("subscriptionsViewPage", default: .feed)
+
+    static let subscriptionsListingStyle = Key<ListingStyle>("subscriptionsListingStyle", default: .cells)
+    static let popularListingStyle = Key<ListingStyle>("popularListingStyle", default: .cells)
+    static let trendingListingStyle = Key<ListingStyle>("trendingListingStyle", default: .cells)
+    static let playlistListingStyle = Key<ListingStyle>("playlistListingStyle", default: .cells)
+    static let channelPlaylistListingStyle = Key<ListingStyle>("channelPlaylistListingStyle", default: .cells)
+    static let searchListingStyle = Key<ListingStyle>("searchListingStyle", default: .cells)
 }
 
 enum ResolutionSetting: String, CaseIterable, Defaults.Serializable {

Shared/EnvironmentValues.swift

@@ -1,3 +1,4 @@
+import Defaults
 import Foundation
 import SwiftUI
 
@@ -21,6 +22,24 @@ private struct NavigationStyleKey: EnvironmentKey {
     static let defaultValue = NavigationStyle.tab
 }
 
+private struct ListingStyleKey: EnvironmentKey {
+    static let defaultValue = ListingStyle.cells
+}
+
+enum ListingStyle: String, CaseIterable, Defaults.Serializable {
+    case cells
+    case list
+
+    var systemImage: String {
+        switch self {
+        case .cells:
+            return "rectangle.grid.2x2"
+        case .list:
+            return "list.dash"
+        }
+    }
+}
+
 private struct CurrentPlaylistID: EnvironmentKey {
     static let defaultValue: String? = nil
 }
@@ -70,4 +89,9 @@ extension EnvironmentValues {
         get { self[ScrollViewBottomPaddingKey.self] }
         set { self[ScrollViewBottomPaddingKey.self] = newValue }
     }
+
+    var listingStyle: ListingStyle {
+        get { self[ListingStyleKey.self] }
+        set { self[ListingStyleKey.self] = newValue }
+    }
 }

Shared/Navigation/AccountViewButton.swift

@@ -1,7 +1,7 @@
 import Defaults
 import SwiftUI
 
-struct AccountsMenuView: View {
+struct AccountViewButton: View {
     @ObservedObject private var model = AccountsModel.shared
     private var navigation = NavigationModel.shared
 
@@ -17,8 +17,14 @@ struct AccountsMenuView: View {
             } label: {
                 HStack {
                     if !accountPickerDisplaysUsername || !(model.current?.isPublic ?? true) {
+                        if let name = model.current?.app?.rawValue.capitalized {
+                            Image(name)
+                                .resizable()
+                                .frame(width: 30, height: 30)
+                        } else {
                             Image(systemName: "globe")
                         }
+                    }
 
                     if accountPickerDisplaysUsername {
                         label

Shared/Navigation/AppSidebarNavigation.swift

@@ -76,7 +76,7 @@ struct AppSidebarNavigation: View {
             }
 
             ToolbarItemGroup(placement: accountsMenuToolbarItemPlacement) {
-                AccountsMenuView()
+                AccountViewButton()
             }
 
             #if os(macOS)

Shared/Navigation/AppTabNavigation.swift

@@ -159,7 +159,7 @@ struct AppTabNavigation: View {
                             Label("Open Videos", systemImage: "play.circle.fill")
                         }
                     }
-                    AccountsMenuView()
+                    AccountViewButton()
                 }
             }
         #endif

Shared/Playlists/PlaylistsView.swift

@@ -21,6 +21,8 @@ struct PlaylistsView: View {
 
     @Namespace private var focusNamespace
 
+    @Default(.playlistListingStyle) private var playlistListingStyle
+
     var items: [ContentItem] {
         var videos = currentPlaylist?.videos ?? []
 
@@ -88,6 +90,7 @@ struct PlaylistsView: View {
                             #endif
                         }
                         .environment(\.currentPlaylistID, currentPlaylist?.id)
+                        .environment(\.listingStyle, playlistListingStyle)
                     }
                 }
             }
@@ -151,7 +154,13 @@ struct PlaylistsView: View {
         )
         #endif
 
-        #if !os(macOS)
+        #if os(macOS)
+        .toolbar {
+            ToolbarItem {
+                ListingStyleButtons(listingStyle: $playlistListingStyle)
+            }
+        }
+        #else
                 .onReceive(NotificationCenter.default.publisher(for: UIApplication.willEnterForegroundNotification)) { _ in
                     model.load()
                     loadResource()
@@ -210,21 +219,27 @@ struct PlaylistsView: View {
 
                 selectPlaylistButton
 
+                ListingStyleButtons(listingStyle: $playlistListingStyle)
+
                 Section {
                     SettingsButtons()
                 }
             } label: {
                 HStack(spacing: 12) {
+                    HStack(spacing: 6) {
+                        Image(systemName: "list.and.film")
+
                         Text(currentPlaylist?.title ?? "Playlists")
                             .font(.headline)
+                    }
                     .foregroundColor(.primary)
 
                     Image(systemName: "chevron.down.circle.fill")
                         .foregroundColor(.accentColor)
-                        .imageScale(.small)
                 }
+                .imageScale(.small)
                 .lineLimit(1)
-                .frame(maxWidth: 300)
+                .frame(maxWidth: 320)
                 .transaction { t in t.animation = nil }
             }
             .disabled(!accounts.signedIn)
@@ -247,7 +262,7 @@ struct PlaylistsView: View {
                 if let playlist = currentPlaylist {
                     editPlaylistButton
 
-                    FavoriteButton(item: FavoriteItem(section: .playlist(playlist.id)))
+                    FavoriteButton(item: FavoriteItem(section: .playlist(accounts.current.id, playlist.id)))
                         .labelStyle(.iconOnly)
 
                     playButton

Shared/Search/SearchView.swift

@@ -29,6 +29,7 @@ struct SearchView: View {
     @Default(.recentlyOpened) private var recentlyOpened
     @Default(.saveRecents) private var saveRecents
     @Default(.showHome) private var showHome
+    @Default(.searchListingStyle) private var searchListingStyle
 
     private var videos = [Video]()
 
@@ -68,9 +69,11 @@ struct SearchView: View {
                 }
             #endif
         }
+        .environment(\.listingStyle, searchListingStyle)
         .toolbar {
             #if os(macOS)
                 ToolbarItemGroup(placement: toolbarPlacement) {
+                    ListingStyleButtons(listingStyle: $searchListingStyle)
                     FavoriteButton(item: favoriteItem)
                         .id(favoriteItem?.id)
 
@@ -212,6 +215,8 @@ struct SearchView: View {
                     }
                 }
 
+                ListingStyleButtons(listingStyle: $searchListingStyle)
+
                 Section {
                     SettingsButtons()
                 }

Shared/Subscriptions/FeedView.swift

@@ -6,6 +6,10 @@ struct FeedView: View {
     @ObservedObject private var feed = FeedModel.shared
     @ObservedObject private var accounts = AccountsModel.shared
 
+    #if os(tvOS)
+        @Default(.subscriptionsListingStyle) private var subscriptionsListingStyle
+    #endif
+
     var videos: [ContentItem] {
         ContentItem.array(of: feed.videos)
     }
@@ -15,6 +19,7 @@ struct FeedView: View {
             HStack {
                 #if os(tvOS)
                     SubscriptionsPageButton()
+                    ListingStyleButtons(listingStyle: $subscriptionsListingStyle)
                 #endif
 
                 Spacer()

Shared/Subscriptions/SubscriptionsView.swift

@@ -8,6 +8,7 @@ struct SubscriptionsView: View {
     }
 
     @Default(.subscriptionsViewPage) private var subscriptionsViewPage
+    @Default(.subscriptionsListingStyle) private var subscriptionsListingStyle
 
     var body: some View {
         SignInRequiredView(title: "Subscriptions".localized()) {
@@ -21,6 +22,7 @@ struct SubscriptionsView: View {
                 #endif
             }
         }
+        .environment(\.listingStyle, subscriptionsListingStyle)
 
         #if os(iOS)
             .navigationBarTitleDisplayMode(.inline)
@@ -30,6 +32,13 @@ struct SubscriptionsView: View {
                 }
             }
         #endif
+        #if os(macOS)
+        .toolbar {
+            ToolbarItem {
+                ListingStyleButtons(listingStyle: $subscriptionsListingStyle)
+            }
+        }
+        #endif
     }
 
     #if os(iOS)
@@ -40,6 +49,10 @@ struct SubscriptionsView: View {
                     Label("Channels", systemImage: "person.3.fill").tag(Page.channels)
                 }
 
+                if subscriptionsViewPage == .feed {
+                    ListingStyleButtons(listingStyle: $subscriptionsListingStyle)
+                }
+
                 Section {
                     SettingsButtons()
                 }
@@ -59,6 +72,7 @@ struct SubscriptionsView: View {
         var menuLabel: some View {
             HStack {
                 Image(systemName: subscriptionsViewPage == .channels ? "person.3.fill" : "film")
+                    .imageScale(.small)
                 Text(subscriptionsViewPage.rawValue.capitalized.localized())
                     .font(.headline)
             }

Shared/Trending/TrendingView.swift

@@ -9,6 +9,8 @@ struct TrendingView: View {
     @Default(.trendingCategory) private var category
     @Default(.trendingCountry) private var country
 
+    @Default(.trendingListingStyle) private var trendingListingStyle
+
     @State private var presentingCountrySelection = false
 
     @State private var favoriteItem: FavoriteItem?
@@ -46,6 +48,7 @@ struct TrendingView: View {
                         .environment(\.scrollViewBottomPadding, 70)
                 #endif
             }
+            .environment(\.listingStyle, trendingListingStyle)
         }
 
         .toolbar {
@@ -119,7 +122,13 @@ struct TrendingView: View {
             }
         }
         #endif
-        #if !os(macOS)
+        #if os(macOS)
+        .toolbar {
+            ToolbarItem {
+                ListingStyleButtons(listingStyle: $trendingListingStyle)
+            }
+        }
+        #else
                 .onReceive(NotificationCenter.default.publisher(for: UIApplication.willEnterForegroundNotification)) { _ in
                     resource.loadIfNeeded()
                 }
@@ -163,6 +172,8 @@ struct TrendingView: View {
                     categoryButton
                 }
 
+                ListingStyleButtons(listingStyle: $trendingListingStyle)
+
                 Section {
                     SettingsButtons()
                 }

Shared/Videos/VerticalCells.swift

@@ -8,6 +8,7 @@ struct VerticalCells<Header: View>: View {
 
     @Environment(\.scrollViewBottomPadding) private var scrollViewBottomPadding
     @Environment(\.loadMoreContentHandler) private var loadMoreContentHandler
+    @Environment(\.listingStyle) private var listingStyle
 
     var items = [ContentItem]()
     var allowEmpty = false
@@ -70,7 +71,11 @@ struct VerticalCells<Header: View>: View {
     }
 
     var adaptiveItem: [GridItem] {
-        [GridItem(.adaptive(minimum: adaptiveGridItemMinimumSize, maximum: adaptiveGridItemMaximumSize))]
+        if listingStyle == .list {
+            return [.init(.flexible())]
+        }
+
+        return [GridItem(.adaptive(minimum: adaptiveGridItemMinimumSize, maximum: adaptiveGridItemMaximumSize))]
     }
 
     var adaptiveGridItemMinimumSize: Double {

Shared/Views/ChannelPlaylistView.swift

@@ -1,3 +1,4 @@
+import Defaults
 import Siesta
 import SwiftUI
 
@@ -12,6 +13,7 @@ struct ChannelPlaylistView: View {
 
     @Environment(\.colorScheme) private var colorScheme
     @Environment(\.navigationStyle) private var navigationStyle
+    @Default(.channelPlaylistListingStyle) private var channelPlaylistListingStyle
 
     @ObservedObject private var accounts = AccountsModel.shared
     var player = PlayerModel.shared
@@ -58,6 +60,7 @@ struct ChannelPlaylistView: View {
             VerticalCells(items: items)
                 .environment(\.inChannelPlaylistView, true)
         }
+        .environment(\.listingStyle, channelPlaylistListingStyle)
         .onAppear {
             if navigationStyle == .tab {
                 DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
@@ -69,7 +72,15 @@ struct ChannelPlaylistView: View {
         }
         #if os(tvOS)
         .background(Color.background(scheme: colorScheme))
-        #else
+        #endif
+        #if os(iOS)
+        .toolbar {
+            ToolbarItem(placement: .principal) {
+                playlistMenu
+            }
+        }
+        #endif
+        #if os(macOS)
         .toolbar {
             ToolbarItem(placement: .cancellationAction) {
                 if showCloseButton {
@@ -84,20 +95,58 @@ struct ChannelPlaylistView: View {
 
             ToolbarItem(placement: playlistButtonsPlacement) {
                 HStack {
+                    ListingStyleButtons(listingStyle: $channelPlaylistListingStyle)
                     ShareButton(contentItem: contentItem)
 
-                    if let playlist = presentedPlaylist {
+                    favoriteButton
-                        FavoriteButton(item: FavoriteItem(section: .channelPlaylist(accounts.app.appType.rawValue, playlist.id, playlist.title)))
-                    }
 
                     playButton
                 }
             }
         }
-        .navigationTitle(presentedPlaylist?.title ?? "")
+        .navigationTitle(label)
         #endif
     }
 
+    @ViewBuilder private var favoriteButton: some View {
+        if let playlist = presentedPlaylist {
+            FavoriteButton(item: FavoriteItem(section: .channelPlaylist(accounts.app.appType.rawValue, playlist.id, playlist.title)))
+        }
+    }
+
+    #if os(iOS)
+        private var playlistMenu: some View {
+            Menu {
+                favoriteButton
+
+                ListingStyleButtons(listingStyle: $channelPlaylistListingStyle)
+
+                Section {
+                    SettingsButtons()
+                }
+            } label: {
+                HStack(spacing: 12) {
+                    ThumbnailView(url: store.item?.thumbnailURL ?? playlist?.thumbnailURL)
+                        .frame(width: 60, height: 30)
+                        .clipShape(RoundedRectangle(cornerRadius: 2))
+                    Text(label)
+                        .font(.headline)
+                        .foregroundColor(.primary)
+
+                    Image(systemName: "chevron.down.circle.fill")
+                        .foregroundColor(.accentColor)
+                        .imageScale(.small)
+                }
+                .frame(maxWidth: 320)
+                .transaction { t in t.animation = nil }
+            }
+        }
+    #endif
+
+    private var label: String {
+        presentedPlaylist?.title ?? ""
+    }
+
     private var playlistButtonsPlacement: ToolbarItemPlacement {
         #if os(iOS)
             .navigationBarTrailing
@@ -132,7 +181,8 @@ struct ChannelPlaylistView: View {
 
 struct ChannelPlaylistView_Previews: PreviewProvider {
     static var previews: some View {
+        NavigationView {
             ChannelPlaylistView(playlist: ChannelPlaylist.fixture)
-            .injectFixtureEnvironmentObjects()
+        }
     }
 }

Shared/Views/ChannelVideosView.swift

@@ -1,3 +1,4 @@
+import Defaults
 import SDWebImageSwiftUI
 import Siesta
 import SwiftUI
@@ -27,6 +28,8 @@ struct ChannelVideosView: View {
     @ObservedObject private var subscriptions = SubscribedChannelsModel.shared
     @Namespace private var focusNamespace
 
+    @Default(.channelPlaylistListingStyle) private var channelPlaylistListingStyle
+
     var presentedChannel: Channel? {
         store.item ?? channel ?? recents.presentedChannel
     }
@@ -56,11 +59,6 @@ struct ChannelVideosView: View {
                         viewsLabel
 
                         subscriptionToggleButton
-
-                        if let channel = presentedChannel {
-                            FavoriteButton(item: FavoriteItem(section: .channel(accounts.app.appType.rawValue, channel.id, channel.name)))
-                                .labelStyle(.iconOnly)
-                        }
                     }
                     contentTypePicker
                         .pickerStyle(.automatic)
@@ -72,6 +70,7 @@ struct ChannelVideosView: View {
                 banner
             }
             .environment(\.inChannelView, true)
+            .environment(\.listingStyle, channelPlaylistListingStyle)
             #if os(tvOS)
                 .prefersDefaultFocus(in: focusNamespace)
             #endif
@@ -100,6 +99,9 @@ struct ChannelVideosView: View {
                 ToolbarItem(placement: .navigation) {
                     thumbnail
                 }
+                ToolbarItem {
+                    ListingStyleButtons(listingStyle: $channelPlaylistListingStyle)
+                }
                 ToolbarItem {
                     contentTypePicker
                 }
@@ -217,6 +219,8 @@ struct ChannelVideosView: View {
                         subscriptionToggleButton
                         FavoriteButton(item: FavoriteItem(section: .channel(accounts.app.appType.rawValue, channel.id, channel.name)))
                     }
+
+                    ListingStyleButtons(listingStyle: $channelPlaylistListingStyle)
                 }
             } label: {
                 HStack(spacing: 12) {

Shared/Views/ContentItemView.swift

@@ -3,12 +3,20 @@ import SwiftUI
 
 struct ContentItemView: View {
     let item: ContentItem
+    @Environment(\.listingStyle) private var listingStyle
 
     var body: some View {
         Group {
             switch item.contentType {
             case .video:
+                if listingStyle == .cells {
                     VideoCell(video: item.video)
+                } else {
+                    PlayerQueueRow(item: .init(item.video))
+                        .contextMenu {
+                            VideoContextMenuView(video: item.video)
+                        }
+                }
             case .playlist:
                 ChannelPlaylistCell(playlist: item.playlist)
             case .channel:

Shared/Views/ListingStyleButtons.swift

@@ -0,0 +1,41 @@
+import SwiftUI
+
+struct ListingStyleButtons: View {
+    @Binding var listingStyle: ListingStyle
+
+    var body: some View {
+        #if os(iOS)
+            picker
+        #else
+            Button {
+                listingStyle = listingStyle.next()
+            } label: {
+                Label(listingStyle.rawValue.capitalized, systemImage: listingStyle.systemImage)
+                #if os(tvOS)
+                    .font(.caption2)
+                    .imageScale(.small)
+                #endif
+            }
+        #endif
+    }
+
+    var picker: some View {
+        Picker("Listing Style", selection: $listingStyle) {
+            ForEach(ListingStyle.allCases, id: \.self) { style in
+                Button {
+                    listingStyle = style
+                } label: {
+                    Label(style.rawValue.capitalized, systemImage: style.systemImage)
+                }
+            }
+        }
+    }
+}
+
+struct ListingStyleButtons_Previews: PreviewProvider {
+    static var previews: some View {
+        VStack {
+            ListingStyleButtons(listingStyle: .constant(.cells))
+        }
+    }
+}

Shared/Views/PopularView.swift

@@ -1,3 +1,4 @@
+import Defaults
 import Siesta
 import SwiftUI
 
@@ -6,6 +7,8 @@ struct PopularView: View {
 
     @ObservedObject private var accounts = AccountsModel.shared
 
+    @Default(.popularListingStyle) private var popularListingStyle
+
     var resource: Resource? {
         accounts.api.popular
     }
@@ -20,6 +23,7 @@ struct PopularView: View {
                 resource?.addObserver(store)
                 resource?.loadIfNeeded()
             }
+            .environment(\.listingStyle, popularListingStyle)
         #if !os(tvOS)
             .navigationTitle("Popular")
             .background(
@@ -31,6 +35,12 @@ struct PopularView: View {
             )
         #endif
         #if os(iOS)
+        .toolbar {
+            ToolbarItem(placement: .principal) {
+                popularMenu
+            }
+        }
+        .navigationBarTitleDisplayMode(.inline)
         .refreshControl { refreshControl in
             resource?.load().onCompletion { _ in
                 refreshControl.endRefreshing()
@@ -47,10 +57,53 @@ struct PopularView: View {
         }
         .navigationBarTitleDisplayMode(RefreshControl.navigationBarTitleDisplayMode)
         #endif
-        #if !os(macOS)
+        #if os(macOS)
+        .toolbar {
+            ToolbarItem {
+                ListingStyleButtons(listingStyle: $popularListingStyle)
+            }
+        }
+        #else
                 .onReceive(NotificationCenter.default.publisher(for: UIApplication.willEnterForegroundNotification)) { _ in
                     resource?.loadIfNeeded()
                 }
         #endif
     }
+
+    #if os(iOS)
+        private var popularMenu: some View {
+            Menu {
+                ListingStyleButtons(listingStyle: $popularListingStyle)
+
+                Section {
+                    SettingsButtons()
+                }
+            } label: {
+                HStack(spacing: 12) {
+                    HStack(spacing: 6) {
+                        Image(systemName: "arrow.up.right.circle.fill")
+                            .foregroundColor(.primary)
+                            .imageScale(.small)
+
+                        Text("Popular")
+                            .font(.headline)
+                            .foregroundColor(.primary)
+                    }
+
+                    Image(systemName: "chevron.down.circle.fill")
+                        .foregroundColor(.accentColor)
+                        .imageScale(.small)
+                }
+                .transaction { t in t.animation = nil }
+            }
+        }
+    #endif
+}
+
+struct PopularView_Previews: PreviewProvider {
+    static var previews: some View {
+        NavigationView {
+            PopularView()
+        }
+    }
 }

Yattee.xcodeproj/project.pbxproj

@@ -202,6 +202,9 @@
 		371CC77029468BDC00979C1A /* SettingsButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC76F29468BDC00979C1A /* SettingsButtons.swift */; };
 		371CC77129468BDC00979C1A /* SettingsButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC76F29468BDC00979C1A /* SettingsButtons.swift */; };
 		371CC77229468BDC00979C1A /* SettingsButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC76F29468BDC00979C1A /* SettingsButtons.swift */; };
+		371CC7742946963000979C1A /* ListingStyleButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC7732946963000979C1A /* ListingStyleButtons.swift */; };
+		371CC7752946963000979C1A /* ListingStyleButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC7732946963000979C1A /* ListingStyleButtons.swift */; };
+		371CC7762946963000979C1A /* ListingStyleButtons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371CC7732946963000979C1A /* ListingStyleButtons.swift */; };
 		371F2F1A269B43D300E4A7AB /* NavigationModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371F2F19269B43D300E4A7AB /* NavigationModel.swift */; };
 		371F2F1B269B43D300E4A7AB /* NavigationModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371F2F19269B43D300E4A7AB /* NavigationModel.swift */; };
 		371F2F1C269B43D300E4A7AB /* NavigationModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 371F2F19269B43D300E4A7AB /* NavigationModel.swift */; };
@@ -619,8 +622,8 @@
 		378E50FB26FE8B9F00F49626 /* Instance.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FA26FE8B9F00F49626 /* Instance.swift */; };
 		378E50FC26FE8B9F00F49626 /* Instance.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FA26FE8B9F00F49626 /* Instance.swift */; };
 		378E50FD26FE8B9F00F49626 /* Instance.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FA26FE8B9F00F49626 /* Instance.swift */; };
-		378E50FF26FE8EEE00F49626 /* AccountsMenuView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FE26FE8EEE00F49626 /* AccountsMenuView.swift */; };
+		378E50FF26FE8EEE00F49626 /* AccountViewButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FE26FE8EEE00F49626 /* AccountViewButton.swift */; };
-		378E510026FE8EEE00F49626 /* AccountsMenuView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FE26FE8EEE00F49626 /* AccountsMenuView.swift */; };
+		378E510026FE8EEE00F49626 /* AccountViewButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E50FE26FE8EEE00F49626 /* AccountViewButton.swift */; };
 		378E9C38294552A700B2D696 /* ThumbnailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E9C37294552A700B2D696 /* ThumbnailView.swift */; };
 		378E9C39294552A700B2D696 /* ThumbnailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E9C37294552A700B2D696 /* ThumbnailView.swift */; };
 		378E9C3A294552A700B2D696 /* ThumbnailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 378E9C37294552A700B2D696 /* ThumbnailView.swift */; };
@@ -1131,6 +1134,7 @@
 		371CC76729466ED000979C1A /* AccountsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountsView.swift; sourceTree = "<group>"; };
 		371CC76B29466F5A00979C1A /* AccountsViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountsViewModel.swift; sourceTree = "<group>"; };
 		371CC76F29468BDC00979C1A /* SettingsButtons.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SettingsButtons.swift; sourceTree = "<group>"; };
+		371CC7732946963000979C1A /* ListingStyleButtons.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListingStyleButtons.swift; sourceTree = "<group>"; };
 		371F2F19269B43D300E4A7AB /* NavigationModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NavigationModel.swift; sourceTree = "<group>"; };
 		3722AEBB274DA396005EA4D6 /* Badge+Backport.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Badge+Backport.swift"; sourceTree = "<group>"; };
 		3722AEBD274DA401005EA4D6 /* Backport.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Backport.swift; sourceTree = "<group>"; };
@@ -1291,7 +1295,7 @@
 		3788AC2626F6840700F6BAA9 /* FavoriteItemView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FavoriteItemView.swift; sourceTree = "<group>"; };
 		378AE942274EF00A006A4EE1 /* Color+Background.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Color+Background.swift"; sourceTree = "<group>"; };
 		378E50FA26FE8B9F00F49626 /* Instance.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Instance.swift; sourceTree = "<group>"; };
-		378E50FE26FE8EEE00F49626 /* AccountsMenuView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountsMenuView.swift; sourceTree = "<group>"; };
+		378E50FE26FE8EEE00F49626 /* AccountViewButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountViewButton.swift; sourceTree = "<group>"; };
 		378E9C37294552A700B2D696 /* ThumbnailView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ThumbnailView.swift; sourceTree = "<group>"; };
 		378E9C3B2945565500B2D696 /* SubscriptionsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SubscriptionsView.swift; sourceTree = "<group>"; };
 		378E9C3F29455A5800B2D696 /* ChannelsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ChannelsView.swift; sourceTree = "<group>"; };
@@ -1711,9 +1715,9 @@
 		371AAE2326CEB9E800901972 /* Navigation */ = {
 			isa = PBXGroup;
 			children = (
-				378E50FE26FE8EEE00F49626 /* AccountsMenuView.swift */,
 				371CC76729466ED000979C1A /* AccountsView.swift */,
 				371CC76B29466F5A00979C1A /* AccountsViewModel.swift */,
+				378E50FE26FE8EEE00F49626 /* AccountViewButton.swift */,
 				37BD07BA2698AB60003EBB87 /* AppSidebarNavigation.swift */,
 				37BA794A26DC30EC002A0235 /* AppSidebarPlaylists.swift */,
 				3763495026DFF59D00B9A393 /* AppSidebarRecents.swift */,
@@ -1793,6 +1797,7 @@
 				3748186D26A769D60084E870 /* DetailBadge.swift */,
 				37599F37272B4D740087F250 /* FavoriteButton.swift */,
 				37152EE926EFEB95004FB96D /* LazyView.swift */,
+				371CC7732946963000979C1A /* ListingStyleButtons.swift */,
 				37030FF627B0347C00ECDDAA /* MPVPlayerView.swift */,
 				37E70926271CDDAE00D34DDE /* OpenSettingsButton.swift */,
 				37635FE3291EA6CF00C11E79 /* OpenVideosButton.swift */,
@@ -2990,7 +2995,7 @@
 				37DD9DCB2785E28C00539416 /* UIView+Extensions.swift in Sources */,
 				377FF88F291A99580028EB0B /* HistoryView.swift in Sources */,
 				3782B94F27553A6700990149 /* SearchSuggestions.swift in Sources */,
-				378E50FF26FE8EEE00F49626 /* AccountsMenuView.swift in Sources */,
+				378E50FF26FE8EEE00F49626 /* AccountViewButton.swift in Sources */,
 				374DE88328BB8A280062BBF2 /* PlayerOrientation.swift in Sources */,
 				374924F029216C630017D862 /* VideoActions.swift in Sources */,
 				37169AA62729E2CC0011DE61 /* AccountsBridge.swift in Sources */,
@@ -3141,6 +3146,7 @@
 				37484C2526FC83E000287258 /* InstanceForm.swift in Sources */,
 				37DD9DBD2785D60300539416 /* ScrollViewMatcher.swift in Sources */,
 				37B767DB2677C3CA0098BAA8 /* PlayerModel.swift in Sources */,
+				371CC7742946963000979C1A /* ListingStyleButtons.swift in Sources */,
 				3788AC2726F6840700F6BAA9 /* FavoriteItemView.swift in Sources */,
 				375DFB5826F9DA010013F468 /* InstancesModel.swift in Sources */,
 				3751BA8327E6914F007B1A60 /* ReturnYouTubeDislikeAPI.swift in Sources */,
@@ -3275,6 +3281,7 @@
 				3729037F2739E47400EA99F6 /* MenuCommands.swift in Sources */,
 				3763C98A290C7A50004D3B5F /* OpenVideosView.swift in Sources */,
 				37C0698327260B2100F7F6CB /* ThumbnailsModel.swift in Sources */,
+				371CC7752946963000979C1A /* ListingStyleButtons.swift in Sources */,
 				374AB3DC28BCAF7E00DF56FB /* SeekType.swift in Sources */,
 				376B2E0826F920D600B1D64D /* SignInRequiredView.swift in Sources */,
 				37CC3F4D270CFE1700608308 /* PlayerQueueView.swift in Sources */,
@@ -3303,7 +3310,7 @@
 				37FFC441272734C3009FFD26 /* Throttle.swift in Sources */,
 				37169AA72729E2CC0011DE61 /* AccountsBridge.swift in Sources */,
 				37BA793C26DB8EE4002A0235 /* PlaylistVideosView.swift in Sources */,
-				378E510026FE8EEE00F49626 /* AccountsMenuView.swift in Sources */,
+				378E510026FE8EEE00F49626 /* AccountViewButton.swift in Sources */,
 				370F4FA927CC163A001B35DC /* PlayerBackend.swift in Sources */,
 				37141670267A8ACC006CA35D /* TrendingView.swift in Sources */,
 				379DC3D228BA4EB400B09677 /* Seek.swift in Sources */,
@@ -3724,6 +3731,7 @@
 				371B7E6C2759791900D21217 /* CommentsModel.swift in Sources */,
 				374AB3D928BCAF0000DF56FB /* SeekModel.swift in Sources */,
 				375E45F927B1AC4700BA7902 /* PlayerControlsModel.swift in Sources */,
+				371CC7762946963000979C1A /* ListingStyleButtons.swift in Sources */,
 				3782B95627557E4E00990149 /* SearchView.swift in Sources */,
 				3761ABFF26F0F8DE00AA496F /* EnvironmentValues.swift in Sources */,
 				37C3A24F272360470087A57A /* ChannelPlaylist+Fixtures.swift in Sources */,