import { useState } from 'react';
import keycloak from './keycloak';

const App: React.FC = () => {
  const [token, setToken] = useState(keycloak.token);

  const refreshToken = async () => {
    if (keycloak.isTokenExpired(30)) {
      await keycloak.updateToken(60);
      setToken(keycloak.token);
    }
  };

  return (
    <div style={{ padding: 20 }}>
      <h1>React + Keycloak Demo</h1>

      <p>Angemeldet als: {keycloak.tokenParsed?.preferred_username}</p>

      <button onClick={() => keycloak.logout()}>Logout</button>

      <hr />

      <Books token={token} refreshToken={refreshToken} />
    </div>
  );
};

export default App;
