feat: Optimize gallery navigation feature

EhPanda-Team · Aug 23, 2021 · ae47a8e · ae47a8e
1 parent b76c9af
commit ae47a8e
Show file tree

Hide file tree

Showing 3 changed files with 89 additions and 29 deletions.
diff --git a/EhPanda/Models/Models.swift b/EhPanda/Models/Models.swift
@@ -141,7 +141,7 @@ struct GalleryTag: Codable, Identifiable {
 }
 
 struct GalleryComment: Identifiable, Codable {
-    var id: String { author + formattedDateString }
+    var id: String { commentID }
 
     var votedUp: Bool
     var votedDown: Bool

diff --git a/EhPanda/View/Detail/CommentView.swift b/EhPanda/View/Detail/CommentView.swift
@@ -21,48 +21,75 @@ struct CommentView: View, StoreAccessor {
     @State private var hudVisible = false
     @State private var hudConfig = TTProgressHUDConfig()
 
+    @State private var commentCellOpacity: Double = 1
+
     private let gid: String
     private let comments: [GalleryComment]
+    private var scrollID: String?
 
-    init(gid: String, comments: [GalleryComment]) {
+    init(
+        gid: String,
+        comments: [GalleryComment],
+        scrollID: String? = nil
+    ) {
         self.gid = gid
         self.comments = comments
+        self.scrollID = scrollID
     }
 
     // MARK: CommentView
     var body: some View {
         ZStack {
-            List(comments) { comment in
-                CommentCell(
-                    gid: gid,
-                    comment: comment,
-                    linkAction: onLinkTap
-                )
-                .swipeActions(edge: .leading) {
-                    if comment.votable {
-                        Button {
-                            voteDown(comment: comment)
-                        } label: {
-                            Image(systemName: "hand.thumbsdown")
+            ScrollViewReader { proxy in
+                List(comments) { comment in
+                    CommentCell(
+                        gid: gid,
+                        comment: comment,
+                        linkAction: onLinkTap
+                    )
+                    .opacity(comment.commentID == scrollID ? commentCellOpacity : 1)
+                    .onAppear {
+                        if comment.commentID == scrollID {
+                            DispatchQueue.main.asyncAfter(deadline: .now() + 0.75) {
+                                withAnimation { commentCellOpacity = 0.25 }
+                            }
+                            DispatchQueue.main.asyncAfter(deadline: .now() + 1.25) {
+                                withAnimation { commentCellOpacity = 1 }
+                            }
                         }
-                        .tint(.red)
                     }
-                }
-                .swipeActions(edge: .trailing) {
-                    if comment.votable {
-                        Button {
-                            voteUp(comment: comment)
-                        } label: {
-                            Image(systemName: "hand.thumbsup")
+                    .swipeActions(edge: .leading) {
+                        if comment.votable {
+                            Button {
+                                voteDown(comment: comment)
+                            } label: {
+                                Image(systemName: "hand.thumbsdown")
+                            }
+                            .tint(.red)
                         }
-                        .tint(.green)
                     }
-                    if comment.editable {
-                        Button {
-                            edit(comment: comment)
-                        } label: {
-                            Image(systemName: "square.and.pencil")
+                    .swipeActions(edge: .trailing) {
+                        if comment.votable {
+                            Button {
+                                voteUp(comment: comment)
+                            } label: {
+                                Image(systemName: "hand.thumbsup")
+                            }
+                            .tint(.green)
                         }
+                        if comment.editable {
+                            Button {
+                                edit(comment: comment)
+                            } label: {
+                                Image(systemName: "square.and.pencil")
+                            }
+                        }
+                    }
+                }
+                .onAppear {
+                    guard let id = scrollID else { return }
+                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.75) {
+                        withAnimation { proxy.scrollTo(id) }
                     }
                 }
             }
@@ -276,11 +303,11 @@ private struct CommentCell: View {
                     }
                     Text(comment.score ?? "")
                     Text(comment.formattedDateString)
-                        .lineLimit(1)
                 }
                 .font(.footnote)
                 .foregroundStyle(.secondary)
             }
+            .lineLimit(1)
             ForEach(comment.contents) { content in
                 switch content.type {
                 case .plainText:

diff --git a/EhPanda/View/Detail/DetailView.swift b/EhPanda/View/Detail/DetailView.swift
@@ -14,6 +14,9 @@ struct DetailView: View, StoreAccessor, PersistenceAccessor {
 
     @State private var keyword = ""
     @State private var commentContent = ""
+    @State private var commentViewScrollID = ""
+    @State private var isReadingLinkActive = false
+    @State private var isCommentsLinkActive = false
     @State private var isTorrentsLinkActive = false
     @State private var isAssociatedLinkActive = false
 
@@ -75,6 +78,19 @@ struct DetailView: View, StoreAccessor, PersistenceAccessor {
             }
         }
         .background {
+            NavigationLink(
+                "",
+                destination: ReadingView(gid: gid),
+                isActive: $isReadingLinkActive
+            )
+            NavigationLink(
+                "",
+                destination: CommentView(
+                    gid: gid, comments: galleryState.comments,
+                    scrollID: commentViewScrollID
+                ),
+                isActive: $isCommentsLinkActive
+            )
             NavigationLink(
                 "",
                 destination: TorrentsView(
@@ -168,6 +184,7 @@ private extension DetailView {
         onStartTasks()
         fetchGalleryDetail()
         updateViewControllersCount()
+        detectAvailableNavigations()
     }
     func onDisappear() {
         updateViewControllersCount()
@@ -186,6 +203,22 @@ private extension DetailView {
     func onUserRatingChanged(value: Int) {
         store.dispatch(.rate(gid: gid, rating: value))
     }
+    func detectAvailableNavigations() {
+        if let pageIndex = detailInfo.pendingJumpPageIndices[gid] {
+            store.dispatch(.updatePendingJumpInfos(gid: gid, pageIndex: nil, commentID: nil))
+            store.dispatch(.saveReadingProgress(gid: gid, tag: pageIndex))
+            DispatchQueue.main.asyncAfter(deadline: .now() + 0.75) {
+                isReadingLinkActive.toggle()
+            }
+        }
+        if let commentID = detailInfo.pendingJumpCommentIDs[gid] {
+            store.dispatch(.updatePendingJumpInfos(gid: gid, pageIndex: nil, commentID: nil))
+            commentViewScrollID = commentID
+            DispatchQueue.main.asyncAfter(deadline: .now() + 0.75) {
+                isCommentsLinkActive.toggle()
+            }
+        }
+    }
     func navigateToTorrentsView() {
         isTorrentsLinkActive.toggle()
     }