Update iconography and listview for ios, bump android

android/Omnivore/app/build.gradle

@@ -75,6 +75,7 @@ android {
             excludes += '/META-INF/{AL2.0,LGPL2.1}'
         }
     }
+    namespace 'app.omnivore.omnivore'
 }
 
 dependencies {

android/Omnivore/app/src/main/AndroidManifest.xml

@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    package="app.omnivore.omnivore">
+    xmlns:tools="http://schemas.android.com/tools">
 
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

android/Omnivore/build.gradle

@@ -3,13 +3,18 @@ buildscript {
         compose_version = '1.3.1'
         lifecycle_version = '2.5.1'
         hilt_version = '2.44.2'
-        gradle_plugin_version = '7.3.1'
+        gradle_plugin_version = '7.4.2'
         room_version = '2.4.3'
+        kotlin_version = '1.9.0'
     }
 
     dependencies {
         classpath "com.google.dagger:hilt-android-gradle-plugin:$hilt_version"
         classpath "com.android.tools.build:gradle:$gradle_plugin_version"
+        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
+    }
+    repositories {
+        mavenCentral()
     }
 }
 

apple/Omnivore.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -144,6 +144,15 @@
         "version" : "2.30908.0"
       }
     },
+    {
+      "identity" : "popupview",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/exyte/PopupView.git",
+      "state" : {
+        "revision" : "68349a0ae704b9a7041f756f3f4f460ddbf7ba8d",
+        "version" : "2.6.0"
+      }
+    },
     {
       "identity" : "promises",
       "kind" : "remoteSourceControl",

apple/OmnivoreKit/Package.swift

@@ -25,7 +25,8 @@ let package = Package(
       dependencies: [
         "Models",
         .product(name: "Introspect", package: "SwiftUI-Introspect"),
-        .product(name: "MarkdownUI", package: "swift-markdown-ui")
+        .product(name: "MarkdownUI", package: "swift-markdown-ui"),
+        .productItem(name: "PopupView", package: "PopupView")
       ],
       resources: [.process("Resources")]
     ),
@@ -68,7 +69,8 @@ var dependencies: [Package.Dependency] {
     .package(url: "https://github.com/siteline/SwiftUI-Introspect.git", from: "0.1.4"),
     .package(url: "https://github.com/segmentio/analytics-swift.git", .upToNextMajor(from: "1.0.0")),
     .package(url: "https://github.com/google/GoogleSignIn-iOS", from: "6.2.2"),
-    .package(url: "https://github.com/gonzalezreal/swift-markdown-ui", from: "2.0.0")
+    .package(url: "https://github.com/gonzalezreal/swift-markdown-ui", from: "2.0.0"),
+    .package(url: "https://github.com/exyte/PopupView.git", from: "2.6.0")
   ]
   // Comment out following line for macOS build
   deps.append(.package(url: "https://github.com/PSPDFKit/PSPDFKit-SP", from: "12.0.1"))

apple/OmnivoreKit/Sources/App/Views/AudioPlayer/MiniPlayer.swift

@@ -111,7 +111,7 @@
           .frame(width: dim, height: dim)
           .cornerRadius(6)
 
-        Image(systemName: "headphones")
+        Image.headphones
           .resizable()
           .aspectRatio(contentMode: .fit)
           .frame(width: dim / 2, height: dim / 2)

apple/OmnivoreKit/Sources/App/Views/Home/HomeFeedViewIOS.swift

@@ -29,6 +29,8 @@ struct AnimatingCellHeight: AnimatableModifier {
     @State var searchPresented = false
     @State var addLinkPresented = false
     @State var settingsPresented = false
+    @State var isListScrolled = false
+    @State var listTitle = ""
 
     @EnvironmentObject var dataService: DataService
     @EnvironmentObject var audioController: AudioController
@@ -53,6 +55,8 @@ struct AnimatingCellHeight: AnimatableModifier {
           }
         }
         HomeFeedView(
+          listTitle: $listTitle,
+          isListScrolled: $isListScrolled,
           prefersListLayout: $prefersListLayout,
           viewModel: viewModel
         )
@@ -93,17 +97,18 @@ struct AnimatingCellHeight: AnimatableModifier {
         .navigationBarTitleDisplayMode(.inline)
         .toolbar {
           ToolbarItem(placement: .barLeading) {
-//            Button(action: {
-//              viewModel.showFiltersModal = true
-//            }, label: {
-            HStack(alignment: .center) {
+            VStack(alignment: .leading) {
               let title = (LinkedItemFilter(rawValue: viewModel.appliedFilter) ?? LinkedItemFilter.inbox).displayName
+
               Text(title)
-                .font(Font.system(size: 18, weight: .semibold))
-//                Image(systemName: "chevron.down")
-//                  .font(Font.system(size: 13, weight: .regular))
+                .font(Font.system(size: isListScrolled ? 10 : 18, weight: .semibold))
+
+              if isListScrolled {
+                Text(listTitle)
+                  .font(Font.system(size: 15, weight: .regular))
+                  .foregroundColor(Color.appGrayText)
+              }
             }.frame(maxWidth: .infinity, alignment: .leading)
-//            })
           }
           ToolbarItem(placement: .barTrailing) {
             Button("", action: {})
@@ -148,9 +153,7 @@ struct AnimatingCellHeight: AnimatableModifier {
                   Label("Add Link", systemImage: "plus.square")
                 })
               }, label: {
-                Image(systemName: "ellipsis")
-                  .foregroundColor(.appGrayTextContrast)
-                  .frame(width: 24, height: 24)
+                Image.utilityMenu
               })
             } else {
               EmptyView()
@@ -232,13 +235,19 @@ struct AnimatingCellHeight: AnimatableModifier {
   @MainActor
   struct HomeFeedView: View {
     @EnvironmentObject var dataService: DataService
+
+    @Binding var listTitle: String
+    @Binding var isListScrolled: Bool
     @Binding var prefersListLayout: Bool
     @ObservedObject var viewModel: HomeFeedViewModel
 
+    @State var showSnackbar = false
+    @State var snackbarOperation: SnackbarOperation?
+
     var body: some View {
       VStack(spacing: 0) {
         if prefersListLayout || !enableGrid {
-          HomeFeedListView(prefersListLayout: $prefersListLayout, viewModel: viewModel)
+          HomeFeedListView(listTitle: $listTitle, isListScrolled: $isListScrolled, prefersListLayout: $prefersListLayout, viewModel: viewModel)
         } else {
           HomeFeedGridView(viewModel: viewModel)
         }
@@ -251,6 +260,33 @@ struct AnimatingCellHeight: AnimatableModifier {
           self.viewModel.negatedLabels = $1
         }
       }
+      .popup(isPresented: $showSnackbar) {
+        if let operation = snackbarOperation {
+          Snackbar(isShowing: $showSnackbar, operation: operation)
+        } else {
+          EmptyView()
+        }
+      } customize: {
+        $0
+          .type(.toast)
+          .autohideIn(2)
+          .position(.bottom)
+          .animation(.spring())
+          .closeOnTapOutside(true)
+      }
+      .onReceive(NSNotification.operationSuccessPublisher) { notification in
+        if let message = notification.userInfo?["message"] as? String {
+          snackbarOperation = SnackbarOperation(message: message,
+                                                undoAction: notification.userInfo?["undoAction"] as? SnackbarUndoAction)
+          showSnackbar = true
+        }
+      }
+      .onReceive(NSNotification.operationFailedPublisher) { notification in
+        if let message = notification.userInfo?["message"] as? String {
+          showSnackbar = true
+          snackbarOperation = SnackbarOperation(message: message, undoAction: nil)
+        }
+      }
     }
   }
 
@@ -258,6 +294,8 @@ struct AnimatingCellHeight: AnimatableModifier {
     @EnvironmentObject var dataService: DataService
     @EnvironmentObject var audioController: AudioController
 
+    @Binding var listTitle: String
+    @Binding var isListScrolled: Bool
     @Binding var prefersListLayout: Bool
     @State private var showHideFeatureAlert = false
 
@@ -417,6 +455,48 @@ struct AnimatingCellHeight: AnimatableModifier {
       }
     }
 
+    struct ScrollOffsetPreferenceKey: PreferenceKey {
+      static var defaultValue: CGPoint = .zero
+
+      static func reduce(value _: inout CGPoint, nextValue _: () -> CGPoint) {}
+    }
+
+    @State var topItem: LinkedItem?
+
+    func setTopItem(_ item: LinkedItem) {
+      if let date = item.savedAt, let daysAgo = Calendar.current.dateComponents([.day], from: date, to: Date()).day {
+        if daysAgo < 1 {
+          let formatter = DateFormatter()
+          formatter.timeStyle = .none
+          formatter.dateStyle = .long
+          formatter.doesRelativeDateFormatting = true
+          if let str = formatter.string(for: date) {
+            listTitle = str.capitalized
+          }
+        } else if daysAgo < 2 {
+          let formatter = RelativeDateTimeFormatter()
+          formatter.dateTimeStyle = .named
+          if let str = formatter.string(for: date) {
+            listTitle = str.capitalized
+          }
+        } else if daysAgo < 5 {
+          let formatter = DateFormatter()
+          formatter.dateFormat = "EEEE"
+          if let str = formatter.string(for: date) {
+            listTitle = str
+          }
+        } else {
+          let formatter = DateFormatter()
+          formatter.dateStyle = .medium
+          formatter.timeStyle = .none
+          if let str = formatter.string(for: date) {
+            listTitle = str
+          }
+        }
+        topItem = item
+      }
+    }
+
     var body: some View {
       let horizontalInset = CGFloat(UIDevice.isIPad ? 20 : 10)
       VStack(spacing: 0) {
@@ -443,6 +523,16 @@ struct AnimatingCellHeight: AnimatableModifier {
               .listRowInsets(.init(top: 0, leading: 0, bottom: 0, trailing: 0))
               .listRowSeparator(.hidden, edges: .all)
               .modifier(AnimatingCellHeight(height: 190 + (Color.isDarkMode ? 13 : 13)))
+              .onDisappear {
+                withAnimation {
+                  isListScrolled = true
+                }
+              }
+              .onAppear {
+                withAnimation {
+                  isListScrolled = false
+                }
+              }
           }
 
           ForEach(viewModel.items) { item in
@@ -450,6 +540,19 @@ struct AnimatingCellHeight: AnimatableModifier {
               item: item,
               viewModel: viewModel
             )
+            .background(GeometryReader { geometry in
+              Color.clear
+                .preference(key: ScrollOffsetPreferenceKey.self, value: geometry.frame(in: .named("scroll")).origin)
+            })
+            .onPreferenceChange(ScrollOffsetPreferenceKey.self) { value in
+              if value.y < 100, value.y > 0 {
+                if let date = item.savedAt {
+                  if topItem != item {
+                    setTopItem(item)
+                  }
+                }
+              }
+            }
             .listRowSeparatorTint(Color.thBorderColor)
             .listRowInsets(.init(top: 0, leading: horizontalInset, bottom: 10, trailing: horizontalInset))
             .contextMenu {
@@ -470,6 +573,7 @@ struct AnimatingCellHeight: AnimatableModifier {
         .padding(0)
         .listStyle(PlainListStyle())
         .listRowInsets(.init(top: 0, leading: 0, bottom: 0, trailing: 0))
+        .coordinateSpace(name: "scroll")
       }
       .alert("The Feature Section will be removed from your library. You can add it back from the filter settings in your profile.",
              isPresented: $showHideFeatureAlert) {

apple/OmnivoreKit/Sources/App/Views/Home/HomeView.swift

@@ -5,6 +5,8 @@ import Views
 @MainActor
 struct HomeView: View {
   @State private var viewModel: HomeFeedViewModel
+  @State var showSnackbar = false
+  @State var snackbarOperation: SnackbarOperation?
 
   init(viewModel: HomeFeedViewModel) {
     self.viewModel = viewModel

apple/OmnivoreKit/Sources/App/Views/LibraryTabView.swift

@@ -7,8 +7,10 @@
 
 import Foundation
 import Models
+import PopupView
 import Services
 import SwiftUI
+import Views
 
 struct LibraryTabView: View {
   @EnvironmentObject var dataService: DataService

apple/OmnivoreKit/Sources/App/Views/PrimaryContentView.swift

@@ -10,15 +10,18 @@ import Views
   ]
 
   public var body: some View {
+    innerBody
+  }
+
+  public var innerBody: some View {
     #if os(iOS)
       if UIDevice.isIPad {
-        splitView
+        return AnyView(splitView)
       } else {
-//        HomeView()
-        LibraryTabView()
+        return AnyView(LibraryTabView())
       }
-    #elseif os(macOS)
-      splitView
+    #else
+      return AnyView(splitView)
     #endif
   }
 

apple/OmnivoreKit/Sources/App/Views/Profile/NewsletterEmailsView.swift

@@ -1,4 +1,5 @@
 import Models
+import PopupView
 import Services
 import SwiftUI
 import Views
@@ -38,6 +39,14 @@ struct NewsletterEmailsView: View {
   @EnvironmentObject var dataService: DataService
   @StateObject var viewModel = NewsletterEmailsViewModel()
 
+  @State var showSnackbar = false
+  @State var snackbarOperation: SnackbarOperation?
+
+  func snackbar(message: String) {
+    snackbarOperation = SnackbarOperation(message: message, undoAction: nil)
+    showSnackbar = true
+  }
+
   var body: some View {
     Group {
       #if os(iOS)
@@ -52,6 +61,20 @@ struct NewsletterEmailsView: View {
       #endif
     }
     .task { await viewModel.loadEmails(dataService: dataService) }
+    .popup(isPresented: $showSnackbar) {
+      if let operation = snackbarOperation {
+        Snackbar(isShowing: $showSnackbar, operation: operation)
+      } else {
+        EmptyView()
+      }
+    } customize: {
+      $0
+        .type(.toast)
+        .autohideIn(2)
+        .position(.bottom)
+        .animation(.spring())
+        .closeOnTapOutside(true)
+    }
   }
 
   private var innerBody: some View {
@@ -87,7 +110,7 @@ struct NewsletterEmailsView: View {
                   pasteBoard.writeObjects([newsletterEmail.unwrappedEmail as NSString])
                 #endif
 
-                Snackbar.show(message: "Email copied")
+                snackbar(message: "Email copied")
               },
               label: { Text(newsletterEmail.unwrappedEmail) }
             )
@@ -95,6 +118,7 @@ struct NewsletterEmailsView: View {
         }
       }
     }
+
     .navigationTitle(LocalText.emailsGeneric)
   }
 }

apple/OmnivoreKit/Sources/App/Views/Profile/RecommendationGroupView.swift

@@ -29,7 +29,7 @@
 
       do {
         try await dataService.leaveGroup(groupID: recommendationGroup.id)
-        Snackbar.show(message: "You have left the club.")
+        // Snackbar.show(message: "You have left the club.")
       } catch {
         return false
       }
@@ -182,7 +182,7 @@
               pasteBoard.writeObjects([highlightParams.quote as NSString])
             #endif
 
-            Snackbar.show(message: "Invite link copied")
+            // Snackbar.show(message: "Invite link copied")
           }, label: {
             Text("[\(viewModel.recommendationGroup.inviteUrl)](\(viewModel.recommendationGroup.inviteUrl))")
               .font(.appCaption)

apple/OmnivoreKit/Sources/App/Views/Profile/Subscriptions.swift

@@ -114,7 +114,7 @@ struct SubscriptionsView: View {
       Button("Yes", role: .destructive) {
         Task {
           let unsubscribed = await viewModel.cancelSubscription(dataService: dataService)
-          Snackbar.show(message: unsubscribed ? "Subscription cancelled." : "Could not unsubscribe.")
+          // Snackbar.show(message: unsubscribed ? "Subscription cancelled." : "Could not unsubscribe.")
         }
       }
       Button("No", role: .cancel) {

apple/OmnivoreKit/Sources/App/Views/RootView/RootView.swift

@@ -64,17 +64,6 @@ struct InnerRootView: View {
             }
           }
         #endif
-        .snackBar(isShowing: $viewModel.showSnackbar, operation: viewModel.snackbarOperation)
-          // Schedule the dismissal every time we present the snackbar.
-          .onChange(of: viewModel.showSnackbar) { newValue in
-            if newValue {
-              DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
-                withAnimation {
-                  viewModel.showSnackbar = false
-                }
-              }
-            }
-          }
       }
     } else {
       WelcomeView()
@@ -92,21 +81,6 @@ struct InnerRootView: View {
           .frame(minWidth: 400, idealWidth: 1200, minHeight: 400, idealHeight: 1200)
       #endif
     }
-    #if os(iOS)
-      .onReceive(NSNotification.operationSuccessPublisher) { notification in
-        if let message = notification.userInfo?["message"] as? String {
-          viewModel.snackbarOperation = SnackbarOperation(message: message,
-                                                          undoAction: notification.userInfo?["undoAction"] as? SnackbarUndoAction)
-          viewModel.showSnackbar = true
-        }
-      }
-      .onReceive(NSNotification.operationFailedPublisher) { notification in
-        if let message = notification.userInfo?["message"] as? String {
-          viewModel.showSnackbar = true
-          viewModel.snackbarOperation = SnackbarOperation(message: message, undoAction: nil)
-        }
-      }
-    #endif
     .onOpenURL { Authenticator.handleGoogleURL(url: $0) }
   }
 

apple/OmnivoreKit/Sources/App/Views/RootView/RootViewModel.swift

@@ -18,8 +18,6 @@ public final class RootViewModel: ObservableObject {
   @AppStorage(UserDefaultKey.shouldShowNewFeaturePrimer.rawValue) var shouldShowNewFeaturePrimer = false
 
   @Published var showMiniPlayer = false
-  @Published var showSnackbar = false
-  @Published var snackbarOperation: SnackbarOperation?
 
   public init() {
     registerFonts()

apple/OmnivoreKit/Sources/App/Views/WebReader/WebReader.swift

@@ -12,7 +12,7 @@ struct WebReader: PlatformViewRepresentable {
   let tapHandler: () -> Void
   let scrollPercentHandler: (Int) -> Void
   let webViewActionHandler: (WKScriptMessage, WKScriptMessageReplyHandler?) -> Void
-  let navBarVisibilityRatioUpdater: (Double) -> Void
+  let navBarVisibilityUpdater: (Bool) -> Void
 
   @Binding var readerSettingsChangedTransactionID: UUID?
   @Binding var annotationSaveTransactionID: UUID?
@@ -82,7 +82,7 @@ struct WebReader: PlatformViewRepresentable {
 
     context.coordinator.linkHandler = openLinkAction
     context.coordinator.webViewActionHandler = webViewActionHandler
-    context.coordinator.updateNavBarVisibilityRatio = navBarVisibilityRatioUpdater
+    context.coordinator.updateNavBarVisibility = navBarVisibilityUpdater
     context.coordinator.scrollPercentHandler = scrollPercentHandler
     context.coordinator.updateShowBottomBar = { newValue in
       self.showBottomBar = newValue

apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderContainer.swift

@@ -1,5 +1,6 @@
 import AVFoundation
 import Models
+import PopupView
 import Services
 import SwiftUI
 import Utils
@@ -18,7 +19,7 @@ struct WebReaderContainerView: View {
   @State private var showNotebookView = false
   @State private var hasPerformedHighlightMutations = false
   @State var showHighlightAnnotationModal = false
-  @State private var navBarVisibilityRatio = 1.0
+  @State private var navBarVisible = true
   @State private var progressViewOpacity = 0.0
   @State var readerSettingsChangedTransactionID: UUID?
   @State var annotationSaveTransactionID: UUID?
@@ -81,8 +82,8 @@ struct WebReaderContainerView: View {
 
   private func tapHandler() {
     withAnimation(.easeIn(duration: 0.08)) {
-      navBarVisibilityRatio = navBarVisibilityRatio == 1 ? 0 : 1
-      showBottomBar = navBarVisibilityRatio == 1
+      navBarVisible = !navBarVisible
+      showBottomBar = navBarVisible
       showNavBarActionID = UUID()
     }
   }
@@ -105,8 +106,8 @@ struct WebReaderContainerView: View {
       showHighlightLabelsModal = true
     case "pageTapped":
       withAnimation {
-        navBarVisibilityRatio = navBarVisibilityRatio == 1 ? 0 : 1
-        showBottomBar = navBarVisibilityRatio == 1
+        navBarVisible = !navBarVisible
+        showBottomBar = navBarVisible
         showNavBarActionID = UUID()
       }
     default:
@@ -118,8 +119,7 @@ struct WebReaderContainerView: View {
     var audioNavbarItem: some View {
       if audioController.isLoadingItem(itemID: item.unwrappedID) {
         return AnyView(ProgressView()
-          .padding(.horizontal)
-          .scaleEffect(navBarVisibilityRatio))
+          .padding(.horizontal))
       } else {
         return AnyView(Button(
           action: {
@@ -143,36 +143,34 @@ struct WebReaderContainerView: View {
           label: {
             textToSpeechButtonImage
           }
-        )
-        .padding(.horizontal, 5)
-        .scaleEffect(navBarVisibilityRatio))
+        ))
       }
     }
 
     var textToSpeechButtonImage: some View {
       if audioController.state == .stopped || audioController.itemAudioProperties?.itemID != self.item.id {
-        return Image(systemName: "headphones").font(.appTitleThree)
+        return AnyView(Image.headphones)
       }
       let name = audioController.isPlayingItem(itemID: item.unwrappedID) ? "pause.circle" : "play.circle"
-      return Image(systemName: name).font(.appNavbarIcon)
+      return AnyView(Image(systemName: name).font(.appNavbarIcon))
     }
   #endif
 
   var bottomButtons: some View {
     HStack(alignment: .center) {
       Button(action: archive, label: {
-        Image(systemName: item.isArchived ? "tray.and.arrow.down" : "archivebox")
+        item.isArchived ? Image.unarchive : Image.archive
       }).frame(width: 48, height: 48)
         .padding(.leading, 8)
       Divider().opacity(0.8)
 
       Button(action: delete, label: {
-        Image(systemName: "trash")
+        Image.remove
       }).frame(width: 48, height: 48)
       Divider().opacity(0.8)
 
       Button(action: editLabels, label: {
-        Image(systemName: "tag")
+        Image.label
       }).frame(width: 48, height: 48)
       Divider().opacity(0.8)
 
@@ -261,30 +259,29 @@ struct WebReaderContainerView: View {
     }
   }
 
+  let navBarOffset = 100
+
   var navBar: some View {
-    HStack(alignment: .center, spacing: 15) {
+    HStack(alignment: .center, spacing: 10) {
       #if os(iOS)
         Button(
           action: { self.presentationMode.wrappedValue.dismiss() },
           label: {
-            Image(systemName: "chevron.backward")
-              .font(.appNavbarIcon)
-              // .foregroundColor(.appGrayTextContrast)
-              .padding()
+            Image.chevronRight
+              .padding(.horizontal, 10)
+              .padding(.vertical)
           }
         )
-        .scaleEffect(navBarVisibilityRatio)
         Spacer()
       #endif
 
       Button(
         action: { showNotebookView = true },
         label: {
-          Image("notebook", bundle: Bundle(url: ViewsPackage.bundleURL))
+          Image.notebook
         }
       )
-      .padding(.horizontal, 5)
-      .scaleEffect(navBarVisibilityRatio)
+      .padding(.trailing, 4)
 
       #if os(iOS)
         audioNavbarItem
@@ -298,12 +295,10 @@ struct WebReaderContainerView: View {
             }
           },
           label: {
-            Image(systemName: "textformat.size")
-              .font(.appNavbarIcon)
+            Image.readerSettings
           }
         )
         .padding(.horizontal, 5)
-        .scaleEffect(navBarVisibilityRatio)
         .popover(isPresented: $showPreferencesPopover) {
           webPreferencesPopoverView
             .frame(maxWidth: 400, maxHeight: 475)
@@ -322,13 +317,8 @@ struct WebReaderContainerView: View {
         },
         label: {
           #if os(iOS)
-            Image(systemName: "ellipsis")
-              .resizable(resizingMode: Image.ResizingMode.stretch)
-              .aspectRatio(contentMode: .fit)
-              // .foregroundColor(.appGrayTextContrast)
-              .frame(width: 20, height: 20)
-              .scaleEffect(navBarVisibilityRatio)
-              .padding()
+            Image.utilityMenu
+
           #else
             Text(LocalText.genericOptions)
           #endif
@@ -338,12 +328,12 @@ struct WebReaderContainerView: View {
         .frame(maxWidth: 100)
         .padding(.trailing, 16)
       #else
-        .padding(.trailing, 3)
-        .padding(.bottom, 10)
+        .padding(.trailing, 16)
       #endif
     }
-    .frame(height: readerViewNavBarHeight * navBarVisibilityRatio)
-    .opacity(navBarVisibilityRatio)
+    .tint(Color(hex: "#2A2A2A"))
+    .frame(height: readerViewNavBarHeight)
+    .frame(maxWidth: .infinity)
     .foregroundColor(ThemeManager.currentTheme.isDark ? .white : .black)
     .background(ThemeManager.currentBgColor)
     .sheet(isPresented: $showLabelsModal) {
@@ -403,8 +393,10 @@ struct WebReaderContainerView: View {
           tapHandler: tapHandler,
           scrollPercentHandler: scrollPercentHandler,
           webViewActionHandler: webViewActionHandler,
-          navBarVisibilityRatioUpdater: {
-            navBarVisibilityRatio = $0
+          navBarVisibilityUpdater: { visible in
+            withAnimation {
+              navBarVisible = visible
+            }
           },
           readerSettingsChangedTransactionID: $readerSettingsChangedTransactionID,
           annotationSaveTransactionID: $annotationSaveTransactionID,
@@ -505,7 +497,7 @@ struct WebReaderContainerView: View {
                   self.isRecovering = true
                   Task {
                     if !(await dataService.recoverItem(itemID: item.unwrappedID)) {
-                      Snackbar.show(message: "Error recovering item")
+                      viewModel.snackbar(message: "Error recovering item")
                     } else {
                       await viewModel.loadContent(
                         dataService: dataService,
@@ -554,6 +546,8 @@ struct WebReaderContainerView: View {
       #if os(iOS)
         VStack(spacing: 0) {
           navBar
+            .offset(y: navBarVisible ? 0 : -150)
+
           Spacer()
           if showBottomBar {
             bottomButtons
@@ -585,6 +579,20 @@ struct WebReaderContainerView: View {
       // WebViewManager.shared().loadHTMLString("<html></html>", baseURL: nil)
       WebViewManager.shared().loadHTMLString(WebReaderContent.emptyContent(isDark: Color.isDarkMode), baseURL: nil)
     }
+    .popup(isPresented: $viewModel.showSnackbar) {
+      if let operation = viewModel.snackbarOperation {
+        Snackbar(isShowing: $viewModel.showSnackbar, operation: operation)
+      } else {
+        EmptyView()
+      }
+    } customize: {
+      $0
+        .type(.toast)
+        .autohideIn(2)
+        .position(.bottom)
+        .animation(.spring())
+        .closeOnTapOutside(true)
+    }
   }
 
   func archive() {
@@ -592,7 +600,7 @@ struct WebReaderContainerView: View {
     #if os(iOS)
       presentationMode.wrappedValue.dismiss()
     #endif
-    Snackbar.show(message: !item.isArchived ? "Link archived" : "Link moved to Inbox")
+    viewModel.snackbar(message: !item.isArchived ? "Link archived" : "Link moved to Inbox")
   }
 
   func recommend() {

apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderCoordinator.swift

@@ -19,7 +19,7 @@ final class WebReaderCoordinator: NSObject {
   var previousReaderSettingsChangedUUID: UUID?
   var previousShowNavBarActionID: UUID?
   var previousShareActionID: UUID?
-  var updateNavBarVisibilityRatio: (Double) -> Void = { _ in }
+  var updateNavBarVisibility: (Bool) -> Void = { _ in }
   var updateShowBottomBar: (Bool) -> Void = { _ in }
   var articleContentID = UUID()
   private var yOffsetAtStartOfDrag: Double?
@@ -31,10 +31,10 @@ final class WebReaderCoordinator: NSObject {
     super.init()
   }
 
-  var navBarVisibilityRatio: Double = 1.0 {
+  var navBarVisible: Bool = true {
     didSet {
-      isNavBarHidden = navBarVisibilityRatio == 0
-      updateNavBarVisibilityRatio(navBarVisibilityRatio)
+      isNavBarHidden = !navBarVisible
+      updateNavBarVisibility(navBarVisible)
     }
   }
 
@@ -98,30 +98,28 @@ extension WebReaderCoordinator: WKNavigationDelegate {
 
       if yOffset == 0 {
         scrollView.contentInset.top = readerViewNavBarHeight
-        navBarVisibilityRatio = 1
+        navBarVisible = true
         return
       }
 
       if yOffset < 0 {
-        navBarVisibilityRatio = 1
+        navBarVisible = true
         scrollView.contentInset.top = readerViewNavBarHeight
         return
       }
 
       if yOffset < readerViewNavBarHeight {
         let isScrollingUp = yOffsetAtStartOfDrag ?? 0 > yOffset
-        navBarVisibilityRatio = isScrollingUp || yOffset < 0 ? 1 : min(1, 1 - (yOffset / readerViewNavBarHeight))
-        scrollView.contentInset.top = navBarVisibilityRatio * readerViewNavBarHeight
+        navBarVisible = isScrollingUp || yOffset < 0
+        scrollView.contentInset.top = navBarVisible ? readerViewNavBarHeight : 0
         return
       }
 
       guard let yOffsetAtStartOfDrag = yOffsetAtStartOfDrag else { return }
 
       if yOffset > yOffsetAtStartOfDrag, !isNavBarHidden {
-        let translation = yOffset - yOffsetAtStartOfDrag
-        let ratio = translation < readerViewNavBarHeight ? 1 - (translation / readerViewNavBarHeight) : 0
-        navBarVisibilityRatio = min(ratio, 1)
-        scrollView.contentInset.top = navBarVisibilityRatio * readerViewNavBarHeight
+        navBarVisible = false
+        scrollView.contentInset.top = navBarVisible ? readerViewNavBarHeight : 0
       }
 
       if yOffset + scrollView.visibleSize.height > scrollView.contentSize.height - 140 {
@@ -137,15 +135,15 @@ extension WebReaderCoordinator: WKNavigationDelegate {
     func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
       if decelerate, scrollView.contentOffset.y + scrollView.contentInset.top < (yOffsetAtStartOfDrag ?? 0) {
         scrollView.contentInset.top = readerViewNavBarHeight
-        navBarVisibilityRatio = 1
+        navBarVisible = true
       }
     }
 
     func scrollViewShouldScrollToTop(_ scrollView: UIScrollView) -> Bool {
       scrollView.contentInset.top = readerViewNavBarHeight
-      let navBarVisible = navBarVisibilityRatio == 1
-      navBarVisibilityRatio = 1
-      return navBarVisible
+      let isVisible = navBarVisible
+      navBarVisible = true
+      return isVisible
     }
   }
 #endif

apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderViewModel.swift

@@ -16,6 +16,14 @@ struct SafariWebLink: Identifiable {
   @Published var isDownloadingAudio: Bool = false
   @Published var audioDownloadTask: Task<Void, Error>?
 
+  @Published var showSnackbar: Bool = false
+  var snackbarOperation: SnackbarOperation?
+
+  func snackbar(message: String) {
+    snackbarOperation = SnackbarOperation(message: message, undoAction: nil)
+    showSnackbar = true
+  }
+
   func hasOriginalUrl(_ item: LinkedItem) -> Bool {
     if let pageURLString = item.pageURLString, let host = URL(string: pageURLString)?.host {
       if host == "omnivore.app" {
@@ -27,7 +35,7 @@ struct SafariWebLink: Identifiable {
   }
 
   func downloadAudio(audioController: AudioController, item: LinkedItem) {
-    Snackbar.show(message: "Downloading Offline Audio")
+    snackbar(message: "Downloading Offline Audio")
     isDownloadingAudio = true
 
     if let audioDownloadTask = audioDownloadTask {
@@ -41,7 +49,7 @@ struct SafariWebLink: Identifiable {
       DispatchQueue.main.async {
         self.isDownloadingAudio = false
         if !canceled {
-          Snackbar.show(message: downloaded ? "Audio file downloaded" : "Error downloading audio")
+          self.snackbar(message: downloaded ? "Audio file downloaded" : "Error downloading audio")
         }
       }
     }
@@ -202,12 +210,12 @@ struct SafariWebLink: Identifiable {
   func saveLink(dataService: DataService, url: URL) {
     Task {
       do {
-        Snackbar.show(message: "Saving link")
+        snackbar(message: "Saving link")
         print("SAVING: ", url.absoluteString)
         _ = try await dataService.createPageFromUrl(id: UUID().uuidString, url: url.absoluteString)
-        Snackbar.show(message: "Link saved")
+        snackbar(message: "Link saved")
       } catch {
-        Snackbar.show(message: "Error saving link")
+        snackbar(message: "Error saving link")
       }
     }
   }
@@ -215,14 +223,14 @@ struct SafariWebLink: Identifiable {
   func saveLinkAndFetch(dataService: DataService, username: String, url: URL) {
     Task {
       do {
-        Snackbar.show(message: "Saving link")
+        snackbar(message: "Saving link")
         let requestId = UUID().uuidString
         _ = try await dataService.createPageFromUrl(id: requestId, url: url.absoluteString)
-        Snackbar.show(message: "Link saved")
+        snackbar(message: "Link saved")
 
         await loadContent(dataService: dataService, username: username, itemID: requestId, retryCount: 0)
       } catch {
-        Snackbar.show(message: "Error saving link")
+        snackbar(message: "Error saving link")
       }
     }
   }

apple/OmnivoreKit/Sources/Views/Images/Images.swift

@@ -17,4 +17,15 @@ public extension Image {
   static var tabHighlights: Image { Image("_tab_highlights", bundle: .module).renderingMode(.template) }
 
   static var pinRotated: Image { Image("pin-rotated", bundle: .module) }
+
+  static var chevronRight: Image { Image("chevron-right", bundle: .module) }
+  static var notebook: Image { Image("notebook", bundle: .module) }
+  static var headphones: Image { Image("headphones", bundle: .module) }
+  static var readerSettings: Image { Image("reader-settings", bundle: .module) }
+  static var utilityMenu: Image { Image("utility-menu", bundle: .module) }
+
+  static var archive: Image { Image("archive", bundle: .module) }
+  static var unarchive: Image { Image("unarchive", bundle: .module) }
+  static var remove: Image { Image("remove", bundle: .module) }
+  static var label: Image { Image("label", bundle: .module) }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_dots-three.imageset/Contents.json

@@ -1,15 +0,0 @@
-{
-  "images" : [
-    {
-      "filename" : "dots-three.svg",
-      "idiom" : "universal"
-    }
-  ],
-  "info" : {
-    "author" : "xcode",
-    "version" : 1
-  },
-  "properties" : {
-    "template-rendering-intent" : "template"
-  }
-}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_dots-three.imageset/dots-three.svg

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="26" height="26" viewBox="0 0 26 26" version="1.1">
-<g id="surface1">
-<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 14.21875 13 C 14.21875 13.671875 13.671875 14.21875 13 14.21875 C 12.328125 14.21875 11.78125 13.671875 11.78125 13 C 11.78125 12.328125 12.328125 11.78125 13 11.78125 C 13.671875 11.78125 14.21875 12.328125 14.21875 13 Z M 14.21875 13 "/>
-<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 20.71875 13 C 20.71875 13.671875 20.171875 14.21875 19.5 14.21875 C 18.828125 14.21875 18.28125 13.671875 18.28125 13 C 18.28125 12.328125 18.828125 11.78125 19.5 11.78125 C 20.171875 11.78125 20.71875 12.328125 20.71875 13 Z M 20.71875 13 "/>
-<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 7.71875 13 C 7.71875 13.671875 7.171875 14.21875 6.5 14.21875 C 5.828125 14.21875 5.28125 13.671875 5.28125 13 C 5.28125 12.328125 5.828125 11.78125 6.5 11.78125 C 7.171875 11.78125 7.71875 12.328125 7.71875 13 Z M 7.71875 13 "/>
-</g>
-</svg>

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_tab_briefing.imageset/Contents.json

@@ -17,5 +17,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_tab_highlights.imageset/Contents.json

@@ -17,5 +17,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_tab_library.imageset/Contents.json

@@ -17,5 +17,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/_tab_subscriptions.imageset/Contents.json

@@ -17,5 +17,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/archive.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "archive.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "archive@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "archive@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/chevron-right.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "chevron-left.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "chevron-left@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "chevron-left@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/headphones.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "headphones.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "headphones@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "headphones@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/label.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "label.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "label@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "label@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/notebook.imageset/Contents.json

@@ -1,15 +1,17 @@
 {
   "images" : [
     {
-      "filename" : "notebook.svg",
+      "filename" : "notebooks.png",
       "idiom" : "universal",
       "scale" : "1x"
     },
     {
+      "filename" : "notebooks@2x.png",
       "idiom" : "universal",
       "scale" : "2x"
     },
     {
+      "filename" : "notebooks@3x.png",
       "idiom" : "universal",
       "scale" : "3x"
     }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/notebook.imageset/notebook.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#000000" viewBox="0 0 256 256"><path d="M184,112a8,8,0,0,1-8,8H112a8,8,0,0,1,0-16h64A8,8,0,0,1,184,112Zm-8,24H112a8,8,0,0,0,0,16h64a8,8,0,0,0,0-16Zm48-88V208a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48ZM48,208H72V48H48Zm160,0V48H88V208H208Z"></path></svg>

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/pin-rotated.imageset/Contents.json

@@ -19,5 +19,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/reader-settings.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "reader-settings.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "reader-settings@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "reader-settings@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/remove.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "remove.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "remove@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "remove@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/unarchive.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "unarchive.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "unarchive@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "unarchive@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/Images/Images.xcassets/utility-menu.imageset/Contents.json

@@ -0,0 +1,26 @@
+{
+  "images" : [
+    {
+      "filename" : "utility-menu.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "utility-menu@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "utility-menu@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

apple/OmnivoreKit/Sources/Views/SnackBar.swift

@@ -14,59 +14,51 @@ public struct SnackbarOperation {
 
 public struct Snackbar: View {
   @Binding var isShowing: Bool
-  private let presentingView: AnyView
   private let operation: SnackbarOperation
 
   @Environment(\.colorScheme) private var colorScheme: ColorScheme
 
-  init<PresentingView>(
+  public init(
     isShowing: Binding<Bool>,
-    presentingView: PresentingView,
     operation: SnackbarOperation
-  ) where PresentingView: View {
+  ) {
     self._isShowing = isShowing
-    self.presentingView = AnyView(presentingView)
     self.operation = operation
   }
 
   public var body: some View {
-    GeometryReader { geometry in
-      ZStack(alignment: .center) {
-        presentingView
-        VStack {
-          Spacer()
-          if isShowing {
-            HStack {
-              Text(operation.message)
-                .font(.appCallout)
-                .foregroundColor(self.colorScheme == .light ? .white : .appTextDefault)
-              Spacer()
-              if let undoAction = operation.undoAction {
-                Button("Undo", action: {
-                  isShowing = false
-                  undoAction()
-                })
-                  .font(.system(size: 16, weight: .bold))
-              }
-            }
-            .padding()
-            .frame(width: min(380, geometry.size.width * 0.96), height: 44)
-            .background(self.colorScheme == .light ? Color.black : Color.white)
-            .cornerRadius(5)
-            .offset(x: 0, y: -8)
-            .shadow(color: .gray, radius: 2)
-            .animation(.spring(), value: true)
-          }
+    VStack(alignment: .center) {
+      HStack {
+        Text(operation.message)
+          .font(.appCallout)
+          .foregroundColor(self.colorScheme == .light ? .white : .appTextDefault)
+        Spacer()
+        if let undoAction = operation.undoAction {
+          Button("Undo", action: {
+            isShowing = false
+            undoAction()
+          })
+            .font(.system(size: 16, weight: .bold))
         }
       }
+      .frame(maxWidth: 380)
+      .frame(height: 44)
+      .padding(.horizontal, 15)
+      .background(self.colorScheme == .light ? Color.black : Color.white)
+      .cornerRadius(5)
+      .clipped()
+
+      Spacer(minLength: 20)
     }
+    .background(Color.clear)
+    .frame(height: 44 + 22)
   }
 }
 
 public extension View {
   func snackBar(isShowing: Binding<Bool>, operation: SnackbarOperation?) -> some View {
     if let operation = operation {
-      return AnyView(Snackbar(isShowing: isShowing, presentingView: self, operation: operation))
+      return AnyView(Snackbar(isShowing: isShowing, operation: operation))
     } else {
       return AnyView(self)
     }