Better reaction layout outside of a bubble.

Telegram/SourceFiles/history/view/history_view_element.cpp

@@ -1025,6 +1025,10 @@ Reactions::ButtonParameters Element::reactionButtonParameters(
 	return {};
 }
 
+int Element::reactionsOptimalWidth() const {
+	return 0;
+}
+
 void Element::clickHandlerActiveChanged(
 		const ClickHandlerPtr &handler,
 		bool active) {

Telegram/SourceFiles/history/view/history_view_element.h

@@ -335,6 +335,7 @@ public:
 	[[nodiscard]] virtual auto reactionButtonParameters(
 		QPoint position,
 		const TextState &reactionState) const -> Reactions::ButtonParameters;
+	[[nodiscard]] virtual int reactionsOptimalWidth() const;
 
 	// ClickHandlerHost interface.
 	void clickHandlerActiveChanged(

Telegram/SourceFiles/history/view/history_view_message.cpp

@@ -2019,6 +2019,10 @@ Reactions::ButtonParameters Message::reactionButtonParameters(
 	return result;
 }
 
+int Message::reactionsOptimalWidth() const {
+	return _reactions ? _reactions->countNiceWidth() : 0;
+}
+
 void Message::drawInfo(
 		Painter &p,
 		const PaintContext &context,

Telegram/SourceFiles/history/view/history_view_message.h

@@ -91,6 +91,7 @@ public:
 	Reactions::ButtonParameters reactionButtonParameters(
 		QPoint position,
 		const TextState &reactionState) const override;
+	int reactionsOptimalWidth() const override;
 
 	bool hasHeavyPart() const override;
 	void unloadHeavyPart() override;

Telegram/SourceFiles/history/view/history_view_reactions.cpp

@@ -26,6 +26,7 @@ namespace {
 constexpr auto kInNonChosenOpacity = 0.12;
 constexpr auto kOutNonChosenOpacity = 0.18;
 constexpr auto kMaxRecentUserpics = 3;
+constexpr auto kMaxNicePerRow = 5;
 
 [[nodiscard]] QColor AdaptChosenServiceFg(QColor serviceBg) {
 	serviceBg.setAlpha(std::max(serviceBg.alpha(), 192));
@@ -225,6 +226,25 @@ QSize InlineList::countCurrentSize(int newWidth) {
 	return { newWidth, height + add };
 }
 
+int InlineList::countNiceWidth() const {
+	const auto count = _data.reactions.size();
+	const auto rows = (count + kMaxNicePerRow - 1) / kMaxNicePerRow;
+	const auto columns = (count + rows - 1) / rows;
+	const auto between = st::reactionInlineBetween;
+	auto result = 0;
+	auto inrow = 0;
+	auto x = 0;
+	for (auto &button : _buttons) {
+		if (inrow++ >= columns) {
+			x = 0;
+			inrow = 0;
+		}
+		x += button.geometry.width() + between;
+		accumulate_max(result, x - between);
+	}
+	return result;
+}
+
 void InlineList::flipToRight() {
 	for (auto &button : _buttons) {
 		button.geometry.moveLeft(

Telegram/SourceFiles/history/view/history_view_reactions.h

@@ -55,6 +55,7 @@ public:
 
 	void update(Data &&data, int availableWidth);
 	QSize countCurrentSize(int newWidth) override;
+	[[nodiscard]] int countNiceWidth() const;
 	[[nodiscard]] int placeAndResizeGetHeight(QRect available);
 	void flipToRight();
 

Telegram/SourceFiles/history/view/media/history_view_gif.cpp

@@ -180,6 +180,7 @@ QSize Gif::countOptimalSize() {
 			forwarded->create(via);
 		}
 		maxWidth += additionalWidth(via, reply, forwarded);
+		accumulate_max(maxWidth, _parent->reactionsOptimalWidth());
 	}
 	return { maxWidth, minHeight };
 }
@@ -232,6 +233,8 @@ QSize Gif::countCurrentSize(int newWidth) {
 			}
 		}
 	} else if (isSeparateRoundVideo()) {
+		accumulate_max(newWidth, _parent->reactionsOptimalWidth());
+
 		const auto item = _parent->data();
 		auto via = item->Get<HistoryMessageVia>();
 		auto reply = _parent->displayedReply();
@@ -1191,9 +1194,10 @@ QRect Gif::contentRectForReactions() const {
 	const auto forwarded = item->Get<HistoryMessageForwarded>();
 	if (via || reply || forwarded) {
 		usew = maxWidth() - additionalWidth(via, reply, forwarded);
-		if (rightAligned) {
-			usex = width() - usew;
-		}
+	}
+	accumulate_max(usew, _parent->reactionsOptimalWidth());
+	if (rightAligned) {
+		usex = width() - usew;
 	}
 	if (rtl()) usex = width() - usex - usew;
 	return style::rtlrect(usex + paintx, painty, usew, painth, width());

Telegram/SourceFiles/history/view/media/history_view_media_unwrapped.cpp

@@ -57,6 +57,7 @@ QSize UnwrappedMedia::countOptimalSize() {
 		}
 		const auto additional = additionalWidth(via, reply, forwarded);
 		maxWidth += additional;
+		accumulate_max(maxWidth, _parent->reactionsOptimalWidth());
 		if (const auto surrounding = surroundingInfo(via, reply, forwarded, additional - st::msgReplyPadding.left())) {
 			const auto infoHeight = st::msgDateImgPadding.y() * 2
 				+ st::msgDateFont->height;
@@ -77,6 +78,7 @@ QSize UnwrappedMedia::countOptimalSize() {
 QSize UnwrappedMedia::countCurrentSize(int newWidth) {
 	const auto item = _parent->data();
 	accumulate_min(newWidth, maxWidth());
+	accumulate_max(newWidth, _parent->reactionsOptimalWidth());
 	const auto isPageAttach = (_parent->media() != this);
 	if (!isPageAttach) {
 		const auto via = item->Get<HistoryMessageVia>();
@@ -416,9 +418,10 @@ QRect UnwrappedMedia::contentRectForReactions() const {
 	auto usew = maxWidth();
 	if (!inWebPage) {
 		usew -= additionalWidth(via, reply, forwarded);
-		if (rightAligned) {
-			usex = width() - usew;
-		}
+	}
+	accumulate_max(usew, _parent->reactionsOptimalWidth());
+	if (rightAligned) {
+		usex = width() - usew;
 	}
 	if (rtl()) {
 		usex = width() - usex - usew;