From ac36214ea85fa8f875a20c8a4ef940be4c842f75 Mon Sep 17 00:00:00 2001
From: Philipp <philipp@f1ndus.de>
Date: Thu, 21 Nov 2024 14:38:50 +0100
Subject: [PATCH 1/4] Lightbox: Added Button to jump to current image within
 the conversation

---
 _locales/en/messages.json            |  4 ++++
 stylesheets/components/Lightbox.scss |  9 +++++++++
 ts/components/Lightbox.tsx           | 25 +++++++++++++++++++++++++
 3 files changed, 38 insertions(+)

diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 87ac561fcd9..ccb759e0145 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -8343,5 +8343,9 @@
   "icu:WhatsNew__v7.50--0": {
     "messageformat": "If you link a new Desktop on Signal Android and choose to transfer your message history, now you can also selectively transfer old attachments from your primary device too. Bring the past into the present by scrolling back in time and clicking on the download icon. As always, the transfer process is end-to-end encrypted and secure.",
     "description": "Release notes for version 7.49"
+  },
+  "icu:jumpto": {
+    "messageformat": "Jump to",
+    "description": "Jumps to the medias position in the conversation"
   }
 }
diff --git a/stylesheets/components/Lightbox.scss b/stylesheets/components/Lightbox.scss
index 10376657df7..6a7e6d582fa 100644
--- a/stylesheets/components/Lightbox.scss
+++ b/stylesheets/components/Lightbox.scss
@@ -360,6 +360,15 @@
       }
     }
 
