Skip to content

フォルダ毎にメニューの表示スタイルを設定可能にする#347

Merged
ujiro99 merged 9 commits intomainfrom
copilot/enable-menu-display-style-per-folder
Apr 7, 2026
Merged

フォルダ毎にメニューの表示スタイルを設定可能にする#347
ujiro99 merged 9 commits intomainfrom
copilot/enable-menu-display-style-per-folder

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 25, 2026

全体設定のメニュースタイル(横向き/縦向き)をフォルダ単位で上書きできるようにする。横並びメニューでも特定フォルダ(AIプロンプト等)だけ縦向きにすることが可能になる。

変更内容

  • FOLDER_STYLE 列挙型を追加 (const.ts)

    export enum FOLDER_STYLE {
      INHERIT = "inherit",   // デフォルト: 全体設定を継承
      HORIZONTAL = "horizontal",
      VERTICAL = "vertical",
    }
  • CommandFolder 型に style?: FOLDER_STYLE を追加 (types/index.ts, types/schema.ts)

  • FolderEditDialog にスタイル選択フィールドを追加 — 継承 / 横向き / 縦向き の3択

  • Menu.tsxMenuFolder でスタイル解決ロジックを追加

    • トリガーボタンは親メニューのスタイルに従う(isHorizontal
    • フォルダコンテンツ(サブメニュー)は folder.style で上書き可能(isHorizontalContent
    • INHERIT の場合は親スタイルをそのまま伝播
  • 14言語のロケールファイルに Option_folder_style / Option_folder_style_desc キーを追加

  • e2e テストを追加 (e2e/menu-style.spec.ts)

    • MS-01: global=horizontal → トップレベルのメニューが横向き
    • MS-02: global=vertical → トップレベルのメニューが縦向き
    • MS-03: global=horizontal + folder.style=vertical → フォルダ内コンテンツが縦向き
    • MS-04: global=vertical + folder.style=horizontal → フォルダ内コンテンツが横向き
    • MS-05: global=vertical + folder.style=inherit → フォルダが全体設定を継承して縦向き
  • OptionsPage.importSettings() を拡張 — オプションの設定ファイルパス引数を追加し、テスト専用の menu-style-settings.json を利用可能にした

Original prompt

This section details on the original issue you should resolve

<issue_title>フォルダ毎にメニューの表示スタイルを設定可能にする #94</issue_title>
<issue_description>## 要件
フォルダ毎の設定として、フォルダ内のメニューを表示する際の表示スタイルを設定可能にする

  • 横向き・・・メニューを横向きに表示する
  • 縦向き・・・メニューを縦向きに表示する
  • 継承・・・全体の設定(UserSettings.style)を継承する(※デフォルト)

期待効果

  • AIプロンプトコマンドで、メニューを横向きにしてアイコンだけの表示にした場合、Tooltipでしか内容が判別できず、選択しづらい
  • メニューを横向きにした場合でも、特定フォルダでは縦向きにすることで、AIプロンプトコマンドを選びやすくする

参考

// packages/extension/src/const.ts
export enum STYLE {
  HORIZONTAL = "horizontal",
  VERTICAL = "vertical",
}
```</issue_description>

## Comments on the Issue (you are @copilot in this section)

<comments>
</comments>

📍 Connect Copilot coding agent with Jira, Azure Boards or Linear to delegate work to Copilot in one click without leaving your project management tool.

Copilot AI changed the title [WIP] Add ability to set menu display style per folder フォルダ毎にメニューの表示スタイルを設定可能にする Mar 25, 2026
Copilot AI requested a review from ujiro99 March 25, 2026 03:58
@ujiro99
Copy link
Copy Markdown
Owner

ujiro99 commented Apr 2, 2026

@copilot
packages/extension/e2e/menu-style.spec.ts を参考に、本対応のe2eテストを作成してください。

Copy link
Copy Markdown
Contributor Author

Copilot AI commented Apr 2, 2026

@copilot
packages/extension/e2e/menu-style.spec.ts を参考に、本対応のe2eテストを作成してください。

commit 4ab3897 で以下の e2e テストを追加しました。

新規ファイル:

  • e2e/menu-style.spec.ts — 5 つのテストケース(MS-01〜MS-05)
  • e2e/data/menu-style-settings.json — テスト専用の設定ファイル(onlyIcon: false のフォルダ付き)

OptionsPage 変更:

  • importSettings(settingsPath?: string) でカスタム設定ファイルのインポートを可能にし、MENU_STYLE_SETTINGS_PATH を export

テストケース:

テスト 条件 検証内容
MS-01 global=horizontal トップレベルのメニューが flex-direction: row
MS-02 global=vertical トップレベルのメニューが flex-direction: column
MS-03 global=horizontal + folder.style=vertical フォルダ内コンテンツに flex-wrap クラスなし(縦)
MS-04 global=vertical + folder.style=horizontal フォルダ内コンテンツに flex-wrap クラスあり(横)
MS-05 global=vertical + folder.style=inherit フォルダが継承して縦(flex-wrap クラスなし)

フォルダコンテンツの向きは Menubarflex-wrap Tailwind クラスの有無で判定しています(CSS モジュールのハッシュ名に依存しないため信頼性が高いアプローチ)。

Copilot AI requested a review from ujiro99 April 2, 2026 04:53
@ujiro99 ujiro99 marked this pull request as ready for review April 7, 2026 02:00
@codecov
Copy link
Copy Markdown

codecov bot commented Apr 7, 2026

Codecov Report

❌ Patch coverage is 8.69565% with 63 lines in your changes missing coverage. Please review.
✅ Project coverage is 25.64%. Comparing base (d7fa8de) to head (e765c82).
⚠️ Report is 10 commits behind head on main.

Files with missing lines Patch % Lines
...ension/src/components/option/field/SelectField.tsx 0.00% 30 Missing ⚠️
.../src/components/option/editor/FolderEditDialog.tsx 0.00% 20 Missing ⚠️
packages/extension/src/components/menu/Menu.tsx 0.00% 13 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main     #347      +/-   ##
==========================================
- Coverage   25.67%   25.64%   -0.03%     
==========================================
  Files         309      309              
  Lines       31237    31295      +58     
  Branches     1550     1551       +1     
==========================================
+ Hits         8020     8026       +6     
- Misses      23217    23269      +52     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@ujiro99 ujiro99 merged commit f8ef5b8 into main Apr 7, 2026
5 of 7 checks passed
@ujiro99 ujiro99 deleted the copilot/enable-menu-display-style-per-folder branch April 7, 2026 02:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

フォルダ毎にメニューの表示スタイルを設定可能にする #94

2 participants