feat(market): embed offer photos inline instead of a media server

Replace the Blossom media-server approach with a fully decentralized one:
generate a small (~320px) JPEG thumbnail from the lot's cover photo and
embed it in the offer event as a data: URI, so photos ride the relays with
no server and no IP leak. The full photo stays in the encrypted inventory.

- offer_thumbnail.dart: downscale-until-it-fits data-URI builder + decoder
- market_widgets: render data: URIs from memory, http(s) URLs from network
- offers_cubit: publish a thumbnail (best-effort) in place of an upload
- drop MediaTransport/Blossom from commons_core (http/crypto deps) and the
  media-server setting; parked on branch parked/offer-photos-blossom

Relay event-size limits cap the image to a thumbnail; higher-res sharing
would need the parked Blossom path.
This commit is contained in:
vjrj 2026-07-10 21:27:59 +02:00
parent 5017ea51e0
commit 2b419e6516
24 changed files with 230 additions and 411 deletions

View file

@ -2,6 +2,7 @@ import 'package:commons_core/commons_core.dart';
import 'package:flutter/material.dart';
import '../i18n/strings.g.dart';
import '../services/offer_thumbnail.dart';
import 'theme.dart';
/// Human words for an offer's reciprocity mode. Shared by the market list and
@ -15,8 +16,9 @@ String offerTypeLabel(Translations t, OfferType type) => switch (type) {
};
/// A small square thumbnail of an offer's photo for the market list card.
/// Remote (published) image, so it degrades gracefully: a spinner while it
/// loads and a neutral placeholder when the media server can't be reached.
/// The image usually rides inline in the offer as a `data:` URI (decentralized,
/// no server), so it renders straight from memory; an `http(s)` URL is still
/// supported for interop and degrades gracefully (spinner, then placeholder).
class OfferThumbnail extends StatelessWidget {
const OfferThumbnail({
required this.url,
@ -33,23 +35,18 @@ class OfferThumbnail extends StatelessWidget {
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(10),
child: Image.network(
child: _offerImage(
url,
semanticLabel: semanticLabel,
width: size,
height: size,
fit: BoxFit.cover,
semanticLabel: semanticLabel,
loadingBuilder: (context, child, progress) => progress == null
? child
: _OfferImagePlaceholder(size: size, loading: true),
errorBuilder: (context, _, _) => _OfferImagePlaceholder(size: size),
),
);
}
}
/// Full-width "hero" image atop the offer detail page. Same graceful
/// degradation as [OfferThumbnail]; hidden entirely when the offer has no photo.
/// Full-width "hero" image atop the offer detail page. Same source handling as
/// [OfferThumbnail]; hidden entirely when the offer has no photo.
class OfferHeroImage extends StatelessWidget {
const OfferHeroImage({
required this.url,
@ -66,33 +63,61 @@ class OfferHeroImage extends StatelessWidget {
borderRadius: BorderRadius.circular(14),
child: AspectRatio(
aspectRatio: 4 / 3,
child: Image.network(
url,
fit: BoxFit.cover,
semanticLabel: semanticLabel,
loadingBuilder: (context, child, progress) => progress == null
? child
: const _OfferImagePlaceholder(loading: true),
errorBuilder: (context, _, _) => const _OfferImagePlaceholder(),
),
child: _offerImage(url, semanticLabel: semanticLabel),
),
);
}
}
/// Neutral fill shown while a remote offer image loads or when it can't be
/// fetched a marketplace is useless if a broken image blocks the card.
class _OfferImagePlaceholder extends StatelessWidget {
const _OfferImagePlaceholder({this.size, this.loading = false});
/// Renders an offer image from either an inline `data:` URI (via memory) or a
/// remote URL (via network), always cropping to fill and falling back to a
/// neutral placeholder a broken image must never block the card.
Widget _offerImage(
String url, {
required String semanticLabel,
double? width,
double? height,
}) {
final inline = decodeDataUri(url);
if (inline != null) {
return Image.memory(
inline,
width: width,
height: height,
fit: BoxFit.cover,
semanticLabel: semanticLabel,
errorBuilder: (context, _, _) =>
_OfferImagePlaceholder(width: width, height: height),
);
}
return Image.network(
url,
width: width,
height: height,
fit: BoxFit.cover,
semanticLabel: semanticLabel,
loadingBuilder: (context, child, progress) => progress == null
? child
: _OfferImagePlaceholder(width: width, height: height, loading: true),
errorBuilder: (context, _, _) =>
_OfferImagePlaceholder(width: width, height: height),
);
}
final double? size;
/// Neutral fill shown while a remote offer image loads or when it can't be
/// decoded/fetched a marketplace is useless if a broken image blocks the card.
class _OfferImagePlaceholder extends StatelessWidget {
const _OfferImagePlaceholder({this.width, this.height, this.loading = false});
final double? width;
final double? height;
final bool loading;
@override
Widget build(BuildContext context) {
return Container(
width: size,
height: size,
width: width,
height: height,
color: seedPrimaryContainer.withValues(alpha: 0.4),
alignment: Alignment.center,
child: loading