Federate images attached to microblog posts/replies

[aaronliu0130]

Requirements

• Is this a feature request? For questions or discussions use https://lemmy.ml/c/lemmy_support
• Did you check to see if this issue already exists?
• Is this only a feature request? Do not put multiple feature requests in one issue.
• Is this a backend issue? Use the lemmy-ui repo for UI / frontend issues.
• Do you agree to follow the rules in our Code of Conduct?

Is your proposal related to a problem?

Platforms such as Mastodon and Mbin give the ability to attach images to a comment (along with their alt text). This currently does not federate. Currently, comments that solely consist of an attached image will show up as blank on Lemmy instances.

An example is https://kbin.melroy.org/m/196@lemmy.blahaj.zone/t/383864/poggers/comment/3463931#entry-comment-3463931; I had to re-embed the image in markdown form after attaching it correctly. Opening the comment under a Lemmy instance, only the image embedded in markdown form is shown.

Describe the solution you'd like.

Add support for displaying such embedded images by putting the image at the top or bottom of a post.

Describe alternatives you've considered.

Have mbin and mastodon federate the images differently, which would have them display them differently within their own platforms as well.

Additional context

This issue was filed here after being recommended to do so by MbinOrg/mbin#978.

[aaronliu0130]

Upon review, I'm not sure whether this is a backend issue. My initial thought was that this is something that should be pre-processed before being sent to the UI, but maybe the backend already sends every piece of data to the UI. In that case, apologies.

[Nothing4You]

It's definitely a backend topic, likely a ui issue once implemented in the backend.

The comment returned by the API (viewed from a Lemmy instance) looks like this:

Click to expand

{
  "id": 13743340,
  "creator_id": 9786791,
  "post_id": 38585314,
  "content": "![A close-up of the Chinese boy on the left, upscaled by a factor of 4. This results in \"noise reduction\" and this boy having a neck as wide as a pencil with a solemn look.](https://lemm.ee/api/v3/image_proxy?url=https%3A%2F%2Fkbin.melroy.org%2Fmedia%2Fcache%2Fpost_thumb%2F61%2F37%2F6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png.webp)",
  "removed": false,
  "published": "2024-08-02T17:38:09Z",
  "deleted": false,
  "ap_id": "https://kbin.melroy.org/m/196@lemmy.blahaj.zone/t/383864/-/comment/3463931",
  "local": false,
  "path": "0.13730745.13731596.13740536.13743340",
  "distinguished": false,
  "language_id": 0
}

The original comment activity from kbin looks like this:

Click to expand

{
  "@context": [
    "https://www.w3.org/ns/activitystreams",
    "https://kbin.melroy.org/contexts"
  ],
  "id": "https://kbin.melroy.org/m/196@lemmy.blahaj.zone/t/383864/-/comment/3463931",
  "type": "Note",
  "attributedTo": "https://kbin.melroy.org/u/Aatube",
  "inReplyTo": "https://midwest.social/comment/11411381",
  "to": [
    "https://www.w3.org/ns/activitystreams#Public",
    "https://sopuli.xyz/u/jabathekek",
    "https://sh.itjust.works/u/YungOnions",
    "https://midwest.social/u/androogee"
  ],
  "cc": [
    "https://lemmy.blahaj.zone/c/196",
    "https://kbin.melroy.org/u/Aatube/followers"
  ],
  "sensitive": false,
  "content": "<p><img src=\"https://kbin.melroy.org/media/cache/post_thumb/61/37/6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png.webp\" alt=\"A close-up of the Chinese boy on the left, upscaled by a factor of 4. This results in &quot;noise reduction&quot; and this boy having a neck as wide as a pencil with a solemn look.\" /></p>\n",
  "mediaType": "text/html",
  "source": {
    "content": "![A close-up of the Chinese boy on the left, upscaled by a factor of 4. This results in \"noise reduction\" and this boy having a neck as wide as a pencil with a solemn look.](https://kbin.melroy.org/media/cache/post_thumb/61/37/6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png.webp)",
    "mediaType": "text/markdown"
  },
  "url": "https://kbin.melroy.org/m/196@lemmy.blahaj.zone/t/383864/-/comment/3463931",
  "tag": [
    {
      "type": "Mention",
      "href": "https://sopuli.xyz/u/jabathekek",
      "name": "@jabathekek@sopuli.xyz"
    },
    {
      "type": "Mention",
      "href": "https://sh.itjust.works/u/YungOnions",
      "name": "@YungOnions@sh.itjust.works"
    },
    {
      "type": "Mention",
      "href": "https://midwest.social/u/androogee",
      "name": "@androogee@midwest.social"
    }
  ],
  "published": "2024-08-02T19:38:09+02:00",
  "contentMap": {
    "en": "<p><img src=\"https://kbin.melroy.org/media/cache/post_thumb/61/37/6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png.webp\" alt=\"A close-up of the Chinese boy on the left, upscaled by a factor of 4. This results in &quot;noise reduction&quot; and this boy having a neck as wide as a pencil with a solemn look.\" /></p>\n"
  },
  "attachment": [
    {
      "type": "Image",
      "mediaType": "image/png",
      "url": "https://kbin.melroy.org/media/61/37/6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png",
      "name": "A close-up of the Chinese boy on the left, upscaled by a factor of 4. This results in \"noise reduction\" and this boy having a neck as wide as a pencil with a solemn look.",
      "blurhash": "L5B3BEGF5Z}[0z#9%3E*@_X-?FVs",
      "focalPoint": [
        0,
        0
      ],
      "width": 1644,
      "height": 1820
    }
  ],
  "image": {
    "type": "Image",
    "url": "https://kbin.melroy.org/media/61/37/6137ddcd791bd5ecd88b9ede720f748cf04489ce12d77101053834f2b3c0c7dd.png"
  }
}

[Nutomic]

Sounds like a duplicate of #2456