Subscribe/unsubscribe channels

Shared/Navigation/AppSidebarNavigation.swift

@@ -49,7 +49,7 @@ struct AppSidebarNavigation: View {
                 SubscriptionsView()
             }
             label: {
-                Label("Subscriptions", systemImage: "play.rectangle.fill")
+                Label("Subscriptions", systemImage: "star.circle.fill")
                     .accessibility(label: Text("Subscriptions"))
             }
 

Shared/Navigation/AppTabNavigation.swift

@@ -10,7 +10,7 @@ struct AppTabNavigation: View {
                 SubscriptionsView()
             }
             .tabItem {
-                Label("Subscriptions", systemImage: "play.rectangle.fill")
+                Label("Subscriptions", systemImage: "star.circle.fill")
                     .accessibility(label: Text("Subscriptions"))
             }
             .tag(TabSelection.subscriptions)

Shared/Navigation/ContentView.swift

@@ -4,6 +4,7 @@ struct ContentView: View {
     @StateObject private var navigationState = NavigationState()
     @StateObject private var playbackState = PlaybackState()
     @StateObject private var searchState = SearchState()
+    @StateObject private var subscriptions = Subscriptions()
 
     #if os(iOS)
         @Environment(\.horizontalSizeClass) private var horizontalSizeClass
@@ -40,6 +41,7 @@ struct ContentView: View {
         .environmentObject(navigationState)
             .environmentObject(playbackState)
             .environmentObject(searchState)
+            .environmentObject(subscriptions)
     }
 }
 

Shared/Player/VideoDetails.swift

