Add reading progress tracking
All checks were successful
CI / build-and-deploy (push) Successful in 25s

- BrowserState: inject scroll-tracking JS after page load, report position
  via WKScriptMessageHandler (weak ref to avoid retain cycle)
- BrowserView: thin blue progress bar at top of viewport; saves progress
  to UserDefaults on dismiss; restores scroll position on revisit
- BookmarkRow: 2px progress bar below tags for partially-read articles
- BookmarksView: loads ReadingProgress.all() on appear, refreshes when
  browser sheet dismisses
- ReadingProgress: static helper for UserDefaults-backed [url: Double] store;
  removes entry when article is fully read (≥99%)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Krishna Kumar
2026-05-21 18:42:12 -05:00
parent bc16ee986d
commit db5092ce02
3 changed files with 125 additions and 32 deletions

View File

@@ -1,6 +1,32 @@
import SwiftUI
import WebKit
// MARK: - Reading progress persistence
enum ReadingProgress {
private static let key = "readingProgress"
static func get(url: String) -> Double {
(UserDefaults.standard.dictionary(forKey: key) as? [String: Double])?[url] ?? 0
}
static func set(url: String, progress: Double) {
var store = (UserDefaults.standard.dictionary(forKey: key) as? [String: Double]) ?? [:]
if progress >= 0.99 {
store.removeValue(forKey: url) // fully read clean up
} else {
store[url] = progress
}
UserDefaults.standard.set(store, forKey: key)
}
static func all() -> [String: Double] {
(UserDefaults.standard.dictionary(forKey: key) as? [String: Double]) ?? [:]
}
}
// MARK: - BrowserState
@Observable
final class BrowserState: NSObject, WKNavigationDelegate {
let webView: WKWebView
@@ -9,16 +35,34 @@ final class BrowserState: NSObject, WKNavigationDelegate {
var canGoForward = false
var pageTitle = ""
var currentURL: URL?
var readingProgress: Double = 0
// Weak wrapper breaks WKUserContentController's strong retain of the handler
private final class ScrollHandler: NSObject, WKScriptMessageHandler {
weak var state: BrowserState?
init(_ state: BrowserState) { self.state = state }
func userContentController(_ c: WKUserContentController, didReceive msg: WKScriptMessage) {
if let p = msg.body as? Double { state?.readingProgress = p }
}
}
private var scrollHandler: ScrollHandler?
init(url: URL) {
let config = WKWebViewConfiguration()
config.allowsInlineMediaPlayback = true
webView = WKWebView(frame: .zero, configuration: config)
super.init()
let handler = ScrollHandler(self)
scrollHandler = handler
webView.configuration.userContentController.add(handler, name: "scrollProgress")
webView.navigationDelegate = self
webView.load(URLRequest(url: url))
}
deinit {
webView.configuration.userContentController.removeScriptMessageHandler(forName: "scrollProgress")
}
func webView(_ webView: WKWebView, didStartProvisionalNavigation _: WKNavigation!) {
isLoading = true
}
@@ -35,24 +79,46 @@ final class BrowserState: NSObject, WKNavigationDelegate {
canGoForward = webView.canGoForward
pageTitle = webView.title ?? ""
currentURL = webView.url
// Restore persisted progress, then start tracking scroll
if let urlStr = webView.url?.absoluteString {
let saved = ReadingProgress.get(url: urlStr)
if saved > 0 {
let pct = saved * 100
webView.evaluateJavaScript("window.scrollTo(0, (document.body.scrollHeight - window.innerHeight) * \(pct) / 100)", completionHandler: nil)
}
}
webView.evaluateJavaScript(scrollTrackingJS, completionHandler: nil)
}
func webView(_: WKWebView, didFail _: WKNavigation!, withError _: Error) {
isLoading = false
}
func webView(_: WKWebView, didFailProvisionalNavigation _: WKNavigation!, withError _: Error) {
isLoading = false
}
func webView(_: WKWebView, didFail _: WKNavigation!, withError _: Error) { isLoading = false }
func webView(_: WKWebView, didFailProvisionalNavigation _: WKNavigation!, withError _: Error) { isLoading = false }
func enterReaderMode(completion: @escaping () -> Void) {
webView.evaluateJavaScript(readerModeJS) { _, _ in
DispatchQueue.main.async { completion() }
DispatchQueue.main.async {
completion()
self.webView.evaluateJavaScript(self.scrollTrackingJS, completionHandler: nil)
}
}
}
func exitReaderMode() {
webView.reload()
func exitReaderMode() { webView.reload() }
private var scrollTrackingJS: String {
"""
(function(){
function report(){
var h=document.body.scrollHeight-window.innerHeight;
var p=h>0?window.scrollY/h:0;
window.webkit.messageHandlers.scrollProgress.postMessage(Math.min(1,Math.max(0,p)));
}
window.removeEventListener('scroll',window._marksScrollFn);
window._marksScrollFn=report;
window.addEventListener('scroll',report,{passive:true});
report();
})();
"""
}
private var readerModeJS: String {
@@ -106,12 +172,16 @@ final class BrowserState: NSObject, WKNavigationDelegate {
}
}
// MARK: - WebView representable
private struct WebViewRepresentable: UIViewRepresentable {
let webView: WKWebView
func makeUIView(context: Context) -> WKWebView { webView }
func updateUIView(_ uiView: WKWebView, context: Context) {}
}
// MARK: - BrowserView
struct BrowserView: View {
let initialURL: URL
let initialTitle: String
@@ -136,6 +206,17 @@ struct BrowserView: View {
WebViewRepresentable(webView: state.webView)
.ignoresSafeArea(edges: .bottom)
// Reading progress bar
if state.readingProgress > 0.01 && state.readingProgress < 0.99 {
GeometryReader { geo in
Rectangle()
.fill(Color.blue.opacity(0.7))
.frame(width: geo.size.width * state.readingProgress, height: 3)
}
.frame(height: 3)
.animation(.linear(duration: 0.1), value: state.readingProgress)
}
if state.isLoading {
ProgressView()
.padding(.top, 8)
@@ -151,25 +232,19 @@ struct BrowserView: View {
}
}
ToolbarItem(placement: .topBarTrailing) {
Button {
openURL(state.currentURL ?? initialURL)
} label: {
Button { openURL(state.currentURL ?? initialURL) } label: {
Image(systemName: "safari")
}
}
ToolbarItemGroup(placement: .bottomBar) {
Button {
state.webView.goBack()
} label: {
Button { state.webView.goBack() } label: {
Image(systemName: "chevron.left")
}
.disabled(!state.canGoBack)
Spacer()
Button {
state.webView.goForward()
} label: {
Button { state.webView.goForward() } label: {
Image(systemName: "chevron.right")
}
.disabled(!state.canGoForward)
@@ -177,12 +252,8 @@ struct BrowserView: View {
Spacer()
Button {
if readerMode {
state.exitReaderMode()
readerMode = false
} else {
state.enterReaderMode { readerMode = true }
}
if readerMode { state.exitReaderMode(); readerMode = false }
else { state.enterReaderMode { readerMode = true } }
} label: {
Image(systemName: readerMode ? "doc.text.fill" : "doc.text")
}
@@ -191,13 +262,10 @@ struct BrowserView: View {
Spacer()
if claude != nil {
Button {
showPodcast = true
} label: {
Button { showPodcast = true } label: {
Image(systemName: "headphones")
}
.disabled(state.isLoading)
Spacer()
}
@@ -207,10 +275,14 @@ struct BrowserView: View {
}
}
}
.onDisappear {
let urlStr = (state.currentURL ?? initialURL).absoluteString
let p = state.readingProgress
if p > 0.01 { ReadingProgress.set(url: urlStr, progress: p) }
}
.sheet(isPresented: $showPodcast) {
if let claude {
let url = (state.currentURL ?? initialURL).absoluteString
PodcastPlayerView(articleUrl: url, claude: claude)
PodcastPlayerView(articleUrl: (state.currentURL ?? initialURL).absoluteString, claude: claude)
}
}
}