feat(mobile): add Profiles button to mobile bottom navigation (#265)

Adds a Profiles button as the last item in the mobile bottom nav bar,
making the Profiles panel reachable on mobile without opening the sidebar.

Fixes from original PR:
- Uses mobileSwitchPanel('profiles') not the broken two-call approach
- data-panel='profiles' attribute present for active-highlight state
- SVG 20x20 stroke-width 1.5 matching all other mobile nav icons
- Placed last (Chat → Tasks → Skills → Memory → Spaces → Profiles)
- 3 new tests in test_mobile_layout.py covering presence, handler, and order

Tests: 700 passed (up from 697)

Co-authored-by: @gabogabucho

Co-authored-by: Nathan Esquenazi <nesquena@gmail.com>
This commit is contained in:
nesquena-hermes
2026-04-12 00:41:52 -07:00
committed by GitHub
parent 5468b04550
commit d6a925cf11
2 changed files with 35 additions and 0 deletions

View File

@@ -481,6 +481,10 @@
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M2 4h8l2 2h10v14H2z"/></svg>
<span data-i18n="tab_workspaces">Spaces</span>
</button>
<button class="mobile-nav-btn" data-panel="profiles" onclick="mobileSwitchPanel('profiles')">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
<span data-i18n="tab_profiles">Profiles</span>
</button>
</nav>
<div class="toast" id="toast"></div>
<script src="/static/i18n.js"></script>

View File

@@ -175,3 +175,34 @@ def test_composer_textarea_font_size_mobile():
# Check for 16px font-size on the textarea in a mobile breakpoint
assert re.search(r'font-size:16px', CSS), \
"Composer textarea must have font-size:16px at mobile widths to prevent iOS zoom-on-focus"
# ── Profiles button in mobile bottom nav ─────────────────────────────────────
def test_mobile_profiles_button_present():
"""Mobile bottom nav must include a Profiles button (PR #265)."""
assert 'data-panel="profiles"' in HTML and 'mobileSwitchPanel' in HTML, \
"Mobile nav must have a Profiles button with data-panel='profiles' and mobileSwitchPanel"
def test_mobile_profiles_button_uses_mobileSwitchPanel():
"""Profiles mobile nav button must use mobileSwitchPanel, not raw switchPanel."""
import re
match = re.search(
r'<button[^>]*mobile-nav-btn[^>]*data-panel="profiles"[^>]*>|'
r'<button[^>]*data-panel="profiles"[^>]*mobile-nav-btn[^>]*>',
HTML
)
assert match, "Could not find mobile-nav-btn with data-panel='profiles'"
btn_html = HTML[match.start():match.start()+300]
assert "mobileSwitchPanel('profiles')" in btn_html, \
"Profiles mobile nav button must call mobileSwitchPanel('profiles')"
def test_mobile_profiles_button_is_last_in_nav():
"""Profiles button must appear after Spaces in the mobile bottom nav."""
spaces_pos = HTML.find('data-panel="workspaces"')
profiles_pos = HTML.rfind('data-panel="profiles"')
assert spaces_pos > 0 and profiles_pos > spaces_pos, \
"Profiles button must appear after Spaces button in the mobile nav"