Enhancement: auto-hide the search bar on mobile

Bumps the uv group with 1 update in the / directory: [tinytag](https://github.com/tinytag/tinytag).


Updates `tinytag` from 2.2.0 to 2.2.1
- [Release notes](https://github.com/tinytag/tinytag/releases)
- [Commits](https://github.com/tinytag/tinytag/compare/2.2.0...2.2.1)

---
updated-dependencies:
- dependency-name: tinytag
  dependency-version: 2.2.1
  dependency-type: indirect
  dependency-group: uv
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

src-ui/src/app/components/app-frame/app-frame.component.html

@@ -1,7 +1,7 @@
 <nav class="navbar navbar-dark fixed-top bg-primary flex-md-nowrap p-0 shadow-sm">
   <button class="navbar-toggler d-md-none collapsed border-0" type="button" data-toggle="collapse"
     data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation"
-    (click)="isMenuCollapsed = !isMenuCollapsed">
+    (click)="mobileSearchHidden = false; isMenuCollapsed = !isMenuCollapsed">
     <span class="navbar-toggler-icon"></span>
   </button>
   <a class="navbar-brand d-flex align-items-center me-0 px-3 py-3 order-sm-0"
@@ -24,7 +24,8 @@
       }
     </div>
   </a>
-  <div class="search-container flex-grow-1 py-2 pb-3 pb-sm-2 px-3 ps-md-4 me-sm-auto order-3 order-sm-1">
+  <div class="search-container flex-grow-1 py-2 pb-3 pb-sm-2 px-3 ps-md-4 me-sm-auto order-3 order-sm-1"
+    [class.mobile-hidden]="mobileSearchHidden">
     <div class="col-12 col-md-7">
       <pngx-global-search></pngx-global-search>
     </div>
@@ -378,7 +379,7 @@
       </div>
     </nav>
 
-    <main role="main" class="ms-sm-auto px-md-4"
+    <main role="main" class="ms-sm-auto px-md-4" [class.mobile-search-hidden]="mobileSearchHidden"
       [ngClass]="slimSidebarEnabled ? 'col-slim' : 'col-md-9 col-lg-10 col-xxxl-11'">
       <router-outlet></router-outlet>
     </main>

src-ui/src/app/components/app-frame/app-frame.component.scss

@@ -44,6 +44,23 @@
   .sidebar {
     top: 3.5rem;
   }
+
+  .search-container {
+    max-height: 4.5rem;
+    overflow: hidden;
+    transition: max-height .2s ease, opacity .2s ease, padding-top .2s ease, padding-bottom .2s ease;
+
+    &.mobile-hidden {
+      max-height: 0;
+      opacity: 0;
+      padding-top: 0 !important;
+      padding-bottom: 0 !important;
+    }
+  }
+
+  main.mobile-search-hidden {
+    padding-top: 56px;
+  }
 }
 
 main {

src-ui/src/app/components/app-frame/app-frame.component.spec.ts

@@ -293,6 +293,58 @@ describe('AppFrameComponent', () => {
     expect(component.isMenuCollapsed).toBeTruthy()
   })
 
+  it('should hide mobile search when scrolling down and show it when scrolling up', () => {
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 767,
+    })
+
+    component.ngOnInit()
+
+    Object.defineProperty(window, 'scrollY', {
+      configurable: true,
+      value: 40,
+    })
+    component.onWindowScroll()
+    expect(component.mobileSearchHidden).toBe(true)
+
+    Object.defineProperty(window, 'scrollY', {
+      configurable: true,
+      value: 0,
+    })
+    component.onWindowScroll()
+    expect(component.mobileSearchHidden).toBe(false)
+  })
+
+  it('should keep mobile search visible on desktop scroll', () => {
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 768,
+    })
+    component.mobileSearchHidden = true
+
+    component.onWindowScroll()
+
+    expect(component.mobileSearchHidden).toBe(false)
+  })
+
+  it('should keep mobile search visible while the mobile menu is expanded', () => {
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 767,
+    })
+    component.ngOnInit()
+    component.isMenuCollapsed = false
+
+    Object.defineProperty(window, 'scrollY', {
+      configurable: true,
+      value: 40,
+    })
+    component.onWindowScroll()
+
+    expect(component.mobileSearchHidden).toBe(false)
+  })
+
   it('should support close document & navigate on close current doc', () => {
     const closeSpy = jest.spyOn(openDocumentsService, 'closeDocument')
     closeSpy.mockReturnValue(of(true))

src-ui/src/app/components/app-frame/app-frame.component.ts

@@ -94,6 +94,14 @@ export class AppFrameComponent
 
   slimSidebarAnimating: boolean = false
 
+  mobileSearchHidden: boolean = false
+
+  private lastScrollY: number = 0
+
+  private readonly mobileBreakpoint = 768
+
+  private readonly mobileSearchHideThreshold = 16
+
   constructor() {
     super()
     const permissionsService = this.permissionsService
@@ -111,6 +119,8 @@ export class AppFrameComponent
   }
 
   ngOnInit(): void {
+    this.lastScrollY = window.scrollY
+
     if (this.settingsService.get(SETTINGS_KEYS.UPDATE_CHECKING_ENABLED)) {
       this.checkForUpdates()
     }
@@ -263,6 +273,37 @@ export class AppFrameComponent
     return this.settingsService.get(SETTINGS_KEYS.AI_ENABLED)
   }
 
+  @HostListener('window:resize')
+  onWindowResize(): void {
+    if (!this.isMobileViewport()) {
+      this.mobileSearchHidden = false
+    }
+  }
+
+  @HostListener('window:scroll')
+  onWindowScroll(): void {
+    const currentScrollY = window.scrollY
+
+    if (!this.isMobileViewport() || this.isMenuCollapsed === false) {
+      this.mobileSearchHidden = false
+      this.lastScrollY = currentScrollY
+      return
+    }
+
+    const delta = currentScrollY - this.lastScrollY
+
+    if (currentScrollY <= 0 || delta < -this.mobileSearchHideThreshold) {
+      this.mobileSearchHidden = false
+    } else if (
+      currentScrollY > this.mobileSearchHideThreshold &&
+      delta > this.mobileSearchHideThreshold
+    ) {
+      this.mobileSearchHidden = true
+    }
+
+    this.lastScrollY = currentScrollY
+  }
+
   closeMenu() {
     this.isMenuCollapsed = true
   }
@@ -384,4 +425,8 @@ export class AppFrameComponent
       !this.settingsService.organizingSidebarSavedViews
     )
   }
