ログイン状態管理

1import Link from 'next/link';
2import React from 'react';
3import { useAuth } from '../context/auth';
4
5const AuthContext = () => {
6  const { user, loading, firebaseUser } = useAuth();
7
8  if (loading) {
9    return <p>ログインチェック中...</p>;
10  }
11
12  if (!firebaseUser) {
13    return (
14      <p>
15        ゲストユーザーです。
16        <Link href="/login">
17          <a className="text-pink-600">ログイン</a>
18        </Link>
19        してください
20      </p>
21    );
22  }
23
24  if (user) {
25    return (
26      <div>
27        <p>{user.name} さんようこそ</p>
28      </div>
29    );
30  }
31
32  return <p>ログインしていますがユーザー情報が未登録です。</p>;
33};
34
35export default AuthContext;

使用ライブラリ

なし

参考サイト

なし