CR-Error-treatment.jsx

const UserList = ({ isLoading, results, error }) => (
  <div>
    <div>
      <h1>Users</h1>
      <a href="/users/create">New User</a>
    </div>
    <div>
      {error && <span>Something is not right!</span>}
      {!error && isLoading && <span>Loading...</span>}
      {!error && !isLoading && !results.length && (
        <span>No Results Found</span>
      )}
      {!error && !isLoading && results.length > 0 && (
        <ul>
          {result.map((user) => (
            <li key={user.id}>{user.name}</li>
          ))}
        </ul>
      )}
      {!error && !isLoading && results.length > 0 && (
        <ul>
          {result.map((user) => (
            <li key={user.id}>{user.name}</li>
          ))}
        </ul>
      )}
    </div>
  </div>
);

As linhas 14 a 20 são iguais as 21 a 27, não?

Loop with results listed twice:

{!error` && !isLoading && results.length > 0 && (
    <ul>
          {result.map((user) => (
            <li key={user.id}>{user.name}</li>
          ))}
    </ul>
 )}