import React, { useState } from 'react';
import './App.css';
// LoginPageコンポーネント
import LoginPage from './pages/LoginPage';
// HomePageコンポーネント 
import HomePage from './pages/HomePage';
function App() {
	// ログイン状態を管理するステートを定義
	const [isLoggedIn, setIsLoggedIn] = useState(false);
	// ログイン処理を行う関数
	const handleLogin = () => {
		setIsLoggedIn(true); // ログイン状態をtrueに設定 
	};
	// ログアウト処理を行う関数
	const handleLogout = async () => {
		const response = await fetch('/api/logout', {
			method: 'POST' // POSTでログアウトを要求
		});
		if (response.ok) {
			// ログアウト成功の場合、ログイン状態をfalseに設定
			setIsLoggedIn(false);
		}
	};
	return (
		<div>
			{/* ログイン状態に応じてコンポーネントを切り替え */}
			{isLoggedIn ? (
				// ログイン中はHomePageを表示
				<HomePage onLogout={handleLogout} />
			) : (
				// 非ログイン時はLoginPageを表示
				<LoginPage onLogin={handleLogin} />
			)}
		</div>
	);
}
export default App;