import React, { useState } from 'react';

function App() {
  const [users, setUsers] = useState([
    { id: 1, name: 'Ali' },
    { id: 2, name: 'Sara' },
  ]);

  const addUser = () => {
    const newUser = { id: users.length + 1, name: `User ${users.length + 1}` };
    setUsers([...users, newUser]);
  };

  return (
    <div>
      <ul>
        {users.map((user) => (
          <li key={user.id}>{user.name}</li>
        ))}
      </ul>
      <button onClick={addUser}>Add User</button>
    </div>
  );
}

export default App;