tvOS filters for all views

Vertical list for trending, popular, playlists, search

Fix #413, #415

Shared/Trending/TrendingView.swift

@@ -39,20 +39,9 @@ struct TrendingView: View {
 
     var body: some View {
         Section {
-            VStack(spacing: 0) {
-                #if os(tvOS)
-                    toolbar
-                    HorizontalCells(items: trending)
-                        .padding(.top, 40)
-
-                    Spacer()
-                #else
-                    VerticalCells(items: trending)
-                        .environment(\.scrollViewBottomPadding, 70)
-                #endif
-            }
-            .environment(\.listingStyle, trendingListingStyle)
-            .environment(\.hideShorts, hideShorts)
+            VerticalCells(items: trending) { if shouldDisplayHeader { header } }
+                .environment(\.listingStyle, trendingListingStyle)
+                .environment(\.hideShorts, hideShorts)
         }
 
         .toolbar {
@@ -66,9 +55,7 @@ struct TrendingView: View {
                             .id(favoriteItem.id)
                     }
 
-                    if accounts.app.supportsTrendingCategories {
-                        categoryButton
-                    }
+                    categoryButton
                     countryButton
                 }
             #endif
@@ -182,9 +169,7 @@ struct TrendingView: View {
             Menu {
                 countryButton
 
-                if accounts.app.supportsTrendingCategories {
-                    categoryButton
-                }
+                categoryButton
 
                 ListingStyleButtons(listingStyle: $trendingListingStyle)
 
@@ -210,26 +195,28 @@ struct TrendingView: View {
         }
     #endif
 
-    private var categoryButton: some View {
-        #if os(tvOS)
-            Button(category.name) {
-                self.category = category.next()
-            }
-            .contextMenu {
-                ForEach(TrendingCategory.allCases) { category in
-                    Button(category.controlLabel) { self.category = category }
+    @ViewBuilder private var categoryButton: some View {
+        if accounts.app.supportsTrendingCategories {
+            #if os(tvOS)
+                Button(category.name) {
+                    self.category = category.next()
+                }
+                .contextMenu {
+                    ForEach(TrendingCategory.allCases) { category in
+                        Button(category.controlLabel) { self.category = category }
+                    }
+
+                    Button("Cancel", role: .cancel) {}
                 }
 
-                Button("Cancel", role: .cancel) {}
-            }
-
-        #else
-            Picker(category.controlLabel, selection: $category) {
-                ForEach(TrendingCategory.allCases) { category in
-                    Label(category.controlLabel, systemImage: category.systemImage).tag(category)
+            #else
+                Picker(category.controlLabel, selection: $category) {
+                    ForEach(TrendingCategory.allCases) { category in
+                        Label(category.controlLabel, systemImage: category.systemImage).tag(category)
+                    }
                 }
-            }
-        #endif
+            #endif
+        }
     }
 
     private var countryButton: some View {
@@ -249,6 +236,42 @@ struct TrendingView: View {
     private func updateFavoriteItem() {
         favoriteItem = FavoriteItem(section: .trending(country.rawValue, category.rawValue))
     }
+
+    var header: some View {
+        HStack {
+            Group {
+                categoryButton
+                countryButton
+            }
+            .font(.caption)
+
+            Spacer()
+            ListingStyleButtons(listingStyle: $trendingListingStyle)
+            HideShortsButtons(hide: $hideShorts)
+
+            Button {
+                resource.load()
+                    .onFailure { self.error = $0 }
+                    .onSuccess { _ in self.error = nil }
+            } label: {
+                Label("Refresh", systemImage: "arrow.clockwise")
+                    .labelStyle(.iconOnly)
+                    .imageScale(.small)
+                    .font(.caption)
+            }
+        }
+        .padding(.leading, 30)
+        .padding(.bottom, 15)
+        .padding(.trailing, 30)
+    }
+
+    var shouldDisplayHeader: Bool {
+        #if os(tvOS)
+            true
+        #else
+            false
+        #endif
+    }
 }
 
 struct TrendingView_Previews: PreviewProvider {