/store/index.ts内にあるUserに対しsupabaseのprofileから取得したnameとavater_urlを追加したい。
/store/index.ts内のuserにnameとavater_urlを追加してみました。
しかしこのままではnameとavater_urlは空白のままです。
この後どうすれば良いかわかりません。
ログインしたタイミングでsupabaseのprofileデータからnameとavater_urlを取得してstore内の変数を更新したいです。
/store/index.ts
import { create } from 'zustand'
type User = {
id: string | undefined
email: string | undefined
name: string | null
avater_url: string | null
}
type State = {
user: User
setUser: (payload: User) => void
}
const useStore = create<State>((set) => ({
// 初期値
user: { id: '', email: '', name:'' , avater_url:'' }
// アップデート
setUser: (payload) => set({ user: payload }),
}))
export default useStore
アバターアイコンをヘッダーに作りたいためstore内にnameとavater_urlを保有することを思いついた次第です。
supabase-listener.tsxで、ユーザーIDとメールアドレスを状態管理に設定していますので、名前とアバターURLを取得して、設定してみてください。
リスナー関数は認証状態を監視していますので、ここで設定するのが良いかと思います。
参考URL:
先日ご回答いただいたソース(https://www.fullstackchannel.com/questions/112)
「supabase-listener.tsx」setUserの中に下記のようにnameとavater_urlを追加してみたところ出来ました。
ありがとうございます!
setUser({
id,
email,
name,
avatar_url,
})