はじめに

新たにリリースされた kintone-config-helper というライブラリについてご紹介します。

プラグイン開発において、設定画面を作成する際に、
フォームの「フィールドタイプ」、「フィールド名」、「フィールドコード」をアプリからREST APIで取得する場面があります。

例として、プラグイン設定画面に、アプリに設定されている日付フィールドを選択するドロップダウンを作成する場合、以下の3種類の情報が必要になります。

1. フィールドタイプ：特定のフィールドタイプのフィールドのみが入っているドロップダウンを作成するため
2. フィールド名：選択肢のラベルを作成するため
3. フィールドコード：選択肢の値に使用するため

今回紹介する kintone-config-helper は 1~3 の情報を簡単に取得することができるライブラリです。

コードの比較

実際にサンプルプラグインとして公開されている Date Input Button Plug-in を例にして、ツール有り無しの際のコード比較をしてみます。
具体的には config.js の 71行目から始まる setDropDownForDate 関数を修正します。
この関数は日付フィールドの情報をドロップダウンに設定しています。

ツールなしの場合

fields.jsonを取得し、取得したレスポンスをループさせ、フィールドタイプの値が'DATE'のオブジェクトから、情報を抜き出してドロップダウンを作成しています。

慣れている人ならば問題なくコーディングできるかと思いますが、初めての方には少しややこしく、読み解くにも時間がかかります。

また、今回使用しているAPI(fields.json)ではスペースフィールドの情報が取得できないという問題点もあります。

kintone-config-helper の場合

先ほどのサンプルと同じように日付フィールドのドロップダウンを作成してみましょう。

kintone-config-helper では、getFields() 関数の引数に取得したいフィールドタイプを指定することで、
現在開いているアプリのフィールド名、フィールドコード、フィールドタイプを取得することが可能です。

使い方

GitHubから kintone-config-helper.js をダウンロードします。
プラグインで扱う際は以下のディレクトリ構成を参考に kintone-config-helper.js を保存します。

manifest.json にも "js/kintone-config-helper.js" を追加しましょう。

以上で、プラグインカスタマイズ上で kintone-config-helper を扱うことが可能です。

おわりに

いかがでしょうか。
今回紹介したライブラリは、アプリのフォーム情報を、プラグイン設定画面用に必要な部分だけ簡単に取得してくれます。
kintone UI Compoent と組み合わせることにより、プラグイン設定画面の作成がさらに簡単になると思います。

制限事項については GitHub の Readme をご確認ください。
https://github.com/kintone-labs/config-helper#limitations 

注意事項

ソースコードの変更および再配布、商用利用等はライセンスに従ってご利用可能です。

このTipsは、2019年2月版 kintoneで確認したものになります。