feat: implement scroll position restoration for mobile tabs and add double-tap home navigation to refresh feed views.

web/src/components/mobile/StarredTabView.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
 import { Feed, FeedEntry } from '../../types';
 import { Star, ChevronRight } from 'lucide-react';
 
@@ -7,6 +7,8 @@ interface StarredTabViewProps {
   feeds: Feed[];
   onSelectFeedFilter: (feedId?: string) => void;
   onOpenAllStarred: () => void;
+  savedScrollTop?: number;
+  onScrollPosChange?: (pos: number) => void;
 }
 
 export const StarredTabView: React.FC<StarredTabViewProps> = ({
@@ -14,7 +16,32 @@ export const StarredTabView: React.FC<StarredTabViewProps> = ({
   feeds,
   onSelectFeedFilter,
   onOpenAllStarred,
+  savedScrollTop = 0,
+  onScrollPosChange,
 }) => {
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  // Restore scroll position on mount
+  useEffect(() => {
+    if (containerRef.current && savedScrollTop > 0) {
+      containerRef.current.scrollTop = savedScrollTop;
+    }
+  }, []);
+
+  const handleAllStarredClick = () => {
+    if (containerRef.current && onScrollPosChange) {
+      onScrollPosChange(containerRef.current.scrollTop);
+    }
+    onOpenAllStarred();
+  };
+
+  const handleFeedClick = (feedId: string) => {
+    if (containerRef.current && onScrollPosChange) {
+      onScrollPosChange(containerRef.current.scrollTop);
+    }
+    onSelectFeedFilter(feedId);
+  };
+
   const starredEntries = entries.filter((e) => e.is_starred);
 
   // Group starred count by feed
@@ -26,7 +53,16 @@ export const StarredTabView: React.FC<StarredTabViewProps> = ({
   const feedsWithStarred = feeds.filter((f) => starredCountsByFeed[f.id] > 0);
 
   return (
-    <div style={{ flex: 1, overflowY: 'auto', padding: '1rem', paddingBottom: 'calc(var(--bottom-nav-height) + 1.5rem)' }}>
+    <div
+      ref={containerRef}
+      style={{
+        flex: 1,
+        overflowY: 'auto',
+        WebkitOverflowScrolling: 'touch',
+        padding: '1rem',
+        paddingBottom: 'calc(var(--bottom-nav-height) + 1.5rem)',
+      }}
+    >
       <div style={{ marginBottom: '1.25rem' }}>
         <h2 style={{ fontSize: '1.2rem', fontWeight: 800, color: 'var(--text-primary)' }}>Starred Items</h2>
         <div style={{ fontSize: '0.82rem', color: 'var(--text-muted)' }}>
@@ -38,7 +74,7 @@ export const StarredTabView: React.FC<StarredTabViewProps> = ({
         <div
           className="sidebar-item"
           style={{ padding: '0.75rem 0.6rem', borderBottom: '1px solid var(--border-light)' }}
-          onClick={onOpenAllStarred}
+          onClick={handleAllStarredClick}
         >
           <div className="sidebar-item-left">
             <Star size={18} color="var(--star-gold)" fill="var(--star-gold)" />
@@ -57,7 +93,7 @@ export const StarredTabView: React.FC<StarredTabViewProps> = ({
             key={feed.id}
             className="sidebar-item"
             style={{ padding: '0.75rem 0.6rem', borderBottom: '1px solid var(--border-light)' }}
-            onClick={() => onSelectFeedFilter(feed.id)}
+            onClick={() => handleFeedClick(feed.id)}
           >
             <div className="sidebar-item-left">
               <span style={{ fontSize: '0.88rem', color: 'var(--text-primary)' }}>{feed.title}</span>