added1

keystone-app/app/(tabs)/index.tsx

@@ -160,6 +160,13 @@ const GalleryRow = React.memo(({
   return prevSelected.every((s, i) => s === nextSelected[i]);
 });
 
+// Helper function to format file size
+const formatSize = (bytes?: number) => {
+  if (!bytes) return 'Unknown size';
+  const mb = bytes / (1024 * 1024);
+  return mb >= 1 ? `${mb.toFixed(1)} MB` : `${(bytes / 1024).toFixed(0)} KB`;
+};
+
 // ─── Main component ──────────────────────────────────────────────
 export default function PhotosScreen() {
   const insets = useSafeAreaInsets();
@@ -435,6 +442,8 @@ export default function PhotosScreen() {
     }
   }, [groupAssetsByDate]);
 
+
+
   const syncAssets = async () => {
     if (isSyncing || itemsToBackup === 0) return;
     
@@ -899,6 +908,12 @@ export default function PhotosScreen() {
                     {allAssets[viewerIndex].width} x {allAssets[viewerIndex].height}
                   </Text>
                 </View>
+                <View style={styles.infoRow}>
+                  <MaterialIcons name="sd-storage" size={20} color="#5f6368" />
+                  <Text style={styles.infoText}>
+                    {formatSize(allAssets[viewerIndex].size)}
+                  </Text>
+                </View>
                 {allAssets[viewerIndex].isCloudOnly ? (
                   <View style={styles.infoRow}>
                     <MaterialIcons name="cloud" size={20} color="#1a73e8" />

keystone-app/app/(tabs)/search.tsx

@@ -54,6 +54,12 @@ export default function SearchScreen() {
   const [searched, setSearched] = useState(false);
   const [viewerAsset, setViewerAsset] = useState<MediaLibrary.Asset | null>(null);
 
+  const formatSize = (bytes?: number) => {
+    if (!bytes) return '';
+    const mb = bytes / (1024 * 1024);
+    return ` · ${mb >= 1 ? `${mb.toFixed(1)} MB` : `${(bytes / 1024).toFixed(0)} KB`}`;
+  };
+
   const runSearch = useCallback(async (q: string, type: FilterType, range: QuickRange | null) => {
     setIsSearching(true);
     setSearched(true);
@@ -292,7 +298,7 @@ export default function SearchScreen() {
           {viewerAsset && (
             <View style={{ position: 'absolute', bottom: 40, left: 0, right: 0, alignItems: 'center' }}>
               <Text style={{ color: '#fff', fontSize: 13, backgroundColor: 'rgba(0,0,0,0.5)', paddingHorizontal: 12, paddingVertical: 6, borderRadius: 16 }}>
-                {viewerAsset.filename} · {format(new Date(viewerAsset.creationTime), 'MMM d, yyyy')}
+                {viewerAsset.filename} · {format(new Date(viewerAsset.creationTime), 'MMM d, yyyy')}{formatSize((viewerAsset as any).size)}
               </Text>
             </View>
           )}

keystone-app/app/(tabs)/settings.tsx

@@ -9,6 +9,14 @@ import { useAuth } from '../../components/AuthContext';
 
 export const SYNC_ON_CELLULAR_KEY = '@setting_sync_cellular';
 
+const formatStorage = (bytes: number) => {
+  const gb = bytes / (1024 * 1024 * 1024);
+  if (gb > 100) {
+    return `${(gb / 1024).toFixed(2)} TB`;
+  }
+  return `${gb.toFixed(1)} GB`;
+};
+
 export default function SettingsScreen() {
   const { logout, username } = useAuth();
   const [syncOnCellular, setSyncOnCellular] = useState(false);
@@ -164,10 +172,10 @@ export default function SettingsScreen() {
           <View style={{ padding: 16 }}>
             <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 8 }}>
               <Text style={styles.settingLabel}>
-                {(storageStats.used / (1024 * 1024 * 1024)).toFixed(1)} GB used
+                {formatStorage(storageStats.used)} used
               </Text>
               <Text style={styles.settingDesc}>
-                {(storageStats.free / (1024 * 1024 * 1024)).toFixed(1)} GB free
+                {formatStorage(storageStats.free)} free
               </Text>
             </View>
             <View style={{ height: 8, backgroundColor: '#e8f0fe', borderRadius: 4, overflow: 'hidden' }}>

keystone-backend/main.py

@@ -13,6 +13,7 @@ import tempfile
 from fastapi.responses import FileResponse, HTMLResponse
 import zipfile
 import io
+import asyncio
 
 # Load local environment variables
 load_dotenv()

keystone-backend/web.html

@@ -450,9 +450,20 @@
 
         const triggerDownload = (itemPath) => {
             const token = localStorage.getItem('token');
-            // We must pass token in URL since we are opening it in a new tab
             const url = `${API_BASE}/api/web/download?path=${encodeURIComponent(itemPath)}&token=${token}`;
-            window.open(url, '_blank');
+            
+            // Create an invisible anchor tag to trigger native browser download stream
+            // This is safer for large files/zip folders than window.open or fetch->blob
+            const a = document.createElement('a');
+            a.href = url;
+            
+            const parts = itemPath.split('/');
+            const fallbackName = parts[parts.length - 1] || 'download';
+            a.download = fallbackName;
+            
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
         };
 
         const renderBreadcrumbs = () => {