fix

cms/version.py

@@ -1 +1 @@
-VERSION = "7.555.0"
+VERSION = "11.555.0"

files/views/media.py

@@ -200,6 +200,18 @@ class MediaList(APIView):
                 media = self._get_media_queryset(request)
                 already_sorted = True
 
+        if query:
+            query = helpers.clean_query(query)
+            q_parts = [q_part.rstrip("y") for q_part in query.split() if q_part not in STOP_WORDS]
+            if q_parts:
+                query = SearchQuery(q_parts[0] + ":*", search_type="raw")
+                for part in q_parts[1:]:
+                    query &= SearchQuery(part + ":*", search_type="raw")
+            else:
+                query = None
+        if query:
+            media = media.filter(search=query)
+
         if tag:
             media = media.filter(tags__title=tag)
 
@@ -222,9 +234,6 @@ class MediaList(APIView):
         if publish_state and publish_state in ['private', 'public', 'unlisted']:
             media = media.filter(state=publish_state)
 
-        if query:
-            media = media.filter(title__icontains=query)
-
         if not already_sorted:
             media = media.order_by(f"{ordering}{sort_by}")
 

frontend/src/static/js/components/profile-page/ProfilePage.scss

@@ -601,36 +601,54 @@
         }
 
         &.media-search {
+          display: flex !important;
+          align-items: center;
+
           > * {
             position: relative;
-            display: table;
+            display: flex;
-            float: left;
+            align-items: center;
             width: auto;
             height: 3rem;
 
             > span {
-              display: table-cell;
+              display: inline-flex;
-              vertical-align: middle;
+              align-items: center;
             }
           }
 
+          form {
+            display: flex;
+            align-items: center;
+          }
+
           button {
             background-color: transparent;
             background-color: rgba(0, 0, 0, 0);
           }
 
           input[type='text'] {
+            width: 178px;
             max-width: 178px;
-            padding-left: 0;
+            padding-left: 8px;
-            padding-right: 0;
+            padding-right: 8px;
             font-weight: 500;
             border-width: 0 0 2px;
+            border-color: var(--profile-page-nav-link-text-color);
             background-color: transparent;
             background-color: rgba(0, 0, 0, 0);
             box-shadow: none;
+            font-size: 14px;
+            color: var(--profile-page-nav-link-text-color);
+
+            &::placeholder {
+              color: var(--profile-page-nav-link-text-color);
+              opacity: 0.7;
+            }
 
             &:focus {
               border-bottom-color: var(--profile-page-nav-link-active-after-bg-color);
+              outline: none;
             }
           }
         }

frontend/src/static/js/components/profile-page/ProfilePagesHeader.js

@@ -25,6 +25,7 @@ class ProfileSearchBar extends React.PureComponent {
 
     this.updateTimeout = null;
     this.pendingUpdate = false;
+    this.justShown = false;
   }
 
   updateQuery(value) {
@@ -103,10 +104,15 @@ class ProfileSearchBar extends React.PureComponent {
   }
 
   onInputBlur() {
+    // Don't hide immediately after showing to prevent race condition
+    if (this.justShown) {
+      return;
+    }
     this.hideForm();
   }
 
   showForm() {
+    this.justShown = true;
     this.setState(
       {
         visibleForm: true,
@@ -115,6 +121,10 @@ class ProfileSearchBar extends React.PureComponent {
         if ('function' === typeof this.props.toggleSearchField) {
           this.props.toggleSearchField();
         }
+        // Reset the flag after a short delay
+        setTimeout(() => {
+          this.justShown = false;
+        }, 200);
       }
     );
   }

frontend/src/static/js/pages/ProfileMediaPage.js

@@ -868,15 +868,6 @@ export class ProfileMediaPage extends Page {
     const hasActiveTags = this.state.selectedTag && this.state.selectedTag !== 'all';
     const hasActiveSort = this.state.selectedSort && this.state.selectedSort !== 'date_added_desc';
 
-    console.log('Filter Debug:', {
-      filterArgs: this.state.filterArgs,
-      selectedTag: this.state.selectedTag,
-      selectedSort: this.state.selectedSort,
-      hasActiveFilters,
-      hasActiveTags,
-      hasActiveSort
-    });
-
     return [
       this.state.author ? (
         <ProfilePagesHeader