本日はAWESOME-COPILOTの技術調査枠です。
AWESOME-COPILOTのドキュメントを読みながら実際に操作を試して記事に残します。
今回はカスタムインストラクションの一つCode Components for Canvas Appsについてです。
Code Components for Canvas Apps
Code Components for Canvas AppsはPower Apps Canvas AppsでPCFコンポーネントを使用する際の開発・利用ルールをCopilotに教えるカスタムインストラクションです
PCFコンポーネントはPower AppsにカスタムUIコンポーネントを追加する仕組みでCanvas Appsでも使用できます。
以下のページからCode Components for Canvas Appsのインストールボタンをクリックして取得します。
github.com
インストールボタンを押してCode Components for Canvas Appsをダウンロードします。
すると.github/instructions配下にインストラクションがインストールされます。

インストールしたインストラクションはCopilotの動作に自動的に適用されます。
このインストラクションを読み込むと、CopilotはCanvas AppsでPCFコンポーネントを使う方法を理解した前提でコード生成・提案を行います。
具体的にはCopilotは以下のような行動をとります。
Canvas AppsでPCFを使う前提条件を説明
CopilotはPCFコンポーネントを使うための前提条件を説明します。
例えば以下の点を考慮します。
- Power Appsライセンスが必要
- 環境でPCF機能を有効化する必要がある
- 管理者権限が必要
またCanvas AppsではPCF機能を環境ごとに有効化する必要がある点も説明します。
PCF機能を有効化する手順を案内
CopilotはCanvas AppsでPCFを使うための設定手順を案内します。
基本的な手順は以下の通りになります。
- Power Appsにサインイン
- Admin Centerを開く
- 環境を選択
- Settings → Product → Features
- Power Apps component framework for canvas apps を有効化
この手順を理解した提案になります。
Canvas AppsにPCFコンポーネントを追加する方法
CopilotはCanvas AppsでPCFコンポーネントを追加する方法を案内します。
基本的な手順は以下の通りになります。
- Power Apps Studio を開く
- アプリを作成または編集
- Add → Get more components
- Code タブからコンポーネントを選択
- Import
- Insert → Code Components から配置
このUI操作の流れを前提に提案します。
セキュリティに関する注意点
PCFコンポーネントにはセキュリティリスクがあるため、Copilotは以下の運用を推奨します。
- 信頼できるコンポーネントのみ使用
- 管理者がレビューする
- 検証済みコンポーネントのみ配布
PCFコンポーネントはPower Apps Studio内でセキュリティトークンやデータにアクセスできる可能性があるためです。
コンポーネント更新のルール
PCFコンポーネントを更新する場合、Copilotは以下のルールを考慮します。
- manifestのversionを更新する
- Power Apps Studioを再読み込みする
- アプリを再公開する
これをしないと新しいコンポーネントが反映されないためです。
コンポーネント削除手順
CopilotはCanvas AppsからPCFコンポーネントを削除する場合、以下の手順を提案します。
- アプリを開く
- Tree view を開く
- コンポーネントを選択
- Delete
これによりUIからコンポーネントを削除できます。
Canvas AppsとPCFの制限を考慮
CopilotはCanvas Appsの制限も理解した上で提案します。
例えば以下のような制限です。
- すべてのPCF APIがCanvas Appsで使えるわけではない
- APIの利用可能性を確認する必要がある