@@ -2,16 +2,76 @@ import Foundation
 import SwiftUI
 
 struct VideoDetails: View {
+    @EnvironmentObject<Subscriptions> private var subscriptions
+
+    @State private var subscribed = false
+    @State private var confirmationShown = false
+
     var video: Video
 
     var body: some View {
         VStack(alignment: .leading) {
             Text(video.title)
                 .font(.title2.bold())
+                .padding(.bottom, 0)
 
-            Text(video.author)
+            Divider()
+
+            HStack(alignment: .center) {
+                HStack(spacing: 4) {
+                    if subscribed {
+                        Image(systemName: "star.circle.fill")
+                    }
+                    VStack(alignment: .leading) {
+                        Text(video.channel.name)
+                            .font(.system(size: 13))
+                            .bold()
+                        if !video.channel.subscriptionsCount.isEmpty {
+                            Text("\(video.channel.subscriptionsCount) subscribers")
+                                .font(.caption2)
+                        }
+                    }
+                }
                 .foregroundColor(.secondary)
 
+                Spacer()
+
+                Section {
+                    if subscribed {
+                        Button("Unsubscribe") {
+                            confirmationShown = true
+                        }
+                        #if os(iOS)
+                            .tint(.gray)
+                        #endif
+                        .confirmationDialog("Are you you want to unsubscribe from \(video.channel.name)?", isPresented: $confirmationShown) {
+                            Button("Unsubscribe") {
+                                subscriptions.unsubscribe(video.channel.id)
+
+                                withAnimation {
+                                    subscribed.toggle()
+                                }
+                            }
+                        }
+                    } else {
+                        Button("Subscribe") {
+                            subscriptions.subscribe(video.channel.id)
+
+                            withAnimation {
+                                subscribed.toggle()
+                            }
+                        }
+                        .tint(.blue)
+                    }
+                }
+                .font(.system(size: 13))
+                .buttonStyle(.borderless)
+                .buttonBorderShape(.roundedRectangle)
+            }
+            .padding(.bottom, -1)
+
+            Divider()
+
             HStack(spacing: 4) {
                 if let published = video.publishedDate {
                     Text(published)
@@ -26,25 +86,37 @@ struct VideoDetails: View {
                     Text(publishedAt.formatted(date: .abbreviated, time: .omitted))
                 }
             }
-            .padding(.top, 4)
             .font(.system(size: 12))
+            .padding(.bottom, -1)
             .foregroundColor(.secondary)
 
+            Divider()
+
             HStack {
+                Spacer()
+
                 if let views = video.viewsCount {
-                    VideoDetail(title: "Views", detail: views)
+                    videoDetail(label: "Views", value: views, symbol: "eye.fill")
                 }
 
                 if let likes = video.likesCount {
-                    VideoDetail(title: "Likes", detail: likes, symbol: "hand.thumbsup.circle.fill", symbolColor: Color("VideoDetailLikesSymbolColor"))
+                    Divider()
+
+                    videoDetail(label: "Likes", value: likes, symbol: "hand.thumbsup.circle.fill")
                 }
 
                 if let dislikes = video.dislikesCount {
-                    VideoDetail(title: "Dislikes", detail: dislikes, symbol: "hand.thumbsdown.circle.fill", symbolColor: Color("VideoDetailDislikesSymbolColor"))
+                    Divider()
+
+                    videoDetail(label: "Dislikes", value: dislikes, symbol: "hand.thumbsdown.circle.fill")
                 }
+
+                Spacer()
             }
-            .padding(.horizontal, 1)
-            .padding(.vertical, 4)
+            .frame(maxHeight: 35)
+            .foregroundColor(.secondary)
+
+            Divider()
 
             #if os(macOS)
                 ScrollView(.vertical) {
@@ -81,6 +153,25 @@ struct VideoDetails: View {
         }
         .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
         .padding([.horizontal, .bottom])
+        .onAppear {
+            subscribed = subscriptions.subscribed(video.channel.id)
+        }
+    }
+
+    func videoDetail(label: String, value: String, symbol: String) -> some View {
+        VStack(spacing: 4) {
+            HStack(spacing: 2) {
+                Image(systemName: symbol)
+
+                Text(label.uppercased())
+            }
+            .font(.system(size: 9))
+            .opacity(0.6)
+
+            Text(value)
+        }
+
+        .frame(maxWidth: 100)
     }
 
     var showScrollIndicators: Bool {
@@ -92,41 +183,9 @@ struct VideoDetails: View {
     }
 }
 
-struct VideoDetail: View {
-    var title: String
-    var detail: String
-    var symbol = "eye.fill"
-    var symbolColor = Color.white
-
-    var body: some View {
-        VStack {
-            VStack(spacing: 0) {
-                HStack(alignment: .center, spacing: 4) {
-                    Image(systemName: symbol)
-                        .foregroundColor(symbolColor)
-
-                    Text(title.uppercased())
-
-                    Spacer()
-                }
-                .font(.caption2)
-                .padding([.leading, .top], 4)
-                .frame(alignment: .leading)
-
-                Divider()
-                    .background(.gray)
-                    .padding(.vertical, 4)
-
-                Text(detail)
-                    .shadow(radius: 1.0)
-                    .font(.title3.bold())
-            }
-        }
-        .foregroundColor(.white)
-        .background(Color("VideoDetailBackgroundColor"))
-        .cornerRadius(6)
-        .overlay(RoundedRectangle(cornerRadius: 6)
-            .stroke(Color("VideoDetailBorderColor"), lineWidth: 1))
-        .frame(maxWidth: 90)
+struct VideoDetails_Previews: PreviewProvider {
+    static var previews: some View {
+        VideoDetails(video: Video.fixture)
+            .environmentObject(Subscriptions())
     }
 }

Shared/Views/SubscriptionsView.swift

@@ -3,7 +3,7 @@ import SwiftUI
 struct SubscriptionsView: View {
     @ObservedObject private var store = Store<[Video]>()
 
-    var resource = InvidiousAPI.shared.subscriptions
+    var resource = InvidiousAPI.shared.feed
 
     init() {
         resource.addObserver(store)

Shared/Views/VideoContextMenuView.swift

@@ -3,33 +3,49 @@ import SwiftUI
 
 struct VideoContextMenuView: View {
     @EnvironmentObject<NavigationState> private var navigationState
+    @EnvironmentObject<Subscriptions> private var subscriptions
 
     let video: Video
 
     @Default(.showingAddToPlaylist) var showingAddToPlaylist
     @Default(.videoIDToAddToPlaylist) var videoIDToAddToPlaylist
 
+    @State private var subscribed = false
+
     var body: some View {
-        openChannelButton(from: video)
+        Section {
+            openChannelButton
 
-        openVideoDetailsButton
+            subscriptionButton
+                .opacity(subscribed ? 1 : 1)
 
-        if navigationState.tabSelection == .playlists {
-            removeFromPlaylistButton
-        } else {
-            addToPlaylistButton
+            openVideoDetailsButton
+
+            if navigationState.tabSelection == .playlists {
+                removeFromPlaylistButton
+            } else {
+                addToPlaylistButton
+            }
         }
     }
 
-    func openChannelButton(from video: Video) -> some View {
+    var openChannelButton: some View {
         Button("\(video.author) Channel") {
-            navigationState.openChannel(Channel.from(video: video))
+            navigationState.openChannel(video.channel)
         }
     }
 
-    func closeChannelButton(from video: Video) -> some View {
-        Button("Close \(Channel.from(video: video).name) Channel") {
-            navigationState.closeChannel()
+    var subscriptionButton: some View {
+        Group {
+            if subscriptions.subscribed(video.channel.id) {
+                Button("Unsubscribe", role: .destructive) {
+                    subscriptions.unsubscribe(video.channel.id)
+                }
+            } else {
+                Button("Subscribe") {
+                    subscriptions.subscribe(video.channel.id)
+                }
+            }
         }
     }