AWS Amplify JavaScript v5からv6へ変更時、APIキーをエンドポイント毎に設定する方法

Amplify JavaScriptは2023年11月にv6の提供が開始され、バージョンアップによる破壊的変更が含まれています。
v5で複数のREST APIを設定する場合、それぞれのエンドポイントに対してAPIキーを設定できていたのですが、v6への変更でそのままでは設定できなくなっていたので修正方法を紹介します。
v5でのAPIキーを設定する場合、カスタムヘッダーとして記述することで設定できます。
具体的なコードは以下のようになります。（公式ドキュメントを少し修正したものになります）

v5.ts

import { Amplify, API, Auth } from 'aws-amplify';

const config = {
  API: {
    endpoints: [
      {
        name: 'MyAPIGatewayAPI',
        endpoint: 'https://1234567890-abcdefgh.amazonaws.com',
        custom_header: async () => {
          return {
            'X-Api-Key': 'ここでエンドポイント毎にAPIキーを設定可能',
          };
        },
      },
      {
        name: 'MyCustomCloudFrontApi',
        endpoint: 'https://api.my-custom-cloudfront-domain.com',
        custom_header: async () => {
          return {
            'X-Api-Key': 'ここでエンドポイント毎にAPIキーを設定可能',
          };
        },
      }
    ]
  }
}

Amplify.configure(config); // configureで設定する引数は１つ

次にv6で設定する場合ですが、Amplify.configure()の設定方法が変更されており、resourceConfigとlibraryOptions、それぞれに設定を記述する必要があります。
APIキーの設定はlibraryOptionsに設定する必要がありますが、エンドポイント毎の記述となるresourceConfigとは違い、エンドポイント毎にプロパティを設定することができません。

const resourceConfig = {
	API: {
		REST: {
			MyAPIGatewayAPI: {
				endpoint: 'https://1234567890-abcdefgh.amazonaws.com',
			},
			MyCustomCloudFrontApi: {
				endpoint: 'https://api.my-custom-cloudfront-domain.com',
			},
		},
	},
};

const libraryOptions = {
  API: {
    REST: {
      headers: async () => {
        return { 'X-Api-Key': apiKey }; // ここでAPI全てに対してのAPIキーが設定可能
      }
    }
  }
}
Amplify.configure(resourceConfig, libraryOptions); // configureで設定する引数は2つ

エンドポイント毎に別々のAPIキーを設定している場合、このままでは利用できないので、if文やswitch文などを使ってエンドポイント毎に判定してやる必要があります。
今回は以下のように修正することで対応しました。

v6.ts

import { Amplify } from "aws-amplify";
const resourceConfig = {
	API: {
		REST: {
			MyAPIGatewayAPI: {
				endpoint: 'https://1234567890-abcdefgh.amazonaws.com',
			},
			MyCustomCloudFrontApi: {
				endpoint: 'https://api.my-custom-cloudfront-domain.com',
			},
		},
	},
};
const libraryOptions = {
	API: {
		REST: {
			headers: async (options: {
				apiName: string;
			}): Promise<{ [keyName: string]: string }> => {
				switch (options.apiName) {
					case "MyAPIGatewayAPI":
						return {
							"X-Api-Key": 'ここでエンドポイント毎にAPIキーを設定可能',
						};
					case "MyCustomCloudFrontApi":
						return {
							"X-Api-Key": 'ここでエンドポイント毎にAPIキーを設定可能',
						};
					default:
						return {};
				}
			},
		},
	},
};

Amplify.configure(resourceConfig, libraryOptions);

v5では個別に設定出来ていたのにどうして...