+    &--jump {
+      &::before {
+        @include mixins.color-svg(
+          '../images/icons/v3/chat/chat.svg',
+          variables.$color-gray-15
+        );
+      }
+    }
+
     &--close {
       &::before {
         @include mixins.color-svg(
diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx
index 4a80f806c4c..0f5478067df 100644
--- a/ts/components/Lightbox.tsx
+++ b/ts/components/Lightbox.tsx
@@ -13,6 +13,7 @@ import type {
   ConversationType,
   SaveAttachmentActionCreatorType,
 } from '../state/ducks/conversations';
+import { useConversationsActions } from '../state/ducks/conversations';
 import type { LocalizerType } from '../types/Util';
 import type { MediaItemType } from '../types/MediaItem';
 import * as GoogleChrome from '../util/GoogleChrome';
@@ -99,6 +100,7 @@ export function Lightbox({
   hasNextMessage,
   hasPrevMessage,
 }: PropsType): JSX.Element | null {
+  const { scrollToMessage } = useConversationsActions();
   const hasThumbnails = media.length > 1;
   const messageId = media.at(0)?.message.id;
   const prevMessageId = usePrevious(messageId, messageId);
@@ -243,6 +245,21 @@ export function Lightbox({
     [isViewOnce, media, saveAttachment, selectedIndex]
   );
 
+  const handleJumpToConversation = useCallback(
+    (
+      event: KeyboardEvent | React.MouseEvent<HTMLButtonElement, MouseEvent>
+    ) => {
+      if (isViewOnce) {
+        return;
+      }
+      const mediaItem = media[selectedIndex];
+      const { message } = mediaItem;
+      const { conversationId, id } = message;
+      scrollToMessage(conversationId, id);
+    },
+    [isViewOnce, media, selectedIndex, scrollToMessage]
+  );
+
   const handleForward = (
     event: React.MouseEvent<HTMLButtonElement, MouseEvent>
   ) => {
@@ -726,6 +743,14 @@ export function Lightbox({
                   <div />
                 )}
                 <div className="Lightbox__controls">
+                  {!isViewOnce ? (
+                    <button
+                      aria-label={i18n('icu:jumpto')}
+                      className="Lightbox__button Lightbox__button--jump"
+                      onClick={handleJumpToConversation}
+                      type="button"
+                    />
+                  ) : null}
                   {!isViewOnce ? (
                     <button
                       aria-label={i18n('icu:forwardMessage')}

From b2e99716ec975ee5bf77a45cf5aeca9c753fd5df Mon Sep 17 00:00:00 2001
From: Philipp <philipp@f1ndus.de>
Date: Fri, 22 Nov 2024 12:01:37 +0100
Subject: [PATCH 2/4] added authorId to MessageAttributesType

Lightbox:
  moved conversationId references to new authorId reference
  save authorId and conversationId separately
---
 ts/components/Lightbox.tsx |  2 +-
 ts/model-types.d.ts        |  1 +
 ts/state/ducks/lightbox.ts | 25 ++++++++++++++++++-------
 ts/types/MediaItem.ts      |  2 +-
 4 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx
index 0f5478067df..311085c52a1 100644
--- a/ts/components/Lightbox.tsx
+++ b/ts/components/Lightbox.tsx
@@ -899,7 +899,7 @@ function LightboxHeader({
   item: ReadonlyDeep<MediaItemType>;
 }): JSX.Element {
   const { message } = item;
-  const conversation = getConversation(message.conversationId);
+  const conversation = getConversation(message.authorId);
 
   const now = Date.now();
 
diff --git a/ts/model-types.d.ts b/ts/model-types.d.ts
index b533650c690..0cd3c9153da 100644
--- a/ts/model-types.d.ts
+++ b/ts/model-types.d.ts
@@ -220,6 +220,7 @@ export type MessageAttributesType = {
   verified?: boolean;
   verifiedChanged?: string;
 
+  authorId: string;
   id: string;
   type: MessageType;
   body?: string;
diff --git a/ts/state/ducks/lightbox.ts b/ts/state/ducks/lightbox.ts
index 5836a6bead0..b1bd9964e3c 100644
--- a/ts/state/ducks/lightbox.ts
+++ b/ts/state/ducks/lightbox.ts
@@ -45,6 +45,7 @@ import { AttachmentDownloadUrgency } from '../../types/AttachmentDownload';
 import { queueAttachmentDownloads } from '../../util/queueAttachmentDownloads';
 import { getMessageIdForLogging } from '../../util/idForLogging';
 import { markViewOnceMessageViewed } from '../../services/MessageUpdater';
+import type { MessageModel } from '../../models/messages';
 
 // eslint-disable-next-line local-rules/type-alias-readonlydeep
 export type LightboxStateType =
@@ -203,6 +204,8 @@ function showLightboxForViewOnceMedia(
 
     const { contentType } = tempAttachment;
 
+    const authorId = getAuthorId(message);
+
     const media = [
       {
         attachment: tempAttachment,
@@ -215,6 +218,7 @@ function showLightboxForViewOnceMedia(
           attachments: message.get('attachments') || [],
           id: message.get('id'),
           conversationId: message.get('conversationId'),
+          authorId,
           receivedAt: message.get('received_at'),
           receivedAtMs: Number(message.get('received_at_ms')),
           sentAt: message.get('sent_at'),
@@ -235,6 +239,16 @@ function showLightboxForViewOnceMedia(
   };
 }
 
+function getAuthorId(message: MessageModel) {
+  return (
+    window.ConversationController.lookupOrCreate({
+      serviceId: message.get('sourceServiceId'),
+      e164: message.get('source'),
+      reason: 'conversation_view.showLightBox',
+    })?.id || message.get('conversationId')
+  );
+}
+
 function filterValidAttachments(
   attributes: ReadonlyMessageAttributesType
 ): Array<AttachmentType> {
@@ -297,12 +311,8 @@ function showLightbox(opts: {
     const attachments = filterValidAttachments(message.attributes);
     const loop = isGIF(attachments);
 
-    const authorId =
-      window.ConversationController.lookupOrCreate({
-        serviceId: message.get('sourceServiceId'),
-        e164: message.get('source'),
-        reason: 'conversation_view.showLightBox',
-      })?.id || message.get('conversationId');
+    const authorId = getAuthorId(message);
+    const conversationId = message.get('conversationId');
     const receivedAt = message.get('received_at');
     const sentAt = message.get('sent_at');
 
@@ -322,7 +332,8 @@ function showLightbox(opts: {
         message: {
           attachments: message.get('attachments') || [],
           id: messageId,
-          conversationId: authorId,
+          conversationId,
+          authorId,
           receivedAt,
           receivedAtMs: Number(message.get('received_at_ms')),
           sentAt,
diff --git a/ts/types/MediaItem.ts b/ts/types/MediaItem.ts
index 059b0f12cfa..05ada8f40dd 100644
--- a/ts/types/MediaItem.ts
+++ b/ts/types/MediaItem.ts
@@ -7,7 +7,7 @@ import type { MIMEType } from './MIME';
 
 export type MediaItemMessageType = Pick<
   ReadonlyMessageAttributesType,
-  'attachments' | 'conversationId' | 'id'
+  'attachments' | 'conversationId' | 'authorId' | 'id'
 > & {
   receivedAt: number;
   receivedAtMs?: number;

From a63ca31cbfd26a0ee32228737cff525eb8fcf833 Mon Sep 17 00:00:00 2001
From: Philipp <philipp@f1ndus.de>
Date: Tue, 8 Apr 2025 12:39:28 +0200
Subject: [PATCH 3/4] eslint fixes

---
 ts/components/Lightbox.tsx   | 4 ++--
 ts/model-types.d.ts          | 2 +-
 ts/util/sendEditedMessage.ts | 2 +-
 ts/util/sendStoryMessage.ts  | 3 ++-
 4 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx
index 311085c52a1..e0d5641a436 100644
--- a/ts/components/Lightbox.tsx
+++ b/ts/components/Lightbox.tsx
@@ -247,7 +247,7 @@ export function Lightbox({
 
   const handleJumpToConversation = useCallback(
     (
-      event: KeyboardEvent | React.MouseEvent<HTMLButtonElement, MouseEvent>
+      _event: KeyboardEvent | React.MouseEvent<HTMLButtonElement, MouseEvent>
     ) => {
       if (isViewOnce) {
         return;
@@ -899,7 +899,7 @@ function LightboxHeader({
   item: ReadonlyDeep<MediaItemType>;
 }): JSX.Element {
   const { message } = item;
-  const conversation = getConversation(message.authorId);
+  const conversation = getConversation(message.authorId ?? "");
 
   const now = Date.now();
 
diff --git a/ts/model-types.d.ts b/ts/model-types.d.ts
index 0cd3c9153da..8592b17c3c2 100644
--- a/ts/model-types.d.ts
+++ b/ts/model-types.d.ts
@@ -220,7 +220,7 @@ export type MessageAttributesType = {
   verified?: boolean;
   verifiedChanged?: string;
 
-  authorId: string;
+  authorId?: string;
   id: string;
   type: MessageType;
   body?: string;
diff --git a/ts/util/sendEditedMessage.ts b/ts/util/sendEditedMessage.ts
index 401befa33cf..9d2ac4332d5 100644
--- a/ts/util/sendEditedMessage.ts
+++ b/ts/util/sendEditedMessage.ts
@@ -192,7 +192,7 @@ export async function sendEditedMessage(
     sendStateByConversationId,
     sent_at: timestamp,
     timestamp,
-    type: 'outgoing',
+    type: 'outgoing'
   };
 
   // Takes care of putting the message in the edit history, replacing the
diff --git a/ts/util/sendStoryMessage.ts b/ts/util/sendStoryMessage.ts
index dcb59030b31..a0ca90f9c9b 100644
--- a/ts/util/sendStoryMessage.ts
+++ b/ts/util/sendStoryMessage.ts
@@ -173,6 +173,7 @@ export async function sendStoryMessage(
         // Note: we use the same sent_at for these messages because we want de-duplication
         //   on the receiver side.
         return window.Signal.Migrations.upgradeMessageSchema({
+          authorId: "",
           attachments,
           bodyRanges,
           conversationId: ourConversation.id,
@@ -191,7 +192,7 @@ export async function sendStoryMessage(
           sourceDevice: window.textsecure.storage.user.getDeviceId(),
           storyDistributionListId: distributionList.id,
           timestamp,
-          type: 'story',
+          type: 'story'
         });
       })
     );

From a6ebd47847c372678049eca78737edfb90cfc4b9 Mon Sep 17 00:00:00 2001
From: Philipp <philipp@f1ndus.de>
Date: Tue, 8 Apr 2025 12:50:30 +0200
Subject: [PATCH 4/4] eslint fixes

---
 ts/components/Lightbox.tsx   | 2 +-
 ts/util/sendEditedMessage.ts | 2 +-
 ts/util/sendStoryMessage.ts  | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx
index e0d5641a436..b0e770d1454 100644
--- a/ts/components/Lightbox.tsx
+++ b/ts/components/Lightbox.tsx
@@ -899,7 +899,7 @@ function LightboxHeader({
   item: ReadonlyDeep<MediaItemType>;
 }): JSX.Element {
   const { message } = item;
-  const conversation = getConversation(message.authorId ?? "");
+  const conversation = getConversation(message.authorId ?? '');
 
   const now = Date.now();
 
diff --git a/ts/util/sendEditedMessage.ts b/ts/util/sendEditedMessage.ts
index 9d2ac4332d5..401befa33cf 100644
--- a/ts/util/sendEditedMessage.ts
+++ b/ts/util/sendEditedMessage.ts
@@ -192,7 +192,7 @@ export async function sendEditedMessage(
     sendStateByConversationId,
     sent_at: timestamp,
     timestamp,
-    type: 'outgoing'
+    type: 'outgoing',
   };
 
   // Takes care of putting the message in the edit history, replacing the
diff --git a/ts/util/sendStoryMessage.ts b/ts/util/sendStoryMessage.ts
index a0ca90f9c9b..fd3dd944cc9 100644
--- a/ts/util/sendStoryMessage.ts
+++ b/ts/util/sendStoryMessage.ts
@@ -173,7 +173,7 @@ export async function sendStoryMessage(
         // Note: we use the same sent_at for these messages because we want de-duplication
         //   on the receiver side.
         return window.Signal.Migrations.upgradeMessageSchema({
-          authorId: "",
+          authorId: '',
           attachments,
           bodyRanges,
           conversationId: ourConversation.id,
@@ -192,7 +192,7 @@ export async function sendStoryMessage(
           sourceDevice: window.textsecure.storage.user.getDeviceId(),
           storyDistributionListId: distributionList.id,
           timestamp,
-          type: 'story'
+          type: 'story',
         });
       })
     );