From b9b070f849567d0327ccc2f7d402be8e76259ec0 Mon Sep 17 00:00:00 2001
From: ihor-romaniuk <ihor.romaniuk@raccoongang.com>
Date: Fri, 28 Aug 2026 15:34:39 +0200
Subject: [PATCH 1/2] fix: restore the space between "By" and the sort option
 in galleries

The gallery sort control reads "Bynewest" instead of "By newest". The space
lived in a literal JSX text node, and dprint stripped it in #2997 when it
replaced eslint. An expression container survives formatting.

The existing tests match on the accessible name, which the accname algorithm
space-joins across elements, so they never saw the missing space.
---
 src/editors/sharedComponents/SelectionModal/SearchSort.jsx   | 2 +-
 .../sharedComponents/SelectionModal/SearchSort.test.jsx      | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/editors/sharedComponents/SelectionModal/SearchSort.jsx b/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
index 273d552019..85ced8301a 100644
--- a/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
+++ b/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
@@ -71,7 +71,7 @@ const SearchSort = ({
           >
             <span className="search-sort-menu-by">
               <FormattedMessage {...messages.sortBy} />
-              <span style={{ whiteSpace: 'pre-wrap' }}></span>
+              <span style={{ whiteSpace: 'pre-wrap' }}>{' '}</span>
             </span>
             <FormattedMessage {...sortMessages[key]} />
           </MenuItem>
diff --git a/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx b/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
index 5c8c2580b6..5af337b785 100644
--- a/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
+++ b/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
@@ -71,6 +71,11 @@ describe('SearchSort component', () => {
           .toBeInTheDocument();
       });
   });
+  test('separates "By" from the sort option', () => {
+    getComponent();
+    expect(screen.getByRole('button', { name: /By oldest/i }))
+      .toHaveTextContent('By oldest');
+  });
   test('adds a filter option for each filter key', () => {
     const { getByTestId } = getComponent();
     fireEvent.click(getByTestId('dropdown-filter'));

From 46e651f9b791c00b2bb94f3495046e160c38efa8 Mon Sep 17 00:00:00 2001
From: ihor-romaniuk <ihor.romaniuk@raccoongang.com>
Date: Fri, 28 Aug 2026 15:34:39 +0200
Subject: [PATCH 2/2] fix: keep the gallery sort menu inside the modal

SelectMenu hard-codes a bottom-start placement and its menu is 19rem wide,
so in the image gallery the open menu hung 138px past the modal's right edge
and gave the modal a horizontal scrollbar. Anchor it to the toggle's other
edge instead.
---
 src/editors/sharedComponents/SelectionModal/index.scss | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/editors/sharedComponents/SelectionModal/index.scss b/src/editors/sharedComponents/SelectionModal/index.scss
index 19d975b22f..931a94d2fb 100644
--- a/src/editors/sharedComponents/SelectionModal/index.scss
+++ b/src/editors/sharedComponents/SelectionModal/index.scss
@@ -38,3 +38,9 @@
     max-width: 100%;
     max-height: 100%;
 }
+
+/* The sort menu is wider than its toggle; anchor it right so it stays inside the modal. */
+.search-sort-menu .pgn__menu-select-popup > div {
+    left: auto !important;
+    right: 0 !important;
+}