+
+  private isMobileViewport(): boolean {
+    return window.innerWidth < this.mobileBreakpoint
+  }
 }

src-ui/src/app/components/document-list/document-list.component.scss

@@ -56,13 +56,20 @@ $paperless-card-breakpoints: (
 
 .sticky-top {
   z-index: 990; // below main navbar
-  top: calc(7rem - 2px); // height of navbar (mobile)
+  top: calc(7rem - 2px); // height of navbar + search row (mobile)
+  transition: top 0.2s ease;
 
   @media (min-width: 580px) {
     top: 3.5rem; // height of navbar
   }
 }
 
+@media (max-width: 579.98px) {
+  :host-context(main.mobile-search-hidden) .sticky-top {
+    top: calc(3.5rem - 2px);
+  }
+}
+
 .table .form-check {
   padding: 0.2rem;
   min-height: 0;

src/documents/tests/test_api_status.py

@@ -101,13 +101,17 @@ class TestSystemStatus(APITestCase):
             - The response contains the correct install type
         """
         self.client.force_login(self.user)
-        os.environ["PNGX_CONTAINERIZED"] = "1"
-        response = self.client.get(self.ENDPOINT)
-        self.assertEqual(response.status_code, status.HTTP_200_OK)
-        self.assertEqual(response.data["install_type"], "docker")
-        os.environ["KUBERNETES_SERVICE_HOST"] = "http://localhost"
-        response = self.client.get(self.ENDPOINT)
-        self.assertEqual(response.data["install_type"], "kubernetes")
+        with mock.patch.dict(os.environ, {"PNGX_CONTAINERIZED": "1"}, clear=False):
+            response = self.client.get(self.ENDPOINT)
+            self.assertEqual(response.status_code, status.HTTP_200_OK)
+            self.assertEqual(response.data["install_type"], "docker")
+        with mock.patch.dict(
+            os.environ,
+            {"PNGX_CONTAINERIZED": "1", "KUBERNETES_SERVICE_HOST": "http://localhost"},
+            clear=False,
+        ):
+            response = self.client.get(self.ENDPOINT)
+            self.assertEqual(response.data["install_type"], "kubernetes")
 
     @mock.patch("redis.Redis.execute_command")
     def test_system_status_redis_ping(self, mock_ping) -> None:

src/paperless_ai/tests/conftest.py

@@ -0,0 +1,10 @@
+from pathlib import Path
+
+import pytest
+from pytest_django.fixtures import SettingsWrapper
+
+
+@pytest.fixture
+def temp_llm_index_dir(tmp_path: Path, settings: SettingsWrapper):
+    settings.LLM_INDEX_DIR = tmp_path
+    return tmp_path

src/paperless_ai/tests/test_ai_indexing.py

@@ -13,14 +13,6 @@ from documents.models import PaperlessTask
 from paperless_ai import indexing
 
 
-@pytest.fixture
-def temp_llm_index_dir(tmp_path):
-    original_dir = indexing.settings.LLM_INDEX_DIR
-    indexing.settings.LLM_INDEX_DIR = tmp_path
-    yield tmp_path
-    indexing.settings.LLM_INDEX_DIR = original_dir
-
-
 @pytest.fixture
 def real_document(db):
     return Document.objects.create(

src/paperless_ai/tests/test_embedding.py

@@ -3,7 +3,6 @@ from unittest.mock import MagicMock
 from unittest.mock import patch
 
 import pytest
-from django.conf import settings
 
 from documents.models import Document
 from paperless.models import LLMEmbeddingBackend
@@ -19,14 +18,6 @@ def mock_ai_config():
         yield MockAIConfig
 
 
-@pytest.fixture
-def temp_llm_index_dir(tmp_path):
-    original_dir = settings.LLM_INDEX_DIR
-    settings.LLM_INDEX_DIR = tmp_path
-    yield tmp_path
-    settings.LLM_INDEX_DIR = original_dir
-
-
 @pytest.fixture
 def mock_document():
     doc = MagicMock(spec=Document)

src/paperless_mail/tests/test_mail_oauth.py

@@ -1,7 +1,6 @@
 from datetime import timedelta
 from unittest import mock
 
-from django.conf import settings
 from django.contrib.auth.models import Permission
 from django.contrib.auth.models import User
 from django.test import TestCase
@@ -16,6 +15,13 @@ from paperless_mail.models import MailAccount
 from paperless_mail.oauth import PaperlessMailOAuth2Manager
 
 
+@override_settings(
+    OAUTH_CALLBACK_BASE_URL="http://localhost:8000",
+    GMAIL_OAUTH_CLIENT_ID="test_gmail_client_id",
+    GMAIL_OAUTH_CLIENT_SECRET="test_gmail_client_secret",
+    OUTLOOK_OAUTH_CLIENT_ID="test_outlook_client_id",
+    OUTLOOK_OAUTH_CLIENT_SECRET="test_outlook_client_secret",
+)
 class TestMailOAuth(
     TestCase,
 ):
@@ -31,12 +37,6 @@ class TestMailOAuth(
         self.user.save()
         self.client.force_login(self.user)
         self.mail_account_handler = MailAccountHandler()
-        # Mock settings
-        settings.OAUTH_CALLBACK_BASE_URL = "http://localhost:8000"
-        settings.GMAIL_OAUTH_CLIENT_ID = "test_gmail_client_id"
-        settings.GMAIL_OAUTH_CLIENT_SECRET = "test_gmail_client_secret"
-        settings.OUTLOOK_OAUTH_CLIENT_ID = "test_outlook_client_id"
-        settings.OUTLOOK_OAUTH_CLIENT_SECRET = "test_outlook_client_secret"
         super().setUp()
 
     def test_generate_paths(self) -> None:

uv.lock

@@ -4754,11 +4754,11 @@ wheels = [
 
 [[package]]
 name = "tinytag"
-version = "2.2.0"
+version = "2.2.1"
 source = { registry = "https://pypi.org/simple" }
-sdist = { url = "https://files.pythonhosted.org/packages/98/07/fb260bac73119f369a10e884016516d07cd760b5068e703773f83dd5e7bf/tinytag-2.2.0.tar.gz", hash = "sha256:f15b082510f6e0fc717e597edc8759d6f2d3ff6194ac0f3bcd675a9a09d9b798", size = 38120, upload-time = "2025-12-15T21:10:19.093Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/96/59/8a8cb2331e2602b53e4dc06960f57d1387a2b18e7efd24e5f9cb60ea4925/tinytag-2.2.1.tar.gz", hash = "sha256:e6d06610ebe7cd66fd07be2d3b9495914ab32654a5e47657bb8cd44c2484523c", size = 38214, upload-time = "2026-03-15T18:48:01.11Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/b1/e2/9818fcebb348237389d2ac2fea97cf2b2638378a0866105a45ae9be49728/tinytag-2.2.0-py3-none-any.whl", hash = "sha256:d2cf3ef8ee0f6c854663f77d9d5f8159ee1c834c70f5ea4f214ddc4af8148f79", size = 32861, upload-time = "2025-12-15T21:10:17.63Z" },
+    { url = "https://files.pythonhosted.org/packages/ce/34/d50e338631baaf65ec5396e70085e5de0b52b24b28db1ffbc1c6e82190dc/tinytag-2.2.1-py3-none-any.whl", hash = "sha256:ed8b1e6d25367937e3321e054f4974f9abfde1a3e0a538824c87da377130c2b6", size = 32927, upload-time = "2026-03-15T18:47:59.613Z" },
 ]
 
 [[package]]