fix: use closest attachment index for context menu download

ts/components/conversation/message/message-content/MessageContextMenu.tsx

@@ -80,9 +80,11 @@ export function showMessageContextMenu({
   // this is quite dirty but considering that we want the context menu of the message to show on click on the attachment
   // and the context menu save attachment item to save the right attachment I did not find a better way for now.
   // NOTE: If you change this, also make sure to update the `saveAttachment()`
-  const attachmentIndexStr = (event?.target as any)?.parentElement?.getAttribute?.(
-    'data-attachmentindex'
-  );
+  const target = event?.target;
+  const attachmentIndexStr =
+    target instanceof Element
+      ? target.closest('[data-attachmentindex]')?.getAttribute('data-attachmentindex')
+      : undefined;
   const attachmentIndex =
     isString(attachmentIndexStr) && !isNil(toNumber(attachmentIndexStr))
       ? toNumber(attachmentIndexStr)

ts/test/components/MessageContextMenu_test.tsx

@@ -0,0 +1,38 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import { expect } from 'chai';
+import Sinon from 'sinon';
+import { showMessageContextMenu } from '../../components/conversation/message/message-content/MessageContextMenu';
+import * as contextMenu from '../../util/contextMenu';
+
+describe('MessageContextMenu', () => {
+  afterEach(() => {
+    Sinon.restore();
+    document.body.innerHTML = '';
+  });
+
+  it('uses the nearest attachment index when right-clicking nested elements', () => {
+    const showStub = Sinon.stub(contextMenu, 'showContextMenu');
+
+    const attachmentWrapper = document.createElement('div');
+    attachmentWrapper.setAttribute('data-attachmentindex', '2');
+
+    const svg = document.createElement('svg');
+    const path = document.createElement('path');
+    svg.appendChild(path);
+    attachmentWrapper.appendChild(svg);
+    document.body.appendChild(attachmentWrapper);
+
+    showMessageContextMenu({
+      id: 'message-context-menu',
+      event: {
+        target: path,
+        clientX: 40,
+        clientY: 60,
+      } as any,
+    });
+
+    expect(showStub.calledOnce).to.equal(true);
+    const params = showStub.firstCall.args[0] as any;
+    expect((params.props as any)?.dataAttachmentIndex).to.equal(2);
+  });
+});