const [ session ] = useSession()でエラーになるのを解決

7月 4, 2022next.js,typedcript

タイトルが適当ではない気がしますが・・・。
検索で引っかかればOK的な感じです。

動作環境

next.js
types

$ npm list
├── @types/node@18.0.1
├── @types/react-dom@18.0.5
├── @types/react@18.0.14
├── eslint-config-next@12.2.0
├── eslint@8.19.0
├── next-auth@4.8.0
├── next@12.2.0
├── react-dom@18.2.0
├── react-hook-form@7.33.1
├── react@18.2.0
└── typescript@4.7.4

エラーの詳細

next.jsのtypescriptのコードの中で
const [ session ] = useSession()
という行でsessonの文字がエラーになった。
npm run buildして出力されたエラーは以下の通りです。

Type error: Type '{ readonly data: null; readonly status: "loading"; } | { data: Session; status: "authenticated"; } | { data: null; status: "loading"; } | { data: Session; status: "authenticated"; } | { ...; }' is not an array type.

なんぞコレ。どのワードで検索すればいいのか・・・。
typescriptまだ初心者なので、どう直したら良いのかわからん。any型を指定してもエラーは消えない。

解決

const [ session ] = useSession()
の行を次のように修正したらエラーが消えました。
const { data: session } = useSession()

参考サイト

以下のサイトに答えが書いてました。
https://next-auth.js.org/getting-started/typescript
結果オーライ。