fix: AIcon の CLS をなくした

[cp-20]

概要

なぜこの PR を入れたいのか

fix #4882

動作確認の手順

<UserModal> (ユーザーの詳細モーダル) を開いた後に、 <NavigationSelector> (グループとかの一覧？) を開く

PR を出す前の確認事項

• （機能の追加なら）追加することの合意がチームで取れている
  • 取れていない場合はチェックを外して PR にすれば OK
• 動作確認ができている
• 自分で一度コードを眺めて自分的に問題はなさそう

見てほしいところ・聞きたいことなど

Summary by CodeRabbit

リリースノート

• Refactor
  • アイコンコンポーネントの読み込み方式を最適化し、コードの効率性を向上させました。

[github-actions]

Preview (prod) → https://5185-prod.traq-preview.trapti.tech/
Preview (dev) → https://5185-dev.traq-preview.trapti.tech/

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 381161ca-cfba-4ea6-9cb6-12a9998aba72

📥 Commits

Reviewing files that changed from the base of the PR and between b1c1705 and b7785ad.

📒 Files selected for processing (1)

• src/components/UI/AIcon.vue

---

📝 Walkthrough

Walkthrough

AIcon.vue のSVGアイコン読み込みを、lazy glob + shallowRef + watch による非同期方式から、eager: true glob + computed による同期方式へ切り替えた。

Changes

AIcon SVGロード同期化

Layer / File(s)	Summary
eager glob定義とVue import削減 src/components/UI/AIcon.vue	shallowRef・watch をVueインポートから削除し、import.meta.glob を eager: true の2つの同期globに分割定義。
getComponent同期化とcomputed導出 src/components/UI/AIcon.vue	getComponent を async から同期関数へ変更し、shallowRef + watch({ immediate: true }) による更新を廃止。svgComponent を computed で props.mdi/props.name から直接導出する形に変更。存在しないアイコン名の場合に例外をスローする挙動は維持。

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	PRタイトルは「AIcon の CLS をなくした」で、変更内容のSVGアイコン読み込みを非同期から同期への切り替えがCLS問題を解決するというメイン目的と一致している。
Description check	✅ Passed	PR説明には概要、修正対象のissue (#4882)、動作確認手順が記載されており、必須項目がカバーされている。ただしUI変更部分のスクリーンショットが記載されていない。
Linked Issues check	✅ Passed	PR変更内容（AIcon.vueでSVGアイコン読み込みを非同期から同期へ変更）は、issue #4882で特定されたAIcon.vueのコンポーネント遅延ロードによるCLS問題を直接解決している。
Out of Scope Changes check	✅ Passed	変更はAIcon.vueの遅延読み込みロジックの改善に限定されており、issue #4882のCLS問題解決という指定目的の範囲内である。
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/icon-cls

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install failed: one or more packages not found in the registry.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 62.43%. Comparing base (b1c1705) to head (b7785ad).

Additional details and impacted files

@@           Coverage Diff           @@
##           master    #5185   +/-   ##
=======================================
  Coverage   62.43%   62.43%           
=======================================
  Files         108      108           
  Lines        3109     3109           
  Branches      635      635           
=======================================
  Hits         1941     1941           
  Misses       1058     1058           
  Partials      110      110           

☔ View full report in Codecov by Harness.
📢 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.

[uni-kakurenbo]

LGTM