Improve listing

Shared/ContentView.swift

@@ -1,7 +1,7 @@
 import SwiftUI
 
 struct ContentView: View {
-    @ObservedObject var popular = PopluarVideosProvider()
+    @ObservedObject private var popular = PopluarVideosProvider()
 
     var items: [GridItem] {
         Array(repeating: .init(.flexible()), count: 4)

Shared/PlayerView.swift

@@ -3,7 +3,14 @@ import Foundation
 import SwiftUI
 
 struct PlayerView: View {
-    @ObservedObject var provider: VideoDetailsProvider
+    @ObservedObject private var provider: VideoDetailsProvider
+
+    private var id: String
+
+    init(id: String) {
+        self.id = id
+        provider = VideoDetailsProvider(id)
+    }
 
     var body: some View {
         ZStack {

Shared/VideoThumbnailView.swift

@@ -3,12 +3,12 @@ import URLImage
 import URLImageStore
 
 struct VideoThumbnailView: View {
-    @Environment(\.isFocused) var focused: Bool
+    @Environment(\.isFocused) private var focused: Bool
 
     var video: Video
 
     var body: some View {
-        NavigationLink(destination: PlayerView(provider: VideoDetailsProvider(video.id))) {
+        NavigationLink(destination: PlayerView(id: video.id)) {
             HStack(alignment: .top, spacing: 2) {
                 // to replace with AsyncImage when it is fixed with lazy views
                 URLImage(video.thumbnailURL) { image in
@@ -20,17 +20,41 @@ struct VideoThumbnailView: View {
                 .mask(RoundedRectangle(cornerRadius: 12))
                 .frame(width: 320, height: 180)
 
-                VStack(alignment: .leading) {
-                    Text(video.title)
-                        .foregroundColor(.primary)
-                        .bold()
-                        .lineLimit(1)
+                HStack {
+                    VStack(alignment: .leading) {
+                        Text(video.title)
+                            .foregroundColor(.primary)
+                            .bold()
+                            .lineLimit(1)
 
-                    Text(video.author)
+                        Text("\(video.author)")
+                            .foregroundColor(.secondary)
+                            .bold()
+                            .lineLimit(1)
+
+                        HStack(spacing: 8) {
+                            Image(systemName: "calendar")
+                            Text(video.published)
+
+                            Image(systemName: "eye")
+                            Text(video.viewsCount)
+                        }
                         .foregroundColor(.secondary)
-                        .lineLimit(1)
+                        .padding(.top)
+                    }
+                    .padding()
 
-                }.padding()
+                    Spacer()
+
+                    HStack(spacing: 8) {
+                        Image(systemName: "clock")
+
+                        Text(video.playTime ?? "-")
+                            .fontWeight(.bold)
+                    }
+                    .foregroundColor(.secondary)
+                }
+                .frame(minHeight: 180)
             }
         }
     }
@@ -42,7 +66,9 @@ struct VideoThumbnailView_Previews: PreviewProvider {
             id: "A",
             title: "A very very long text which",
             thumbnailURL: URL(string: "https://invidious.home.arekf.net/vi/yXohcxCKqvo/maxres.jpg")!,
-            author: "Bear"
+            author: "Bear",
+            length: 240,
+            published: "2 days ago"
         )).frame(maxWidth: 350)
     }
 }