End of Chapter 15

This commit is contained in:
Martin Donnelly 2019-09-26 17:07:36 +01:00
parent fd92cd327f
commit 541950f342
4 changed files with 42 additions and 26 deletions

View File

@ -1,23 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="5be46653-49b7-409a-9549-21ca1be137cc" name="Default Changelist" comment="End of Chapter 14">
<change afterPath="$PROJECT_DIR$/.idea/vcs.xml" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/components/layout/Navbar.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/components/users/UserItem.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/components/users/Users.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/misc.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/misc.xml" afterDir="false" />
<list default="true" id="5be46653-49b7-409a-9549-21ca1be137cc" name="Default Changelist" comment="">
<change afterPath="$PROJECT_DIR$/src/components/layout/Spinner.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/components/layout/spinner.gif" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/public/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/public/index.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.css" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/App.test.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/index.css" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/logo.svg" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/serviceWorker.js" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/src/components/users/Users.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/users/Users.js" afterDir="false" />
</list>
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
<option name="SHOW_DIALOG" value="false" />
@ -53,7 +41,7 @@
<property name="WebServerToolWindowFactoryState" value="true" />
<property name="javascript.nodejs.core.library.configured.version" value="8.1.3" />
<property name="js.phonegap.settings.workdir" value="$USER_HOME$/dev/sensortoy/platforms" />
<property name="last_opened_file_path" value="$PROJECT_DIR$" />
<property name="last_opened_file_path" value="$PROJECT_DIR$/src/components/layout" />
<property name="node.js.detected.package.eslint" value="true" />
<property name="node.js.detected.package.tslint" value="true" />
<property name="node.js.path.for.package.eslint" value="project" />
@ -69,9 +57,12 @@
<property name="nodejs_package_manager_path" value="npm" />
<property name="prettierjs.PrettierConfiguration.NodeInterpreter" value="project" />
<property name="prettierjs.PrettierConfiguration.Package" value="$USER_HOME$/.nvm/versions/node/v8.11.3/lib/node_modules/prettier" />
<property name="settings.editor.selected.configurable" value="JavaScript.Libraries" />
<property name="settings.editor.selected.configurable" value="editing.templates" />
</component>
<component name="RecentsManager">
<key name="CopyFile.RECENT_KEYS">
<recent name="$PROJECT_DIR$/src/components/layout" />
</key>
<key name="MoveFile.RECENT_KEYS">
<recent name="$PROJECT_DIR$/src" />
</key>
@ -110,8 +101,16 @@
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1569429914875</updated>
<workItem from="1569429916226" duration="6392000" />
<workItem from="1569429916226" duration="7333000" />
</task>
<task id="LOCAL-00001" summary="End of Chapter 14">
<created>1569512995385</created>
<option name="number" value="00001" />
<option name="presentableId" value="LOCAL-00001" />
<option name="project" value="LOCAL" />
<updated>1569512995385</updated>
</task>
<option name="localTasksCounter" value="2" />
<servers />
</component>
<component name="TypeScriptGeneratedFilesManager">

View File

@ -0,0 +1,10 @@
import React, { Fragment } from 'react';
import spinner from './spinner.gif';
const Spinner = () => (
<Fragment>
<img src={spinner} alt='Loading...' style={{'width': '200px', 'margin': 'auto', 'display': 'block'}}/>
</Fragment>
);
export default Spinner;

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

View File

@ -1,19 +1,26 @@
import React, { Component } from 'react';
import React from 'react';
import UserItem from './UserItem';
import Spinner from '../layout/Spinner';
import PropTypes from 'prop-types';
class Users extends Component {
render() {
const Users = ({ users, loading }) => {
if(loading)
return <Spinner/>;
else
return (
<div style={userStyle}>
{this.props.users.map(user => (
{users.map(user => (
<UserItem key={user.id} user={user}/>
)
)}
</div>
);
}
}
};
Users.propTypes = {
'users': PropTypes.array.isRequired,
'loading': PropTypes.bool.isRequired
};
const userStyle = {
'display':'grid',