fix(web): use RTL transform origin in AdaptiveImage (#30182)

server/src/schema/migrations/1784836013770-MinFacePreferenceMigration.ts

@@ -0,0 +1,25 @@
+import { Kysely, sql } from 'kysely';
+
+export async function up(db: Kysely<any>): Promise<void> {
+  await sql`
+    INSERT INTO "user_metadata" ("userId", "key", "value")
+    SELECT "user"."id", 'preferences', jsonb_build_object('people', jsonb_build_object('minimumFaces', "config"."minFaces"))
+    FROM "user"
+    CROSS JOIN (
+      SELECT "value"->'machineLearning'->'facialRecognition'->'minFaces' AS "minFaces"
+      FROM "system_metadata"
+      WHERE "key" = 'system-config'
+        AND "value"->'machineLearning'->'facialRecognition'->'minFaces' IS NOT NULL
+    ) AS "config"
+    ON CONFLICT ("userId", "key") DO UPDATE
+    SET "value" = "user_metadata"."value" || jsonb_build_object(
+      'people',
+      COALESCE("user_metadata"."value"->'people', '{}'::jsonb) || (EXCLUDED."value"->'people')
+    )
+    WHERE "user_metadata"."value"->'people'->'minimumFaces' IS NULL
+  `.execute(db);
+}
+
+export async function down(): Promise<void> {
+  // not supported
+}

web/src/lib/components/AdaptiveImage.svelte

@@ -63,6 +63,7 @@
   import { toTimelineAsset } from '$lib/utils/timeline-util';
   import type { AssetResponseDto, SharedLinkResponseDto } from '@immich/sdk';
   import { untrack, type Snippet } from 'svelte';
+  import { languageManager } from '$lib/managers/language-manager.svelte';
 
   type Props = {
     asset: AssetResponseDto;
@@ -232,7 +233,7 @@
       style:width={rasterWidth}
       style:height={rasterHeight}
       style:transform="scale({rasterScale})"
-      style:transform-origin="0 0"
+      style:transform-origin={languageManager.rtl ? 'right top' : 'left top'}
       style:will-change={maxRasterPixels > 0 ? 'transform' : undefined}
     >
       {#if show.alphaBackground}