diff --git a/web/src/lib/components/asset-viewer/DetailPanelDate.svelte b/web/src/lib/components/asset-viewer/DetailPanelDate.svelte
index 65578735ef..381fd93a56 100644
--- a/web/src/lib/components/asset-viewer/DetailPanelDate.svelte
+++ b/web/src/lib/components/asset-viewer/DetailPanelDate.svelte
@@ -3,18 +3,35 @@
   import AssetChangeDateModal from '$lib/modals/AssetChangeDateModal.svelte';
   import { locale } from '$lib/stores/preferences.store';
   import { fromISODateTime, fromISODateTimeUTC, toTimelineAsset } from '$lib/utils/timeline-util';
+  import { getModernOffsetForZoneAndDate } from '$lib/modals/timezone-utils';
   import { type AssetResponseDto } from '@immich/sdk';
   import { Icon, modalManager } from '@immich/ui';
   import { mdiCalendar, mdiPencil } from '@mdi/js';
   import { t } from 'svelte-i18n';
+  import { onMount } from 'svelte';
+  import { websocketEvents } from '$lib/stores/websocket';
 
   type Props = {
     asset: AssetResponseDto;
   };
 
-  const { asset }: Props = $props();
+  onMount(() => {
+    return websocketEvents.on('on_asset_update', (assetUpdate) => {
+      if (assetUpdate.id === asset.id) {
+        asset = assetUpdate;
+      }
+    });
+  });
+
+  let { asset: initialAsset }: Props = $props();
+  let asset: AssetResponseDto = $state(initialAsset);
 
   const timeZone = $derived(asset.exifInfo?.timeZone ?? undefined);
+  const modernOffset = $derived(
+    timeZone && asset.exifInfo?.dateTimeOriginal
+      ? getModernOffsetForZoneAndDate(timeZone, asset.exifInfo.dateTimeOriginal).offsetFormat
+      : undefined,
+  );
   const dateTime = $derived(
     timeZone && asset.exifInfo?.dateTimeOriginal
       ? fromISODateTime(asset.exifInfo.dateTimeOriginal, timeZone)
@@ -59,11 +76,13 @@
                 hour: 'numeric',
                 minute: '2-digit',
                 second: '2-digit',
-                timeZoneName: timeZone ? 'longOffset' : undefined,
               },
               { locale: $locale },
             )}
           </p>
+          {#if modernOffset}
+            GMT{modernOffset}
+          {/if}
         </div>
       </div>
     </div>
diff --git a/web/src/lib/modals/timezone-utils.ts b/web/src/lib/modals/timezone-utils.ts
index ae86e46321..70166b1e96 100644
--- a/web/src/lib/modals/timezone-utils.ts
+++ b/web/src/lib/modals/timezone-utils.ts
@@ -1,4 +1,4 @@
-import { DateTime, Duration } from 'luxon';
+import { DateTime } from 'luxon';
 
 export type ZoneOption = {
   /**
@@ -136,16 +136,7 @@ export function getPreferredTimeZone(
 }
 
 export function toDatetime(selectedDate: string, selectedZone: ZoneOption) {
-  const dtComponents = DateTime.fromISO(selectedDate, { zone: 'utc' });
-
-  // Determine the modern, DST-aware offset for the selected IANA zone
-  const { offsetMinutes } = getModernOffsetForZoneAndDate(selectedZone.value, selectedDate);
-
-  // Construct the final ISO string with a fixed-offset zone.
-  const fixedOffsetZone = `UTC${offsetMinutes >= 0 ? '+' : ''}${Duration.fromObject({ minutes: offsetMinutes }).toFormat('hh:mm')}`;
-
-  // Create a DateTime object in this fixed-offset zone, preserving the local time.
-  return DateTime.fromObject(dtComponents.toObject(), { zone: fixedOffsetZone });
+  return DateTime.fromISO(selectedDate, { zone: selectedZone.value });
 }
 
 export function toIsoDate(selectedDate: string, selectedZone: ZoneOption) {