// src/UserProfile.js
import React, { useEffect, useState } from 'react';
import { Auth } from 'aws-amplify';

const UserProfile = () => {
  const [userAttributes, setUserAttributes] = useState(null);

  useEffect(() => {
    async function fetchUserData() {
      try {
        const userData = await Auth.currentAuthenticatedUser();
        setUserAttributes(userData.attributes);
      } catch (error) {
        console.error('Error fetching user data:', error);
      }
    }

    fetchUserData();
  }, []);

  return (
    <div>
      <h1>User Profile</h1>
      {userAttributes ? (
        <ul>
          <li>Employee Number: {userAttributes['custom:employee_number']}</li>
          <li>Department: {userAttributes['custom:department']}</li>
        </ul>
      ) : (
        <p>Loading user profile...</p>
      )}
    </div>
  );
};

export default UserProfile;