Welcome User Component

Create a simple welcome component that greets a user by name and allows toggling additional information.

Component Requirements

• Create a component that displays a welcome message with the user's name
• Add a button with id toggle-info that shows/hides additional information
• Use the useState hook to manage the toggle state
• The user's name should be displayed inside a heading with id greeting
• The additional information should be in a paragraph with id info

Implementation Notes

• Use the name prop passed to your component
• The default state for the additional information should be hidden
• Style the component to look welcoming and professional
• Your component should be the default export

Example Code Structure

<div className="welcome-card">
  <h1 id="greeting">Welcome, {name}!</h1>
  <button id="toggle-info" onClick={toggleInfo}>
    {showInfo ? 'Hide Details' : 'Show Details'}
  </button>
  {showInfo && (
    <p id="info">
      We're excited to have you join us! This platform helps you learn 
      React by building real components in a hands-on environment.
    </p>
  )}
</div>