From 1fd7bbcd038cddf40540bae7083b9adf4c728912 Mon Sep 17 00:00:00 2001
From: Christophe Besson <cbesson@gmail.com>
Date: Sat, 10 Oct 2026 15:11:52 +0200
Subject: feat(android): back the videos of the chosen albums up beside the
 photos

A 'Videos too' option, off by default, sends them into the same YYYY/YYYY-MM
folders. Files are read from the phone a ranged chunk at a time, so a large
video is never whole in the page.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../src/meshbay_hub/static/photo-sync-settings.js  | 57 +++++++++++++++++-----
 1 file changed, 46 insertions(+), 11 deletions(-)

(limited to 'packages/meshbay-hub/src/meshbay_hub/static/photo-sync-settings.js')

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/photo-sync-settings.js b/packages/meshbay-hub/src/meshbay_hub/static/photo-sync-settings.js
index 7809efa..088de76 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/photo-sync-settings.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/photo-sync-settings.js
@@ -105,6 +105,11 @@ export function PhotoSyncSection({ destination }) {
         </p>
         ${status.permission === 'partial' && html`
           <p class="settings-hint">${t('photosync.permission_partial')}</p>`}
+        ${cfg.includeVideos && status.videoPermission === 'denied' && html`
+          <p class="settings-hint">${t('photosync.video_permission_needed')}</p>
+          <button class="btn-secondary" onClick=${async () => {
+            try { setStatus(await platform.photoSync.permit(true)); } catch (e) { setError(e.message); }
+          }}>${t('photosync.permission_allow')}</button>`}
         ${status.failure
           ? html`<p class="error-msg">${t(FAILURES[status.failure] || 'photosync.fail_other')}</p>`
           : stateLine(run, status) && html`<p class="settings-hint">${stateLine(run, status)}</p>`}
@@ -129,19 +134,32 @@ function Setup({ status, onPermission, onDone }) {
   const [albums, setAlbums] = useState(null);
   const [chosen, setChosen] = useState(() => new Set(cfg ? cfg.albums : []));
   const [existing, setExisting] = useState(cfg ? cfg.includeExisting : true);
+  const [videos, setVideos] = useState(cfg ? !!cfg.includeVideos : false);
   const [busy, setBusy] = useState(false);
   const [error, setError] = useState('');
   const permitted = status.permission !== 'denied';
 
+  const videosAllowed = status.videoPermission !== 'denied';
   useEffect(() => {
     if (!permitted) return;
-    platform.photoSync.albums().then((list) => {
+    platform.photoSync.albums(videos && videosAllowed).then((list) => {
       setAlbums(list);
       // The camera, and only the camera, unless the person chose before:
       // screenshots and saved images are where photos nobody meant to share live.
-      if (!cfg) setChosen(new Set(list.filter((a) => a.camera).map((a) => a.id)));
+      if (!cfg) {
+        setChosen((prev) => (prev.size ? prev : new Set(list.filter((a) => a.camera).map((a) => a.id))));
+      }
     }).catch((e) => setError(e.message));
-  }, [permitted]);
+  }, [permitted, videos, videosAllowed]);
+
+  // Ticking videos asks for them then, not before: Android 13+ asks apart.
+  const toggleVideos = async () => {
+    const next = !videos;
+    setVideos(next);
+    if (next && !videosAllowed) {
+      try { onPermission(await platform.photoSync.permit(true)); } catch (e) { setError(e.message); }
+    }
+  };
 
   const allow = async () => {
     setError('');
@@ -159,14 +177,19 @@ function Setup({ status, onPermission, onDone }) {
     setBusy(true);
     setError('');
     try {
-      const settings = { albums: [...chosen], includeExisting: existing };
-      // Asked when the photos would come from somewhere new in time; never
-      // for a change of albums alone, which the person just made.
-      if (!cfg || cfg.includeExisting !== existing) {
+      const settings = { albums: [...chosen], includeExisting: existing, includeVideos: videos };
+      // Asked when the photos would come from somewhere new in time, or when
+      // videos start going; never for a change of albums alone, which the
+      // person just made.
+      if (!cfg || cfg.includeExisting !== existing || (videos && !cfg.includeVideos)) {
         const est = await platform.photoSync.estimate(settings);
-        const params = { count: est.count, size: formatSize(est.bytes), dir: status.dir };
-        const yes = await ask(t(existing && est.count > 0 ? 'photosync.confirm'
-                                                           : 'photosync.confirm_new', params));
+        const params = {
+          count: est.count, size: formatSize(est.bytes), dir: status.dir,
+          videos: est.videos || 0, videoSize: formatSize(est.videoBytes || 0),
+        };
+        const key = !(est.count > 0) ? 'photosync.confirm_new'
+          : est.videos > 0 ? 'photosync.confirm_videos' : 'photosync.confirm';
+        const yes = await ask(t(key, params));
         if (!yes) { setBusy(false); return; }
       }
       onDone(await platform.photoSync.configure(settings));
@@ -194,10 +217,22 @@ function Setup({ status, onPermission, onDone }) {
             <span class="settings-name">
               <strong>${a.camera ? t('photosync.album_camera') : a.name}</strong>
               <span class="settings-hint">
-                ${t('photosync.album_count', { n: a.count, size: formatSize(a.bytes) })}</span>
+                ${videos && a.videos
+                  ? t('photosync.album_count_videos',
+                      { n: a.count, v: a.videos, size: formatSize(a.bytes + a.videoBytes) })
+                  : t('photosync.album_count', { n: a.count, size: formatSize(a.bytes) })}</span>
             </span>
           </label>
         `)}
+        <label class="settings-choice">
+          <input type="checkbox" checked=${videos} onChange=${toggleVideos} />
+          <span class="settings-name">
+            <strong>${t('photosync.include_videos')}</strong>
+            <span class="settings-hint">${t('photosync.include_videos_hint')}</span>
+          </span>
+        </label>
+        ${videos && !videosAllowed && html`
+          <p class="settings-hint">${t('photosync.video_permission_needed')}</p>`}
         <label class="settings-choice">
           <input type="radio" name="photosync-scope" checked=${existing}
             onChange=${() => setExisting(true)} />
-- 
cgit v1.2.3