feat: settings panel + multi-folder scanning

Settings panel (⚙ in header): - Watch Folders: add/remove paths, toggle enabled; worker polls every 30s and calls watcher.add/unwatch without restart - Ingestion: thumb/preview size and quality, applied per-file at ingest time - Duplicate Detection: configurable Hamming distance threshold - Danger Zone: clear all dismissed duplicate pairs Multi-folder scanning: - watch_folders table replaces single PHOTO_DIR env var - PHOTO_DIR env var seeds the first entry on startup - settings table with defaults for all tunable values - Worker reads settings from DB on each drain cycle so changes are live Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-08-18 07:58:44 -04:00
1 parent 8c5c36857f
commit d18c855571
@@ -5,6 +5,7 @@ import Lightbox from './components/Lightbox.jsx';
 import FilterSidebar from './components/FilterSidebar.jsx';
 import IngestBadge from './components/IngestBadge.jsx';
 import DuplicatesView from './components/DuplicatesView.jsx';
+import SettingsPanel from './components/SettingsPanel.jsx';

 import { lazy, Suspense } from 'react';
 const MapView = lazy(() => import('./components/MapView.jsx'));
@@ -24,8 +25,9 @@ export default function App() {
  const [filters, setFilters]   = useState(EMPTY_FILTERS);
  const [stats, setStats]       = useState(null);

-  const [lbPhotos, setLbPhotos] = useState(null);
-  const [lbIndex, setLbIndex]   = useState(null);
+  const [lbPhotos, setLbPhotos]       = useState(null);
+  const [lbIndex, setLbIndex]         = useState(null);
+  const [showSettings, setShowSettings] = useState(false);

  const loadingRef  = useRef(false);
  const sentinelRef = useRef(null);
@@ -138,9 +140,23 @@ export default function App() {
          </Tab>
        </nav>

-        {/* Ingest progress — right side */}
-        <div style={{ flex: 1, display: 'flex', justifyContent: 'flex-end' }}>
+        {/* Right side: ingest badge + gear */}
+        <div style={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'flex-end', gap: 10 }}>
          <IngestBadge onScanComplete={handleScanComplete} />
+          <button
+            onClick={() => setShowSettings(s => !s)}
+            title="Settings"
+            style={{
+              background: showSettings ? '#1e2a3a' : 'transparent',
+              border: 'none', borderRadius: 6,
+              color: showSettings ? '#7ab8f5' : '#555',
+              cursor: 'pointer', fontSize: 16,
+              width: 32, height: 32,
+              display: 'flex', alignItems: 'center', justifyContent: 'center',
+            }}
+          >
+            ⚙
+          </button>
        </div>
      </header>

@@ -217,6 +233,9 @@ export default function App() {
        </div>
      </div>

+      {/* Settings panel */}
+      {showSettings && <SettingsPanel onClose={() => setShowSettings(false)} />}
+
      {/* Lightbox */}
      {lbPhotos !== null && (
        <Lightbox
@@ -68,6 +68,37 @@ export function removeFromCollection(photoId, collectionId) {
  return api(`/api/photos/${photoId}/collections/${collectionId}`, { method: 'DELETE' });
 }

+// Settings
+export function fetchSettings() {
+  return api('/api/settings');
+}
+
+export function patchSettings(updates) {
+  return api('/api/settings', { method: 'PATCH', ...json(updates) });
+}
+
+// Watch folders
+export function fetchWatchFolders() {
+  return api('/api/watch-folders');
+}
+
+export function addWatchFolder(path) {
+  return api('/api/watch-folders', { method: 'POST', ...json({ path }) });
+}
+
+export function removeWatchFolder(id) {
+  return api(`/api/watch-folders/${id}`, { method: 'DELETE' });
+}
+
+export function toggleWatchFolder(id, enabled) {
+  return api(`/api/watch-folders/${id}`, { method: 'PATCH', ...json({ enabled }) });
+}
+
+// Admin
+export function clearDismissals() {
+  return api('/api/admin/clear-dismissals', { method: 'POST' });
+}
+
 // Duplicates
 export function fetchDuplicates() {
  return api('/api/duplicates');
@@ -0,0 +1,266 @@
+import { useState, useEffect } from 'react';
+import {
+  fetchSettings, patchSettings,
+  fetchWatchFolders, addWatchFolder, removeWatchFolder, toggleWatchFolder,
+  clearDismissals,
+} from '../api/photos.js';
+
+export default function SettingsPanel({ onClose }) {
+  const [settings, setSettings]   = useState(null);
+  const [folders, setFolders]     = useState([]);
+  const [newPath, setNewPath]     = useState('');
+  const [saving, setSaving]       = useState(false);
+  const [cleared, setCleared]     = useState(false);
+
+  useEffect(() => {
+    fetchSettings().then(setSettings);
+    fetchWatchFolders().then(setFolders);
+  }, []);
+
+  // Debounced setting save
+  async function handleSetting(key, value) {
+    const updated = { ...settings, [key]: value };
+    setSettings(updated);
+    setSaving(true);
+    try {
+      const saved = await patchSettings({ [key]: value });
+      setSettings(saved);
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  async function handleAddFolder() {
+    const p = newPath.trim();
+    if (!p) return;
+    const updated = await addWatchFolder(p);
+    setFolders(updated);
+    setNewPath('');
+  }
+
+  async function handleRemoveFolder(id) {
+    await removeWatchFolder(id);
+    setFolders(f => f.filter(x => x.id !== id));
+  }
+
+  async function handleToggleFolder(id, enabled) {
+    const updated = await toggleWatchFolder(id, !enabled);
+    setFolders(updated);
+  }
+
+  async function handleClearDismissals() {
+    await clearDismissals();
+    setCleared(true);
+    setTimeout(() => setCleared(false), 2000);
+  }
+
+  return (
+    // Backdrop
+    <div
+      onClick={onClose}
+      style={{
+        position: 'fixed', inset: 0, zIndex: 200,
+        background: 'rgba(0,0,0,0.6)',
+      }}
+    >
+      {/* Panel */}
+      <div
+        onClick={e => e.stopPropagation()}
+        style={{
+          position: 'absolute', top: 0, right: 0,
+          width: 380, height: '100%',
+          background: '#111', borderLeft: '1px solid #1e1e1e',
+          display: 'flex', flexDirection: 'column',
+          overflowY: 'auto',
+        }}
+      >
+        {/* Header */}
+        <div style={{
+          display: 'flex', alignItems: 'center',
+          padding: '14px 18px', borderBottom: '1px solid #1a1a1a',
+          position: 'sticky', top: 0, background: '#111', zIndex: 1,
+        }}>
+          <span style={{ flex: 1, fontSize: 14, fontWeight: 600, color: '#ddd' }}>Settings</span>
+          {saving && <span style={{ fontSize: 11, color: '#555', marginRight: 10 }}>Saving…</span>}
+          <button
+            onClick={onClose}
+            style={{ background: 'none', border: 'none', color: '#555', cursor: 'pointer', fontSize: 16 }}
+          >✕</button>
+        </div>
+
+        {settings === null ? (
+          <p style={{ padding: 24, color: '#555', fontSize: 13 }}>Loading…</p>
+        ) : (
+          <div style={{ padding: '6px 0 40px' }}>
+
+            {/* ── Watch Folders ── */}
+            <Section title="Watch Folders">
+              <p style={{ fontSize: 11, color: '#444', padding: '0 18px 10px', lineHeight: 1.5 }}>
+                Add absolute paths to scan. In Docker, the path must be mounted as a volume.
+              </p>
+
+              {folders.map(f => (
+                <div key={f.id} style={{
+                  display: 'flex', alignItems: 'center', gap: 8,
+                  padding: '6px 18px',
+                }}>
+                  <button
+                    onClick={() => handleToggleFolder(f.id, f.enabled)}
+                    title={f.enabled ? 'Disable' : 'Enable'}
+                    style={{
+                      width: 14, height: 14, borderRadius: '50%', flexShrink: 0,
+                      background: f.enabled ? '#4d9eff' : '#2a2a2a',
+                      border: '1px solid ' + (f.enabled ? '#2a6ecc' : '#333'),
+                      cursor: 'pointer', padding: 0,
+                    }}
+                  />
+                  <span style={{
+                    flex: 1, fontSize: 12, color: f.enabled ? '#ccc' : '#444',
+                    overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap',
+                    fontFamily: 'monospace',
+                  }}>
+                    {f.path}
+                  </span>
+                  <button
+                    onClick={() => handleRemoveFolder(f.id)}
+                    style={{
+                      background: 'none', border: 'none',
+                      color: '#3a3a3a', cursor: 'pointer', fontSize: 14,
+                      flexShrink: 0, lineHeight: 1,
+                    }}
+                  >×</button>
+                </div>
+              ))}
+
+              <div style={{ display: 'flex', gap: 6, padding: '8px 18px 4px' }}>
+                <input
+                  value={newPath}
+                  onChange={e => setNewPath(e.target.value)}
+                  onKeyDown={e => e.key === 'Enter' && handleAddFolder()}
+                  placeholder="/path/to/photos"
+                  style={{
+                    flex: 1, background: '#1a1a1a', border: '1px solid #2a2a2a',
+                    borderRadius: 5, color: '#ccc', fontSize: 12,
+                    padding: '5px 8px', outline: 'none', fontFamily: 'monospace',
+                  }}
+                />
+                <button
+                  onClick={handleAddFolder}
+                  disabled={!newPath.trim()}
+                  style={{
+                    background: newPath.trim() ? '#1e2f45' : '#181818',
+                    border: '1px solid ' + (newPath.trim() ? '#2a4a6a' : '#222'),
+                    borderRadius: 5, color: newPath.trim() ? '#7ab8f5' : '#333',
+                    cursor: newPath.trim() ? 'pointer' : 'default',
+                    padding: '5px 12px', fontSize: 12,
+                  }}
+                >
+                  Add
+                </button>
+              </div>
+            </Section>
+
+            {/* ── Ingestion ── */}
+            <Section title="Ingestion">
+              <NumSetting label="Thumbnail size" unit="px" min={100} max={800} step={50}
+                value={settings.thumb_size}
+                onChange={v => handleSetting('thumb_size', v)} />
+              <NumSetting label="Thumbnail quality" unit="%" min={1} max={100}
+                value={settings.thumb_quality}
+                onChange={v => handleSetting('thumb_quality', v)} />
+              <NumSetting label="Preview size" unit="px" min={800} max={4000} step={100}
+                value={settings.preview_size}
+                onChange={v => handleSetting('preview_size', v)} />
+              <NumSetting label="Preview quality" unit="%" min={1} max={100}
+                value={settings.preview_quality}
+                onChange={v => handleSetting('preview_quality', v)} />
+              <p style={{ fontSize: 11, color: '#3a3a3a', padding: '4px 18px 0', lineHeight: 1.5 }}>
+                Changes apply to newly ingested photos. Existing thumbnails are not regenerated.
+              </p>
+            </Section>
+
+            {/* ── Duplicate Detection ── */}
+            <Section title="Duplicate Detection">
+              <NumSetting label="Similarity threshold" unit="" min={1} max={20}
+                value={settings.dedupe_threshold}
+                onChange={v => handleSetting('dedupe_threshold', v)} />
+              <p style={{ fontSize: 11, color: '#3a3a3a', padding: '4px 18px 0', lineHeight: 1.5 }}>
+                Hamming distance — lower = stricter (fewer, more exact matches).
+              </p>
+            </Section>
+
+            {/* ── Danger Zone ── */}
+            <Section title="Danger Zone">
+              <div style={{ padding: '4px 18px' }}>
+                <DangerBtn onClick={handleClearDismissals}>
+                  {cleared ? '✓ Done' : 'Clear dismissed duplicates'}
+                </DangerBtn>
+                <p style={{ fontSize: 11, color: '#3a3a3a', marginTop: 5, lineHeight: 1.5 }}>
+                  Resets all "Not duplicates" decisions so groups reappear in the review list.
+                </p>
+              </div>
+            </Section>
+
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+function Section({ title, children }) {
+  return (
+    <div style={{ marginTop: 20 }}>
+      <div style={{
+        fontSize: 10, fontWeight: 700, letterSpacing: '0.08em',
+        color: '#3a3a3a', textTransform: 'uppercase',
+        padding: '0 18px 8px',
+      }}>
+        {title}
+      </div>
+      {children}
+    </div>
+  );
+}
+
+function NumSetting({ label, unit, min, max, step = 1, value, onChange }) {
+  return (
+    <div style={{
+      display: 'flex', alignItems: 'center', gap: 10,
+      padding: '5px 18px',
+    }}>
+      <span style={{ flex: 1, fontSize: 13, color: '#aaa' }}>{label}</span>
+      <input
+        type="number"
+        min={min} max={max} step={step}
+        value={value}
+        onChange={e => {
+          const n = parseInt(e.target.value, 10);
+          if (!isNaN(n) && n >= min && n <= max) onChange(n);
+        }}
+        style={{
+          width: 70, background: '#1a1a1a', border: '1px solid #2a2a2a',
+          borderRadius: 5, color: '#ccc', fontSize: 12,
+          padding: '4px 8px', outline: 'none', textAlign: 'right',
+        }}
+      />
+      {unit && <span style={{ fontSize: 11, color: '#444', width: 16 }}>{unit}</span>}
+    </div>
+  );
+}
+
+function DangerBtn({ onClick, children }) {
+  return (
+    <button
+      onClick={onClick}
+      style={{
+        background: 'transparent',
+        border: '1px solid #3a1a1a',
+        borderRadius: 5, color: '#884444',
+        cursor: 'pointer', padding: '6px 14px', fontSize: 12,
+      }}
+    >
+      {children}
+    </button>
+  );
+}
@@ -1,9 +1,7 @@
 import { hammingDistance } from '../worker/hash.js';

-const THRESHOLD = parseInt(process.env.DEDUPE_THRESHOLD ?? '10', 10);
-
-// Run pairwise pHash comparison and store new similar pairs.
-export function scan(db) {
+export function scan(db, threshold) {
+  const THRESHOLD = threshold ?? parseInt(process.env.DEDUPE_THRESHOLD ?? '10', 10);
  const start = Date.now();

  const photos = db.raw.prepare(
@@ -30,13 +28,10 @@ export function scan(db) {
  return { photos: photos.length, newPairs, duration: Date.now() - start };
 }

-// Build connected-component groups from non-dismissed pairs.
-// Returns an array of photo-row arrays, largest groups first.
 export function getGroups(db) {
  const pairs = db.getDupePairs();
  if (!pairs.length) return [];

-  // Union-Find with path compression
  const parent = new Map();

  function find(x) {
@@ -45,18 +40,11 @@ export function getGroups(db) {
    return parent.get(x);
  }

-  function union(a, b) {
-    parent.set(find(a), find(b));
-  }
+  function union(a, b) { parent.set(find(a), find(b)); }

-  for (const { photo_id_a, photo_id_b } of pairs) {
-    union(photo_id_a, photo_id_b);
-  }
-
-  // Normalize roots (path compression may have left stale entries)
+  for (const { photo_id_a, photo_id_b } of pairs) union(photo_id_a, photo_id_b);
  for (const id of [...parent.keys()]) find(id);

-  // Group IDs by root
  const groups = new Map();
  for (const id of parent.keys()) {
    const root = find(id);
@@ -64,7 +52,6 @@ export function getGroups(db) {
    groups.get(root).push(id);
  }

-  // Fetch photo details for all IDs
  const allIds = [...parent.keys()];
  const rows   = db.raw.prepare(
    `SELECT id, thumb_path, preview_path, date_taken, filesize, width, height, camera_model
@@ -246,8 +246,10 @@ app.delete('/api/photos/:id/collections/:colId', (req, res) => {
 // ── Duplicates ────────────────────────────────────────────────────────────────

 app.post('/api/dedupe/scan', (_req, res) => {
-  try { res.json(scan(db)); }
-  catch (e) { res.status(500).json({ error: e.message }); }
+  try {
+    const { dedupe_threshold } = db.getSettings();
+    res.json(scan(db, dedupe_threshold));
+  } catch (e) { res.status(500).json({ error: e.message }); }
 });

 app.get('/api/duplicates', (_req, res) => {
@@ -274,6 +276,48 @@ app.post('/api/duplicates/dismiss', (req, res) => {
  res.sendStatus(204);
 });

+// ── Settings ──────────────────────────────────────────────────────────────────
+
+app.get('/api/settings', (_req, res) => res.json(db.getSettings()));
+
+app.patch('/api/settings', (req, res) => {
+  const allowed = new Set(['thumb_size', 'thumb_quality', 'preview_size', 'preview_quality', 'dedupe_threshold']);
+  for (const [key, value] of Object.entries(req.body)) {
+    if (!allowed.has(key)) continue;
+    const n = parseInt(value, 10);
+    if (!isNaN(n)) db.setSetting(key, n);
+  }
+  res.json(db.getSettings());
+});
+
+// ── Watch folders ─────────────────────────────────────────────────────────────
+
+app.get('/api/watch-folders', (_req, res) => res.json(db.listWatchFolders()));
+
+app.post('/api/watch-folders', (req, res) => {
+  const p = (req.body.path ?? '').trim();
+  if (!p) return badRequest(res, 'path required');
+  db.addWatchFolder(p);
+  res.status(201).json(db.listWatchFolders());
+});
+
+app.delete('/api/watch-folders/:id', (req, res) => {
+  db.removeWatchFolder(parseInt(req.params.id, 10));
+  res.sendStatus(204);
+});
+
+app.patch('/api/watch-folders/:id', (req, res) => {
+  db.toggleWatchFolder(parseInt(req.params.id, 10), req.body.enabled);
+  res.json(db.listWatchFolders());
+});
+
+// ── Admin ─────────────────────────────────────────────────────────────────────
+
+app.post('/api/admin/clear-dismissals', (_req, res) => {
+  db.raw.prepare('UPDATE duplicate_pairs SET dismissed = 0').run();
+  res.sendStatus(204);
+});
+
 // ── SPA fallback ──────────────────────────────────────────────────────────────

 const distPath = path.resolve(__dirname, '../dist');
@@ -2,6 +2,14 @@ import Database from 'better-sqlite3';
 import path from 'path';
 import fs from 'fs';

+const SETTING_DEFAULTS = {
+  thumb_size:       '400',
+  thumb_quality:    '80',
+  preview_size:     '1600',
+  preview_quality:  '85',
+  dedupe_threshold: '10',
+};
+
 export function openDb(dbPath) {
  fs.mkdirSync(path.dirname(path.resolve(dbPath)), { recursive: true });

@@ -73,11 +81,27 @@ export function openDb(dbPath) {
      started_at TEXT,
      updated_at TEXT
    );
+
+    CREATE TABLE IF NOT EXISTS settings (
+      key   TEXT PRIMARY KEY,
+      value TEXT NOT NULL
+    );
+
+    CREATE TABLE IF NOT EXISTS watch_folders (
+      id       INTEGER PRIMARY KEY AUTOINCREMENT,
+      path     TEXT NOT NULL UNIQUE,
+      enabled  INTEGER NOT NULL DEFAULT 1,
+      added_at TEXT NOT NULL DEFAULT (datetime('now'))
+    );
  `);

-  // Migrations for columns added after initial schema
+  // Column migrations
  try { db.exec('ALTER TABLE photos ADD COLUMN starred INTEGER NOT NULL DEFAULT 0'); } catch {}

+  // Seed default settings
+  const seedSetting = db.prepare('INSERT OR IGNORE INTO settings (key, value) VALUES (?, ?)');
+  for (const [k, v] of Object.entries(SETTING_DEFAULTS)) seedSetting.run(k, v);
+
  const s = {
    insert:   db.prepare(`
      INSERT OR IGNORE INTO photos
@@ -98,29 +122,21 @@ export function openDb(dbPath) {
      FROM tags t LEFT JOIN photo_tags pt ON pt.tag_id = t.id
      GROUP BY t.id ORDER BY t.name
    `),
-    tagOfPhoto: db.prepare(
-      'SELECT t.id, t.name FROM tags t JOIN photo_tags pt ON pt.tag_id = t.id WHERE pt.photo_id = ? ORDER BY t.name'
-    ),
+    tagOfPhoto: db.prepare('SELECT t.id, t.name FROM tags t JOIN photo_tags pt ON pt.tag_id = t.id WHERE pt.photo_id = ? ORDER BY t.name'),
    tagAttach:  db.prepare('INSERT OR IGNORE INTO photo_tags (photo_id, tag_id) VALUES (?, ?)'),
    tagDetach:  db.prepare('DELETE FROM photo_tags WHERE photo_id = ? AND tag_id = ?'),

    colList:    db.prepare(`
-      SELECT c.id, c.name, c.description, c.created_at,
-             COUNT(pc.photo_id) AS photo_count
-      FROM collections c
-      LEFT JOIN photo_collections pc ON pc.collection_id = c.id
+      SELECT c.id, c.name, c.description, c.created_at, COUNT(pc.photo_id) AS photo_count
+      FROM collections c LEFT JOIN photo_collections pc ON pc.collection_id = c.id
      GROUP BY c.id ORDER BY c.name
    `),
    colInsert:  db.prepare('INSERT INTO collections (name, description) VALUES (?, ?)'),
-    colOfPhoto: db.prepare(
-      'SELECT c.id, c.name FROM collections c JOIN photo_collections pc ON pc.collection_id = c.id WHERE pc.photo_id = ? ORDER BY c.name'
-    ),
+    colOfPhoto: db.prepare('SELECT c.id, c.name FROM collections c JOIN photo_collections pc ON pc.collection_id = c.id WHERE pc.photo_id = ? ORDER BY c.name'),
    colAdd:     db.prepare('INSERT OR IGNORE INTO photo_collections (photo_id, collection_id) VALUES (?, ?)'),
    colRemove:  db.prepare('DELETE FROM photo_collections WHERE photo_id = ? AND collection_id = ?'),

-    dupePairs: db.prepare(
-      'SELECT photo_id_a, photo_id_b, distance FROM duplicate_pairs WHERE dismissed = 0'
-    ),
+    dupePairs: db.prepare('SELECT photo_id_a, photo_id_b, distance FROM duplicate_pairs WHERE dismissed = 0'),

    ingestGet: db.prepare('SELECT * FROM ingest_status WHERE id = 1'),
    ingestSet: db.prepare(`
@@ -134,6 +150,14 @@ export function openDb(dbPath) {
        started_at = COALESCE(ingest_status.started_at, excluded.started_at),
        updated_at = excluded.updated_at
    `),
+
+    settingsAll: db.prepare('SELECT key, value FROM settings'),
+    settingsSet: db.prepare('INSERT OR REPLACE INTO settings (key, value) VALUES (?, ?)'),
+
+    foldersAll:    db.prepare('SELECT id, path, enabled, added_at FROM watch_folders ORDER BY added_at'),
+    folderInsert:  db.prepare('INSERT OR IGNORE INTO watch_folders (path) VALUES (?)'),
+    folderDelete:  db.prepare('DELETE FROM watch_folders WHERE id = ?'),
+    folderToggle:  db.prepare('UPDATE watch_folders SET enabled = ? WHERE id = ?'),
  };

  const addTagTx = db.transaction((photoId, tagName) => {
@@ -156,14 +180,14 @@ export function openDb(dbPath) {
    getPhotoTags:       (photoId)          => s.tagOfPhoto.all(photoId),
    listAllTags:        ()                 => s.tagList.all(),

-    listCollections: () => s.colList.all(),
-    createCollection: (name, desc) => {
+    listCollections:           ()           => s.colList.all(),
+    createCollection:          (name, desc) => {
      const info = s.colInsert.run(name, desc ?? null);
      return { id: info.lastInsertRowid, name, description: desc ?? null };
    },
-    addPhotoToCollection:      (photoId, colId) => s.colAdd.run(photoId, colId),
-    removePhotoFromCollection: (photoId, colId) => s.colRemove.run(photoId, colId),
-    getPhotoCollections:       (photoId)        => s.colOfPhoto.all(photoId),
+    addPhotoToCollection:      (pid, cid)   => s.colAdd.run(pid, cid),
+    removePhotoFromCollection: (pid, cid)   => s.colRemove.run(pid, cid),
+    getPhotoCollections:       (pid)        => s.colOfPhoto.all(pid),

    getDupePairs: () => s.dupePairs.all(),
    dismissDuplicates: (ids) => {
@@ -176,15 +200,26 @@ export function openDb(dbPath) {

    getIngestStatus: () =>
      s.ingestGet.get() ?? { active: 0, current: null, scanned: 0, errors: 0 },
-
    setIngestStatus: ({ active, current = null, scanned = 0, errors = 0 }) =>
      s.ingestSet.run({
-        active: active ? 1 : 0,
-        current,
-        scanned,
-        errors,
+        active: active ? 1 : 0, current, scanned, errors,
        started_at: active ? new Date().toISOString() : null,
        updated_at: new Date().toISOString(),
      }),
+
+    getSettings: () => {
+      const rows = s.settingsAll.all();
+      const out = { ...SETTING_DEFAULTS };
+      for (const { key, value } of rows) out[key] = value;
+      // Parse numerics
+      for (const k of Object.keys(SETTING_DEFAULTS)) out[k] = parseInt(out[k], 10);
+      return out;
+    },
+    setSetting: (key, value) => s.settingsSet.run(key, String(value)),
+
+    listWatchFolders:   ()        => s.foldersAll.all(),
+    addWatchFolder:     (p)       => s.folderInsert.run(p),
+    removeWatchFolder:  (id)      => s.folderDelete.run(id),
+    toggleWatchFolder:  (id, en)  => s.folderToggle.run(en ? 1 : 0, id),
  };
 }
@@ -1,23 +1,28 @@
 import 'dotenv/config';
 import chokidar from 'chokidar';
 import path from 'path';
+import fs from 'fs';
 import { openDb } from './db.js';
 import { ingestFile, isSupported } from './ingest.js';

-const PHOTO_DIR  = process.env.PHOTO_DIR  ?? './photos';
+const PHOTO_DIR  = process.env.PHOTO_DIR  ?? null;
 const DB_PATH    = process.env.DB_PATH    ?? './data/library.db';
 const POSTER_DIR = process.env.POSTER_DIR ?? './data/posters';

 const db = openDb(DB_PATH);

-// Load all known paths into memory once so chokidar's initial 'add' burst
-// for an already-indexed library costs one bulk query instead of N serial
-// DB lookups through the drain queue.
+// Seed PHOTO_DIR env var as the first watch folder (if set)
+if (PHOTO_DIR) {
+  const resolved = path.resolve(PHOTO_DIR);
+  if (fs.existsSync(resolved)) db.addWatchFolder(resolved);
+}
+
+// Load all known filepaths into memory so the initial chokidar burst skips
+// already-indexed files without touching the drain queue.
 const indexed = new Set(
  db.raw.prepare('SELECT filepath FROM photos').all().map(r => r.filepath)
 );

-console.log(`[worker] watching ${path.resolve(PHOTO_DIR)}`);
 console.log(`[worker] db at ${path.resolve(DB_PATH)} (${indexed.size} photos indexed)`);

 const queue = [];
@@ -28,13 +33,13 @@ let errors  = 0;
 async function drain() {
  if (busy) return;
  busy = true;
-
  db.setIngestStatus({ active: true, scanned, errors });

  while (queue.length > 0) {
-    const fp = queue.shift();
+    const fp       = queue.shift();
+    const settings = db.getSettings();
    try {
-      await ingestFile(fp, db, POSTER_DIR);
+      await ingestFile(fp, db, POSTER_DIR, settings);
      indexed.add(fp);
      scanned++;
      db.setIngestStatus({ active: true, current: path.basename(fp), scanned, errors });
@@ -49,7 +54,8 @@ async function drain() {
  busy = false;
 }

-const watcher = chokidar.watch(PHOTO_DIR, {
+// Single chokidar instance — paths are added/removed dynamically
+const watcher = chokidar.watch([], {
  persistent: true,
  ignoreInitial: false,
  awaitWriteFinish: { stabilityThreshold: 2000, pollInterval: 100 },
@@ -59,7 +65,7 @@ const watcher = chokidar.watch(PHOTO_DIR, {
 watcher.on('add', (fp) => {
  if (!isSupported(fp)) return;
  const resolved = path.resolve(fp);
-  if (indexed.has(resolved)) return;   // already in DB — skip entirely
+  if (indexed.has(resolved)) return;
  queue.push(resolved);
  drain();
 });
@@ -73,6 +79,34 @@ watcher.on('unlink', (fp) => {

 watcher.on('error', (err) => console.error('[worker] watcher error:', err));

+// Sync watched paths against watch_folders table
+const watching = new Set();
+
+function syncWatchFolders() {
+  const folders = db.listWatchFolders().filter(f => f.enabled);
+
+  for (const { path: p } of folders) {
+    if (!watching.has(p)) {
+      console.log(`[worker] watching ${p}`);
+      watcher.add(p);
+      watching.add(p);
+    }
+  }
+
+  const enabledPaths = new Set(folders.map(f => f.path));
+  for (const p of watching) {
+    if (!enabledPaths.has(p)) {
+      console.log(`[worker] stopped watching ${p}`);
+      watcher.unwatch(p);
+      watching.delete(p);
+    }
+  }
+}
+
+// Initial sync then poll every 30s for UI-added folders
+syncWatchFolders();
+setInterval(syncWatchFolders, 30_000);
+
 process.on('SIGINT', () => {
  console.log('\n[worker] shutting down');
  db.setIngestStatus({ active: false, current: null, scanned, errors });
@@ -14,9 +14,14 @@ export function isSupported(filepath) {
  return SUPPORTED.has(path.extname(filepath).toLowerCase());
 }

-export async function ingestFile(filepath, db, posterDir) {
+export async function ingestFile(filepath, db, posterDir, settings = {}) {
  if (db.hasPhoto(filepath)) return;

+  const thumbSize      = settings.thumb_size      ?? 400;
+  const thumbQuality   = settings.thumb_quality   ?? 80;
+  const previewSize    = settings.preview_size    ?? 1600;
+  const previewQuality = settings.preview_quality ?? 85;
+
  const stat = fs.statSync(filepath);

  let exif = {};
@@ -27,10 +32,10 @@ export async function ingestFile(filepath, db, posterDir) {
    }) ?? {};
  } catch {}

-  const dateTaken    = exif.DateTimeOriginal ?? null;
-  const cameraModel  = [exif.Make, exif.Model].filter(Boolean).join(' ') || null;
-  const gpsLat       = exif.latitude  ?? null;
-  const gpsLon       = exif.longitude ?? null;
+  const dateTaken   = exif.DateTimeOriginal ?? null;
+  const cameraModel = [exif.Make, exif.Model].filter(Boolean).join(' ') || null;
+  const gpsLat      = exif.latitude  ?? null;
+  const gpsLon      = exif.longitude ?? null;

  const { dir, thumb, preview } = posterPaths(filepath, posterDir, dateTaken ?? stat.mtime);
  fs.mkdirSync(dir, { recursive: true });
@@ -44,14 +49,14 @@ export async function ingestFile(filepath, db, posterDir) {

    await sharp(filepath, { failOn: 'none' })
      .rotate()
-      .resize(400, 400, { fit: 'inside', withoutEnlargement: true })
-      .jpeg({ quality: 80 })
+      .resize(thumbSize, thumbSize, { fit: 'inside', withoutEnlargement: true })
+      .jpeg({ quality: thumbQuality })
      .toFile(thumb);

    await sharp(filepath, { failOn: 'none' })
      .rotate()
-      .resize(1600, 1600, { fit: 'inside', withoutEnlargement: true })
-      .jpeg({ quality: 85 })
+      .resize(previewSize, previewSize, { fit: 'inside', withoutEnlargement: true })
+      .jpeg({ quality: previewQuality })
      .toFile(preview);
  } catch (err) {
    console.error(`[ingest] poster failed ${path.basename(filepath)}: ${err.message}`);
@@ -63,17 +68,17 @@ export async function ingestFile(filepath, db, posterDir) {

  db.insertPhoto({
    filepath,
-    thumb_path:   thumb,
-    preview_path: preview,
-    date_taken:   dateTaken ? new Date(dateTaken).toISOString() : null,
+    thumb_path:    thumb,
+    preview_path:  preview,
+    date_taken:    dateTaken ? new Date(dateTaken).toISOString() : null,
    date_imported: new Date().toISOString(),
-    camera_model: cameraModel,
-    gps_lat:      gpsLat,
-    gps_lon:      gpsLon,
+    camera_model:  cameraModel,
+    gps_lat:       gpsLat,
+    gps_lon:       gpsLon,
    phash,
    width,
    height,
-    filesize:     stat.size,
+    filesize: stat.size,
  });

  console.log(`[ingest] ${path.basename(filepath)}`);