JSFiddle - React, Tailwind, and code Playground

by Simon

JavaScript

render() {
 const viewSomeEntity = this.props.permissions.isAllowed('viewSomeEntity');

 if (!this.props.users) {
   return <Loading />;
 }
 
 if (!this.props.users.length) {
   return <Warning>Empty</Warning>;
 }
 
 if (!viewSomeEntity) {
 	return <PermissionWarning>Some warning</PermissionWarning>;
 }
 
 // HAPY PATH
 const canChangeSomeEntity = this.props.permissions.isAllowed('changeSomeEntity');
 
 const userContainerProps = {
   entity: this.props.someEntity,
   onChange: this.props.onSomeEntityChange,
   onSave: this.handleSave,
   canEdit: canChangeSomeEntity,
 };
 
 return (
   <List {...userContainerProps}>
     {this.props.users
        .map(user => <UserCard key={user.id} user={user} />)}
   </List>
 );
}