F NAV - モバイル ナビゲーション タブ

テーマコンポーネント
73

「F-NAV for Mobile」のフォークに関するクイックアップデート：バックボタン、カスタムサブメニュー、表示制御機能を追加

このフォークを作成した理由

  • トピックページに、一般的なモバイルアプリのUXを模倣したヘッダー「戻る」ボタンを提供する
  • 設定可能なサブメニューを開く「customMenu」タブタイプを提供する（複数の宛先へのリンクに最適。カスタムの事前入力済み「新規トピック」リンクを追加するために使用しています）
  • タブとメニュー項目のグループベースの表示を追加し、特定の項目をスタッフのみに表示するなど、柔軟な制御を可能にする
  • 一部の非推奨事項の修正と、スタイル/アクセシビリティの微調整
新機能の概要
  • ヘッダーの戻るアイコン（オプション）
    • トピックページでヘッダーのホームロゴを戻る矢印に置き換えます
    • 動作：履歴があれば戻り、なければ「/」にルーティングします
    • 設定で切り替え可能：header_back_icon_enabled
  • カスタムサブメニュータブタイプ
    • 新しいf_nav_tabs関数：customMenu
    • 新しい設定：f_nav_submenu_items
      • ラベルとURL（オプションでアイコン）でメニュー項目を設定します
      • 1つのタブから複数のページに素早くアクセスするのに最適です
  • グループベースの表示制御
    • タブ、サブメニュー項目、profile_extra_itemsは、選択したグループに限定できます
    • 動作：
      • グループが空の場合 => 全員に表示
      • グループが設定されている場合 => 選択したグループの少なくとも1つのメンバーのみが表示可能
      • 未ログインユーザーは制限された項目を表示できません
  • オプション：トピックページでナビゲーションバーを非表示にする
    • 設定で切り替え可能：hide_nav_in_topic
  • ZIP圧縮された「ビルド」成果物とテストドキュメント
    • builds/の下に便利なビルド成果物（v1–v5）を提供します
    • 手動検証を文書化したTESTING_GUIDE.mdとTEST_RESULTS.md

既存機能の強化

  • F‑NAV項目とタブ
    • グループ表示を尊重するvisibleTabsゲッターを追加しました
    • 新しいCustomSubmenuコンポーネントをFNavItemフローに統合しました
  • ヘッダーアバター/プロファイルメニュー
    • モバイルビューの検出をコンポーネント内に移動し、動作を改善し、警告を解決しました
    • プロファイル追加項目でグループベースの表示をサポートするようになりました
  • スタイリングとアクセシビリティ
    • カスタムサブメニューと戻るアイコン用の新しいSCSS
    • 一貫したホバー/アクティブ/フォーカス可能な状態
    • コア変数との一貫したボーダー半径。パディング/スペーシングを調整しました（例：戻るボタンのパディングを0に設定）

バグ修正とメンテナンス

  • 初期化処理からコンポーネントレンダリングにチェックを移動することで、site.mobileViewの非推奨警告を解決しました
  • ブロックから関数を移動することで、レンダリングのエッジケースを修正しました
  • Discourseのヘッダー動作（ホバー/アクティブ状態、不透明度遷移）に合わせるためのマイナーな調整
  • 小さなCSSの整理（例：戻るボタンのパディングがゼロであることを確認、意図しないサイズ変更を防ぐ）

全体的な比較（オリジナル vs フォークブランチ）

  • オリジナル（main）：F‑NAVモバイルタブ + チャットのオプションインポート。戻るボタンやカスタムサブメニューなし
  • フォーク（feat/home-logo-arrow-back）：
    • ルーティングフォールバックを備えたヘッダー戻るアイコン機能を追加
    • 設定可能なサブメニュー項目を持つ「customMenu」タブ機能を紹介
    • タブ、サブメニュー項目、プロファイル項目に対するグループ制限表示を追加
    • オプションでトピックページでF‑NAVを非表示にする
    • インタラクション状態のアクセシビリティと一貫性を向上
    • テストドキュメントとパッケージ化されたビルドを提供する

注意点:

  • このコンポーネントは、Discourse Plugin APIレベル1.14以降をサポートする最近のDiscourseバージョンを対象としています（初期化処理で示されています）。
  • グループベースの表示に依存している場合は、まずグループとメンバーシップが正しく設定されていることを確認してください。

警告：私はコーダーではないため、注意してテストしてください。TCはAIによって作成およびテストされました。3.6beta1で最もよく機能します。

この素晴らしいコンポーネントを作成したDonに感謝します。素晴らしい追加機能です！:heart:

「いいね！」 2