fix(library): read a .tif's own pixels for its tile

A `.tif` in an album drew nothing: the tile took the file's embedded JPEG —
which a TIFF has not got, so the search found the frame's own pixel data and
kept three hundred kilobytes of it as the frame's tile — and nothing else in
the app draws a TIFF either, `createImageBitmap` answering InvalidStateError
and CanvasKit's `MakeImageFromEncoded` answering null to one.
`src/engine/tiffDecode.ts` reads the file itself, strips or tiles, and hands
back a shrunk frame, which is what the tile is made of now. The tiles that
were kept are dropped once (v4) so a frame already looked at is drawn right.

docker/frontend/src/engine/library.ts

@@ -24,7 +24,7 @@ const PHOTOS = 'photos';
 const THUMBS = 'thumbs';
 const EDITS = 'edits';
 const DIRS = 'dirs';
-const DB_VERSION = 3;
+const DB_VERSION = 4;
 
 // The tile the catalogue keeps is the same tile the grid cell and the strip both
 // paint, and there is one of them per frame of a roll that reaches six figures.
@@ -236,6 +236,13 @@ function openDb(): Promise<IDBDatabase> {
     req.onblocked = () => blockedSink?.(true);
     req.onupgradeneeded = () => {
       const db = req.result;
+      // v4: every catalogue kept a tile for every frame, and a `.tif`'s tile was
+      // the frame's own pixel data read as if it were a JPEG — the bytes are not
+      // a picture, so the tile drew as nothing and, being kept, went on drawing
+      // as nothing on every visit after. The tiles are dropped; each is made
+      // again the first time its frame is looked at, which is when it was going
+      // to be made anyway.
+      if (db.objectStoreNames.contains(THUMBS)) db.deleteObjectStore(THUMBS);
       if (!db.objectStoreNames.contains(FOLDERS)) db.createObjectStore(FOLDERS, { keyPath: 'name' });
       if (!db.objectStoreNames.contains(PHOTOS)) {
         const photos = db.createObjectStore(PHOTOS, { keyPath: 'id' });