Cloud Functions から httpsCallableを使用してデータを受け取る際、TypeScriptが上手くコンパイラできない。
解決したいこと
Cloud Functions から httpsCallableを使用してデータを受け取る際、TypeScriptが上手くコンパイラできない。
発生している問題・エラー
Argument of type '({ data, }: HttpsCallableResult<{ displayName: string;}>) => Promise<void>' is not assignable to parameter of type '(value: HttpsCallableResult<unknown>) => void | PromiseLike<void>'.
Types of parameters '__0' and 'value' are incompatible.
Type 'HttpsCallableResult<unknown>' is not assignable to type 'HttpsCallableResult<{ displayName: string; }>'.
Type 'unknown' is not assignable to type '{ displayName: string; }'.
やっていること
ユーザーが新規作成する際プロフィールを作成する(createProfile)
プロフィールが作成されたら、Firebase側のユーザー情報のdisplayNameを変更 → 何も返さない
プロフィールが失敗したら、エラー分をreturnして返す → エラー文を返す
プロジェクトは、JavaScriptで稼働済みでTypeScriptを随時変更していく過程でぶつかりました。とりあえず、動作するか確認するためinterfaceやtypeは宣言せず、直書きしちゃってます。
該当するソースコード
userSlice.ts
export const createProfile = createAsyncThunk(
"user/createProfile",
async (org: {
type: string;
name: string;
person: string;
position: string | null;
postal: string;
address: string;
tel: string;
agree: boolean;
provider: string;
fetch: boolean;
}): Promise<string | void> => {
const createProfile: HttpsCallable = httpsCallable(
functions,
"sh-createProfile"
);
const error = await createProfile(org)
.then(
async ({
data,
}: HttpsCallableResult<{ displayName: string }>): Promise<void> => {
if (auth.currentUser) {
await updateProfile(auth.currentUser, {
displayName: data.displayName,
});
}
}
)
.catch((e: Error): string => e.message);
if (error) {
return error;
}
}
);
@firebase/functions.d.ts
/**
* A reference to a "callable" HTTP trigger in Google Cloud Functions.
* @param data - Data to be passed to callable function.
* @public
*/
export declare type HttpsCallable<RequestData = unknown, ResponseData = unknown> = (data?: RequestData | null) => Promise<HttpsCallableResult<ResponseData>>;
/**
* Returns a reference to the callable HTTPS trigger with the given name.
* @param name - The name of the trigger.
* @public
*/
export declare function httpsCallable<RequestData = unknown, ResponseData = unknown>(functionsInstance: Functions, name: string, options?: HttpsCallableOptions): HttpsCallable<RequestData, ResponseData>;
/**
* An interface for metadata about how calls should be executed.
* @public
*/
export declare interface HttpsCallableOptions {
/**
* Time in milliseconds after which to cancel if there is no response.
* Default is 70000.
*/
timeout?: number;
}
/**
* An `HttpsCallableResult` wraps a single result from a function call.
* @public
*/
export declare interface HttpsCallableResult<ResponseData = unknown> {
/**
* Data returned from callable function.
*/
readonly data: ResponseData;
}
モジュール内は、こうなっているようです。
0