fix(library): a server's frames stand at the shape the server stated, not at a guess

docker/frontend/src/Library.tsx

@@ -2101,7 +2101,10 @@ function Catalogue({ admin, user }: { admin: boolean; user: User | null }) {
     let sum = 0;
     for (const ar of wallAr.values()) sum += ar;
     const fallback = wallAr.size ? sum / wallAr.size : WALL_AR;
-    return listed.map((photo) => wallAr.get(photo.id) ?? fallback);
+    // A frame Immich holds already said its own shape, so it is measured off
+    // nothing and stays where it was laid: `wallAr` is for the frames on the disk,
+    // which nobody has opened yet.
+    return listed.map((photo) => photo.ar ?? wallAr.get(photo.id) ?? fallback);
     // `arsAt` is the shape map having grown: the numbers are read off it and not
     // off the list, so nothing else here would make the shelf look again.
   }, [listed, arsAt]);
@@ -3320,7 +3323,12 @@ function Catalogue({ admin, user }: { admin: boolean; user: User | null }) {
                                         }}
                                         onContextMenu={(e) => handlePhotoContextMenu(photo, e)}
                                       >
-                                        {tile(photo, undefined, (ar) => onAr(photo.id, ar))}
+                                        {tile(photo, undefined, (ar) => {
+                                          // Only a frame whose shape is not known
+                                          // already is worth laying the shelf out
+                                          // again for.
+                                          if (photo.ar === undefined) onAr(photo.id, ar);
+                                        })}
                                         {/* The score over the picture, the same five
                                             stars the stage gives: the wall is where a
                                             roll is gone through, and going back to the

docker/frontend/src/engine/immich.ts

@@ -312,6 +312,15 @@ function frameName(name: string, id: string, taken: Set<string>): string {
   return `${name} ~${id.slice(0, 8)}`;
 }
 
+// The shape a frame stands up in, off the numbers Immich holds of it rather than
+// off its own pixels: the wall can be laid out from these the moment the rows
+// land, where a frame whose shape is not known has to wait for its picture and
+// move every row below it when it does. Immich states neither on every frame, and
+// a frame of either number missing is one the wall measures itself.
+function frameAr(asset: ImmichAsset): number | undefined {
+  return asset.width && asset.height ? asset.width / asset.height : undefined;
+}
+
 export interface ImmichSyncResult {
   total: number;
   albums: number;
@@ -433,6 +442,7 @@ export async function syncImmich(
         name,
         server,
         remoteId: item.id,
+        ar: frameAr(item),
         taken: item.takenAt ? Date.parse(item.takenAt) || Date.now() : Date.now(),
         size: item.size ?? 0,
         addedAt: Date.now(),
@@ -497,6 +507,7 @@ export async function syncImmich(
             name,
             server,
             remoteId: item.id,
+            ar: frameAr(item),
             taken: item.takenAt ? Date.parse(item.takenAt) || Date.now() : Date.now(),
             size: item.size ?? 0,
             addedAt: Date.now(),
@@ -576,6 +587,7 @@ export async function syncImmich(
               name,
               server,
               remoteId: item.id,
+              ar: frameAr(item),
               taken: item.takenAt ? Date.parse(item.takenAt) || Date.now() : Date.now(),
               size: item.size ?? 0,
               addedAt: Date.now(),

docker/frontend/src/engine/library.ts

@@ -140,6 +140,12 @@ export interface LibraryPhoto {
   // route above reads the frame by, and the server says which key fetches it.
   remoteId?: string;
   server?: string;
+  // The frame's shape — width over height — as the server stated it, on a frame
+  // Immich holds. A frame on the disk has none: a scan reads a date and a size off
+  // it and never opens it. Where it is here the wall is laid out right the first
+  // time, instead of standing every frame of a node at one guessed rectangle and
+  // moving every row below it as the pictures arrive.
+  ar?: number;
   // The tile the catalogue kept of this frame, where one has been made: it is
   // made when the frame is first drawn and not when it is found, so a frame just
   // read has none. Null is the same as absent — a tile that could not be made.