Add search to channel / supergroup recent actions.

Telegram/Resources/langs/lang.strings

@@ -1326,9 +1326,10 @@ Copyright (c) 2014-2017 John Preston, https://desktop.telegram.org
 "lng_admin_log_filter_all_admins" = "All users and admins";
 "lng_admin_log_about" = "What is this?";
 "lng_admin_log_about_text" = "This is a list of all service actions taken by the group's members and admins in the last 48 hours.";
-"lng_admin_log_no_results_title" = "No events found";
+"lng_admin_log_no_results_title" = "No actions found";
-"lng_admin_log_no_results_text" = "No recent events that match your query have been found.";
+"lng_admin_log_no_results_text" = "No recent actions that match your query have been found.";
-"lng_admin_log_no_events_title" = "No events yet";
+"lng_admin_log_no_results_search_text" = "No recent actions that contain '{query}' have been found.";
+"lng_admin_log_no_events_title" = "No actions yet";
 "lng_admin_log_no_events_text" = "There were no service actions\ntaken by the group's members\nand admins in the last 48 hours.";
 
 "lng_admin_log_empty_text" = "Empty";

Telegram/SourceFiles/dialogs/dialogs.style

@@ -110,8 +110,6 @@ dialogsCalendar: IconButton {
 
 dialogsFilter: FlatInput(defaultFlatInput) {
 	font: font(fsize);
-	phColor: placeholderFg;
-	phFocusColor: placeholderFgActive;
 
 	width: 240px;
 	height: 32px;

Telegram/SourceFiles/history/history.style

@@ -446,3 +446,40 @@ historyVideoMessageProgressOpacity: 0.72;
 
 historyAdminLogEmptyWidth: 260px;
 historyAdminLogEmptyPadding: margins(10px, 12px, 10px, 12px);
+historyAdminLogSearchField: FlatInput(defaultFlatInput) {
+	textColor: windowFg;
+	bgColor: topBarBg;
+	bgActive: topBarBg;
+
+	font: font(fsize);
+
+	borderWidth: 0px;
+	borderColor: topBarBg;
+	borderActive: topBarBg;
+
+	width: 100px;
+	height: 32px;
+	textMrg: margins(0px, 0px, 0px, 0px);
+}
+historyAdminLogCancelSearch: CrossButton {
+	width: 40px;
+	height: 54px;
+
+	cross: CrossAnimation {
+		size: 36px;
+		skip: 10px;
+		stroke: 2px;
+		minScale: 0.3;
+	}
+	crossFg: menuIconFg;
+	crossFgOver: menuIconFgOver;
+	crossPosition: point(4px, 9px);
+
+	duration: 150;
+	loadingPeriod: 1000;
+	ripple: RippleAnimation(defaultRippleAnimation) {
+		color: windowBgOver;
+	}
+}
+historyAdminLogSearchTop: 11px;
+historyAdminLogSearchSlideDuration: 150;

Telegram/SourceFiles/history/history_admin_log_inner.cpp

@@ -199,11 +199,10 @@ void InnerWidget::enumerateDates(Method method) {
 	enumerateItems<EnumItemsDirection::BottomToTop>(dateCallback);
 }
 
-InnerWidget::InnerWidget(QWidget *parent, gsl::not_null<Window::Controller*> controller, gsl::not_null<ChannelData*> channel, base::lambda<void(int top)> scrollTo) : TWidget(parent)
+InnerWidget::InnerWidget(QWidget *parent, gsl::not_null<Window::Controller*> controller, gsl::not_null<ChannelData*> channel) : TWidget(parent)
 , _controller(controller)
 , _channel(channel)
 , _history(App::history(channel))
-, _scrollTo(std::move(scrollTo))
 , _scrollDateCheck([this] { scrollDateCheck(); })
 , _emptyText(st::historyAdminLogEmptyWidth - st::historyAdminLogEmptyPadding.left() - st::historyAdminLogEmptyPadding.left()) {
 	setMouseTracking(true);
@@ -313,7 +312,21 @@ void InnerWidget::checkPreloadMore() {
 }
 
 void InnerWidget::applyFilter(FilterValue &&value) {
-	_filter = value;
+	if (_filter != value) {
+		_filter = value;
+		clearAndRequestLog();
+	}
+}
+
+void InnerWidget::applySearch(const QString &query) {
+	auto clearQuery = query.trimmed();
+	if (_searchQuery != query) {
+		_searchQuery = query;
+		clearAndRequestLog();
+	}
+}
+
+void InnerWidget::clearAndRequestLog() {
 	request(base::take(_preloadUpRequestId)).cancel();
 	request(base::take(_preloadDownRequestId)).cancel();
 	_filterChanged = true;
@@ -325,11 +338,15 @@ void InnerWidget::applyFilter(FilterValue &&value) {
 
 void InnerWidget::updateEmptyText() {
 	auto options = _defaultOptions;
-	options.flags |= TextParseMono; // For italic :/
+	options.flags |= TextParseMono; // For bold :/
+	auto hasSearch = !_searchQuery.isEmpty();
 	auto hasFilter = (_filter.flags != 0) || !_filter.allUsers;
-	auto text = TextWithEntities { lang(hasFilter ? lng_admin_log_no_results_title : lng_admin_log_no_events_title) };
+	auto text = TextWithEntities { lang((hasSearch || hasFilter) ? lng_admin_log_no_results_title : lng_admin_log_no_events_title) };
 	text.entities.append(EntityInText(EntityInTextBold, 0, text.text.size()));
-	text.text.append(qstr("\n\n") + lang(hasFilter ? lng_admin_log_no_results_text : lng_admin_log_no_events_text));
+	auto description = hasSearch
+		? lng_admin_log_no_results_search_text(lt_query, textClean(_searchQuery))
+		: lang(hasFilter ? lng_admin_log_no_results_text : lng_admin_log_no_events_text);
+	text.text.append(qstr("\n\n") + description);
 	_emptyText.setMarkedText(st::defaultTextStyle, text, options);
 }
 
@@ -357,6 +374,7 @@ QPoint InnerWidget::tooltipPos() const {
 
 void InnerWidget::saveState(gsl::not_null<SectionMemento*> memento) {
 	memento->setFilter(std::move(_filter));
+	memento->setSearchQuery(std::move(_searchQuery));
 	if (!_filterChanged) {
 		memento->setItems(std::move(_items), std::move(_itemsByIds), _upLoaded, _downLoaded);
 		memento->setIdManager(std::move(_idManager));
@@ -369,6 +387,7 @@ void InnerWidget::restoreState(gsl::not_null<SectionMemento*> memento) {
 	_itemsByIds = memento->takeItemsByIds();
 	_idManager = memento->takeIdManager();
 	_filter = memento->takeFilter();
+	_searchQuery = memento->takeSearchQuery();
 	_upLoaded = memento->upLoaded();
 	_downLoaded = memento->downLoaded();
 	_filterChanged = false;
@@ -398,11 +417,10 @@ void InnerWidget::preloadMore(Direction direction) {
 		}
 		flags |= MTPchannels_GetAdminLog::Flag::f_admins;
 	}
-	auto query = QString();
 	auto maxId = (direction == Direction::Up) ? _minId : 0;
 	auto minId = (direction == Direction::Up) ? 0 : _maxId;
 	auto perPage = _items.empty() ? kEventsFirstPage : kEventsPerPage;
-	requestId = request(MTPchannels_GetAdminLog(MTP_flags(flags), _channel->inputChannel, MTP_string(query), filter, MTP_vector<MTPInputUser>(admins), MTP_long(maxId), MTP_long(minId), MTP_int(perPage))).done([this, &requestId, &loadedFlag, direction](const MTPchannels_AdminLogResults &result) {
+	requestId = request(MTPchannels_GetAdminLog(MTP_flags(flags), _channel->inputChannel, MTP_string(_searchQuery), filter, MTP_vector<MTPInputUser>(admins), MTP_long(maxId), MTP_long(minId), MTP_int(perPage))).done([this, &requestId, &loadedFlag, direction](const MTPchannels_AdminLogResults &result) {
 		Expects(result.type() == mtpc_channels_adminLogResults);
 		requestId = 0;
 
@@ -513,7 +531,7 @@ int InnerWidget::resizeGetHeight(int newWidth) {
 
 void InnerWidget::restoreScrollPosition() {
 	auto newVisibleTop = _visibleTopItem ? (itemTop(_visibleTopItem) + _visibleTopFromItem) : ScrollMax;
-	_scrollTo(newVisibleTop);
+	scrollToSignal.notify(newVisibleTop, true);
 }
 
 void InnerWidget::paintEvent(QPaintEvent *e) {
@@ -635,8 +653,8 @@ TextWithEntities InnerWidget::getSelectedText() const {
 }
 
 void InnerWidget::keyPressEvent(QKeyEvent *e) {
-	if (e->key() == Qt::Key_Escape && _cancelledCallback) {
+	if (e->key() == Qt::Key_Escape || e->key() == Qt::Key_Back) {
-		_cancelledCallback();
+		cancelledSignal.notify(true);
 	} else if (e == QKeySequence::Copy && _selectedItem != nullptr) {
 		copySelectedText();
 #ifdef Q_OS_MAC

Telegram/SourceFiles/history/history_admin_log_inner.h

@@ -40,7 +40,11 @@ class SectionMemento;
 
 class InnerWidget final : public TWidget, public Ui::AbstractTooltipShower, private MTP::Sender, private base::Subscriber {
 public:
-	InnerWidget(QWidget *parent, gsl::not_null<Window::Controller*> controller, gsl::not_null<ChannelData*> channel, base::lambda<void(int top)> scrollTo);
+	InnerWidget(QWidget *parent, gsl::not_null<Window::Controller*> controller, gsl::not_null<ChannelData*> channel);
+
+	base::Observable<void> showSearchSignal;
+	base::Observable<int> scrollToSignal;
+	base::Observable<void> cancelledSignal;
 
 	gsl::not_null<ChannelData*> channel() const {
 		return _channel;
@@ -59,15 +63,13 @@ public:
 
 	void saveState(gsl::not_null<SectionMemento*> memento);
 	void restoreState(gsl::not_null<SectionMemento*> memento);
-	void setCancelledCallback(base::lambda<void()> callback) {
-		_cancelledCallback = std::move(callback);
-	}
 
 	// Empty "flags" means all events.
 	void applyFilter(FilterValue &&value);
 	FilterValue filter() const {
 		return _filter;
 	}
+	void applySearch(const QString &query);
 
 	// AbstractTooltipShower interface
 	QString tooltipText() const override;
@@ -139,6 +141,7 @@ private:
 	void updateEmptyText();
 	void paintEmpty(Painter &p);
 	void clearAfterFilterChange();
+	void clearAndRequestLog();
 
 	void toggleScrollDateShown();
 	void repaintScrollDateCallback();
@@ -174,8 +177,6 @@ private:
 	gsl::not_null<Window::Controller*> _controller;
 	gsl::not_null<ChannelData*> _channel;
 	gsl::not_null<History*> _history;
-	base::lambda<void()> _cancelledCallback;
-	base::lambda<void(int top)> _scrollTo;
 	std::vector<HistoryItemOwned> _items;
 	std::map<uint64, HistoryItem*> _itemsByIds;
 	int _itemsTop = 0;
@@ -230,6 +231,7 @@ private:
 	ClickHandlerPtr _contextMenuLink;
 
 	FilterValue _filter;
+	QString _searchQuery;
 
 };
 

Telegram/SourceFiles/history/history_admin_log_section.cpp

@@ -28,11 +28,13 @@ Copyright (c) 2014-2017 John Preston, https://desktop.telegram.org
 #include "ui/widgets/scroll_area.h"
 #include "ui/widgets/shadow.h"
 #include "ui/widgets/buttons.h"
+#include "ui/widgets/input_fields.h"
 #include "mainwidget.h"
 #include "mainwindow.h"
 #include "apiwrap.h"
 #include "window/themes/window_theme.h"
 #include "boxes/confirm_box.h"
+#include "base/timer.h"
 #include "lang/lang_keys.h"
 
 namespace AdminLog {
@@ -42,7 +44,11 @@ constexpr auto kMaxChannelAdmins = 200;
 
 class FixedBar final : public TWidget, private base::Subscriber {
 public:
-	FixedBar(QWidget *parent, gsl::not_null<ChannelData*> channel, base::lambda<void()> showFilterCallback);
+	FixedBar(QWidget *parent, gsl::not_null<ChannelData*> channel);
+
+	base::Observable<void> showFilterSignal;
+	base::Observable<void> searchCancelledSignal;
+	base::Observable<QString> searchSignal;
 
 	// When animating mode is enabled the content is hidden and the
 	// whole fixed bar acts like a back button.
@@ -50,6 +56,14 @@ public:
 
 	void applyFilter(const FilterValue &value);
 	void goBack();
+	void showSearch();
+	bool setSearchFocus() {
+		if (_searchShown) {
+			_field->setFocus();
+			return true;
+		}
+		return false;
+	}
 
 protected:
 	void mousePressEvent(QMouseEvent *e) override;
@@ -57,11 +71,23 @@ protected:
 	int resizeGetHeight(int newWidth) override;
 
 private:
+	void toggleSearch();
+	void cancelSearch();
+	void searchUpdated();
+	void applySearch();
+	void searchAnimationCallback();
+
 	gsl::not_null<ChannelData*> _channel;
+	object_ptr<Ui::FlatInput> _field;
 	object_ptr<Profile::BackButton> _backButton;
+	object_ptr<Ui::IconButton> _search;
+	object_ptr<Ui::CrossButton> _cancel;
 	object_ptr<Ui::RoundButton> _filter;
 
+	Animation _searchShownAnimation;
+	bool _searchShown = false;
 	bool _animatingMode = false;
+	base::Timer _searchTimer;
 
 };
 
@@ -71,13 +97,25 @@ object_ptr<Window::SectionWidget> SectionMemento::createWidget(QWidget *parent,
 	return std::move(result);
 }
 
-FixedBar::FixedBar(QWidget *parent, gsl::not_null<ChannelData*> channel, base::lambda<void()> showFilterCallback) : TWidget(parent)
+FixedBar::FixedBar(QWidget *parent, gsl::not_null<ChannelData*> channel) : TWidget(parent)
 , _channel(channel)
+, _field(this, st::historyAdminLogSearchField, langFactory(lng_dlg_filter))
 , _backButton(this, lang(lng_admin_log_title_all))
+, _search(this, st::topBarSearch)
+, _cancel(this, st::historyAdminLogCancelSearch)
 , _filter(this, langFactory(lng_admin_log_filter), st::topBarButton) {
 	_backButton->moveToLeft(0, 0);
 	_backButton->setClickedCallback([this] { goBack(); });
-	_filter->setClickedCallback([this, showFilterCallback] { showFilterCallback(); });
+	_filter->setClickedCallback([this] { showFilterSignal.notify(); });
+	_search->setClickedCallback([this] { showSearch(); });
+	_cancel->setClickedCallback([this] { cancelSearch(); });
+	_field->hide();
+	connect(_field, &Ui::FlatInput::cancelled, this, [this] { cancelSearch(); });
+	connect(_field, &Ui::FlatInput::changed, this, [this] { searchUpdated(); });
+	connect(_field, &Ui::FlatInput::submitted, this, [this] { applySearch(); });
+	_searchTimer.setCallback([this] { applySearch(); });
+
+	_cancel->hideFast();
 }
 
 void FixedBar::applyFilter(const FilterValue &value) {
@@ -89,14 +127,78 @@ void FixedBar::goBack() {
 	App::main()->showBackFromStack();
 }
 
-int FixedBar::resizeGetHeight(int newWidth) {
+void FixedBar::showSearch() {
-	auto newHeight = 0;
+	if (!_searchShown) {
+		toggleSearch();
+	}
+}
 
-	auto buttonLeft = newWidth;
+void FixedBar::toggleSearch() {
-	buttonLeft -= _filter->width(); _filter->moveToLeft(buttonLeft, 0);
+	_searchShown = !_searchShown;
-	_backButton->resizeToWidth(buttonLeft);
+	_cancel->toggleAnimated(_searchShown);
+	_searchShownAnimation.start([this] { searchAnimationCallback(); }, _searchShown ? 0. : 1., _searchShown ? 1. : 0., st::historyAdminLogSearchSlideDuration);
+	_search->setDisabled(_searchShown);
+	if (_searchShown) {
+		_field->show();
+		_field->setFocus();
+	} else {
+		searchCancelledSignal.notify(true);
+	}
+}
+
+void FixedBar::searchAnimationCallback() {
+	if (!_searchShownAnimation.animating()) {
+		_field->setVisible(_searchShown);
+		_search->setIconOverride(_searchShown ? &st::topBarSearch.icon : nullptr, _searchShown ? &st::topBarSearch.icon : nullptr);
+		_search->setRippleColorOverride(_searchShown ? &st::topBarBg : nullptr);
+		_search->setCursor(_searchShown ? style::cur_default : style::cur_pointer);
+	}
+	resizeToWidth(width());
+}
+
+void FixedBar::cancelSearch() {
+	if (_searchShown) {
+		if (!_field->getLastText().isEmpty()) {
+			_field->setText(QString());
+			_field->updatePlaceholder();
+			_field->setFocus();
+			applySearch();
+		} else {
+			toggleSearch();
+		}
+	}
+}
+
+void FixedBar::searchUpdated() {
+	if (_field->getLastText().isEmpty()) {
+		applySearch();
+	} else {
+		_searchTimer.callOnce(AutoSearchTimeout);
+	}
+}
+
+void FixedBar::applySearch() {
+	searchSignal.notify(_field->getLastText());
+}
+
+int FixedBar::resizeGetHeight(int newWidth) {
+	auto filterLeft = newWidth - _filter->width();
+	_filter->moveToLeft(filterLeft, 0);
+
+	auto cancelLeft = filterLeft - _cancel->width();
+	_cancel->moveToLeft(cancelLeft, 0);
+
+	auto searchShownLeft = st::topBarArrowPadding.left();
+	auto searchHiddenLeft = filterLeft - _search->width();
+	auto searchShown = _searchShownAnimation.current(_searchShown ? 1. : 0.);
+	auto searchCurrentLeft = anim::interpolate(searchHiddenLeft, searchShownLeft, searchShown);
+	_search->moveToLeft(searchCurrentLeft, 0);
+	_backButton->resizeToWidth(searchCurrentLeft);
 	_backButton->moveToLeft(0, 0);
-	newHeight += _backButton->height();
+
+	auto newHeight = _backButton->height();
+	auto fieldLeft = searchShownLeft + _search->width();
+	_field->setGeometryToLeft(fieldLeft, st::historyAdminLogSearchTop, cancelLeft - fieldLeft, _field->height());
 
 	return newHeight;
 }
@@ -111,6 +213,8 @@ void FixedBar::setAnimatingMode(bool enabled) {
 		} else {
 			setAttribute(Qt::WA_OpaquePaintEvent);
 			showChildren();
+			_field->hide();
+			_cancel->hide();
 		}
 		show();
 	}
@@ -133,23 +237,28 @@ void FixedBar::mousePressEvent(QMouseEvent *e) {
 
 Widget::Widget(QWidget *parent, gsl::not_null<Window::Controller*> controller, gsl::not_null<ChannelData*> channel) : Window::SectionWidget(parent, controller)
 , _scroll(this, st::historyScroll, false)
-, _fixedBar(this, channel, [this] { showFilter(); })
+, _fixedBar(this, channel)
 , _fixedBarShadow(this, st::shadowFg)
 , _whatIsThis(this, lang(lng_admin_log_about).toUpper(), st::historyComposeButton) {
 	_fixedBar->move(0, 0);
 	_fixedBar->resizeToWidth(width());
+	subscribe(_fixedBar->showFilterSignal, [this] { showFilter(); });
+	subscribe(_fixedBar->searchCancelledSignal, [this] { setInnerFocus(); });
+	subscribe(_fixedBar->searchSignal, [this](const QString &query) { _inner->applySearch(query); });
 	_fixedBar->show();
 
 	_fixedBarShadow->raise();
 	updateAdaptiveLayout();
-	subscribe(Adaptive::Changed(), [this]() { updateAdaptiveLayout(); });
+	subscribe(Adaptive::Changed(), [this] { updateAdaptiveLayout(); });
 
-	_inner = _scroll->setOwnedWidget(object_ptr<InnerWidget>(this, controller, channel, [this](int top) { _scroll->scrollToY(top); }));
+	_inner = _scroll->setOwnedWidget(object_ptr<InnerWidget>(this, controller, channel));
+	subscribe(_inner->showSearchSignal, [this] { _fixedBar->showSearch(); });
+	subscribe(_inner->cancelledSignal, [this] { _fixedBar->goBack(); });
+	subscribe(_inner->scrollToSignal, [this](int top) { _scroll->scrollToY(top); });
 	_scroll->move(0, _fixedBar->height());
 	_scroll->show();
 
 	connect(_scroll, &Ui::ScrollArea::scrolled, this, [this] { onScroll(); });
-	_inner->setCancelledCallback([this] { _fixedBar->goBack(); });
 
 	_whatIsThis->setClickedCallback([this] { Ui::show(Box<InformBox>(lang(lng_admin_log_about_text))); });
 }
@@ -204,7 +313,9 @@ QPixmap Widget::grabForShowAnimation(const Window::SectionSlideParams &params) {
 }
 
 void Widget::doSetInnerFocus() {
-	_inner->setFocus();
+	if (!_fixedBar->setSearchFocus()) {
+		_inner->setFocus();
+	}
 }
 
 bool Widget::showInternal(gsl::not_null<Window::SectionMemento*> memento) {
@@ -223,6 +334,14 @@ void Widget::setInternalState(const QRect &geometry, gsl::not_null<SectionMement
 	restoreState(memento);
 }
 
+bool Widget::cmd_search() {
+	if (!inFocusChain()) {
+		return false;
+	}
+	_fixedBar->showSearch();
+	return true;
+}
+
 std::unique_ptr<Window::SectionMemento> Widget::createMemento() {
 	auto result = std::make_unique<SectionMemento>(channel());
 	saveState(result.get());

Telegram/SourceFiles/history/history_admin_log_section.h

@@ -52,6 +52,14 @@ struct FilterValue {
 	bool allUsers = true;
 };
 
+inline bool operator==(const FilterValue &a, const FilterValue &b) {
+	return (a.flags == b.flags && a.admins == b.admins && a.allUsers == b.allUsers);
+}
+
+inline bool operator!=(const FilterValue &a, const FilterValue &b) {
+	return !(a == b);
+}
+
 class LocalIdManager {
 public:
 	LocalIdManager() = default;
@@ -98,6 +106,8 @@ public:
 
 	void applyFilter(FilterValue &&value);
 
+	bool cmd_search() override;
+
 protected:
 	void resizeEvent(QResizeEvent *e) override;
 	void paintEvent(QPaintEvent *e) override;
@@ -155,6 +165,9 @@ public:
 	void setFilter(FilterValue &&filter) {
 		_filter = std::move(filter);
 	}
+	void setSearchQuery(QString &&query) {
+		_searchQuery = std::move(query);
+	}
 	void setIdManager(LocalIdManager &&manager) {
 		_idManager = std::move(manager);
 	}
@@ -176,6 +189,9 @@ public:
 	FilterValue takeFilter() {
 		return std::move(_filter);
 	}
+	QString takeSearchQuery() {
+		return std::move(_searchQuery);
+	}
 
 private:
 	gsl::not_null<ChannelData*> _channel;
@@ -187,6 +203,7 @@ private:
 	bool _downLoaded = true;
 	LocalIdManager _idManager;
 	FilterValue _filter;
+	QString _searchQuery;
 
 };
 

Telegram/SourceFiles/mainwidget.cpp

@@ -896,6 +896,9 @@ void MainWidget::notify_historyMuteUpdated(History *history) {
 
 bool MainWidget::cmd_search() {
 	if (Ui::isLayerShown() || Ui::isMediaViewShown()) return false;
+	if (_wideSection) {
+		return _wideSection->cmd_search();
+	}
 	return _history->cmd_search();
 }
 

Telegram/SourceFiles/overview/overview.style

@@ -137,8 +137,6 @@ overviewLinksChecked: icon {
 
 overviewFilter: FlatInput(defaultFlatInput) {
 	font: font(fsize);
-	phColor: placeholderFg;
-	phFocusColor: placeholderFgActive;
 	icon: fieldSearchIcon;
 
 	width: 240px;

Telegram/SourceFiles/window/section_widget.h

@@ -109,6 +109,11 @@ public:
 		doSetInnerFocus();
 	}
 
+	// Global shortcut handler. For now that ugly :(
+	virtual bool cmd_search() {
+		return false;
+	}
+
 protected:
 	void paintEvent(QPaintEvent *e) override;
 

Telegram/SourceFiles/window/themes/window_theme_preview.cpp

@@ -454,8 +454,10 @@ void Generator::paintTopBar() {
 	st::topBarMenuToggle.icon[_palette].paint(*_p, _topBar.x() + _topBar.width() - right + st::topBarMenuToggle.iconPosition.x(), _topBar.y() + st::topBarMenuToggle.iconPosition.y(), _rect.width());
 	right += st::topBarSearch.width;
 	st::topBarSearch.icon[_palette].paint(*_p, _topBar.x() + _topBar.width() - right + st::topBarSearch.iconPosition.x(), _topBar.y() + st::topBarSearch.iconPosition.y(), _rect.width());
+	right += st::topBarCallSkip + st::topBarCall.width;
+	st::topBarCall.icon[_palette].paint(*_p, _topBar.x() + _topBar.width() - right + st::topBarCall.iconPosition.x(), _topBar.y() + st::topBarCall.iconPosition.y(), _rect.width());
 
-	auto decreaseWidth = st::topBarSearch.width + st::topBarMenuToggle.width;
+	auto decreaseWidth = st::topBarCall.width + st::topBarCallSkip + st::topBarSearch.width + st::topBarMenuToggle.width;
 	auto nameleft = _topBar.x() + st::topBarArrowPadding.right();
 	auto nametop = _topBar.y() + st::topBarArrowPadding.top();
 	auto statustop = _topBar.y() + st::topBarHeight - st::topBarArrowPadding.bottom() - st::dialogsTextFont->height;

Telegram/SourceFiles/window/top_bar_widget.cpp

@@ -207,7 +207,7 @@ void TopBarWidget::paintEvent(QPaintEvent *e) {
 			decreaseWidth += _search->width();
 		}
 		if (!_call->isHidden()) {
-			decreaseWidth += _call->width();
+			decreaseWidth += st::topBarCallSkip + _call->width();
 		}
 		auto paintCounter = App::main()->paintTopBar(p, decreaseWidth, ms);
 		p.restore();
@@ -293,7 +293,7 @@ void TopBarWidget::updateControlsGeometry() {
 		right += _info->width();
 	}
 	_search->moveToRight(right, otherButtonsTop);
-	right += _search->width();
+	right += _search->width() + st::topBarCallSkip;
 	_call->moveToRight(right, otherButtonsTop);
 }
 

Telegram/SourceFiles/window/window.style

@@ -254,14 +254,14 @@ topBarClearButton: RoundButton(defaultLightButton) {
 	width: -18px;
 }
 topBarSearch: IconButton {
-	width: 44px;
+	width: 40px;
 	height: topBarHeight;
 
 	icon: icon {{ "title_search-flip_horizontal", menuIconFg }};
 	iconOver: icon {{ "title_search-flip_horizontal", menuIconFgOver }};
-	iconPosition: point(15px, 18px);
+	iconPosition: point(11px, 19px);
 
-	rippleAreaPosition: point(4px, 7px);
+	rippleAreaPosition: point(0px, 7px);
 	rippleAreaSize: 40px;
 	ripple: RippleAnimation(defaultRippleAnimation) {
 		color: windowBgOver;
@@ -271,7 +271,10 @@ topBarCall: IconButton(topBarSearch) {
 	icon: icon {{ "add_contact_phone", menuIconFg }};
 	iconOver: icon {{ "add_contact_phone", menuIconFgOver }};
 }
+topBarCallSkip: 4px;
 topBarMenuToggle: IconButton(topBarSearch) {
+	width: 44px;
+
 	icon: icon {{ "title_menu_dots", menuIconFg }};
 	iconOver: icon {{ "title_menu_dots", menuIconFgOver }};
 	iconPosition: point(16px, 17px);