From 82dfa132e72738bfa11343af9b1fa7977fc2692f Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Sun, 12 Jan 2020 04:58:29 +0000
Subject: [PATCH] Move Home member info into table and use preferred name

---
 webclient/src/Home.js | 31 ++++++++++++++++++-------------
 1 file changed, 18 insertions(+), 13 deletions(-)

diff --git a/webclient/src/Home.js b/webclient/src/Home.js
index a10a306..139fb23 100644
--- a/webclient/src/Home.js
+++ b/webclient/src/Home.js
@@ -88,34 +88,39 @@ function MemberInfo(props) {
 	return (
 		<div>
 			<Grid stackable>
-				<Grid.Column width={6}>
-					<img
-						className='photo-medium'
-						src={member.photo_medium ? staticUrl + '/' + member.photo_medium : '/nophoto.png'} size='small'
+				<Grid.Column width={5}>
+					<Image
+						size='small'
+						src={member.photo_medium ? staticUrl + '/' + member.photo_medium : '/nophoto.png'}
 					/>
 				</Grid.Column>
 
-				<Grid.Column width={10}>
+				<Grid.Column width={11}>
 					<Header size='large'>
 						<Icon.Group size='small'>
 							<Icon name='circle' color='green' />
 						</Icon.Group>
-						<Header.Content>{member.first_name} {member.last_name}</Header.Content>
+						<Header.Content>{member.preferred_name} {member.last_name}</Header.Content>
 					</Header>
 
-					<p>Preferred Name: {member.preferred_name || '???'}</p>
-					<p>Email: {user.email}</p>
-					<p>Status: Current</p>
+					<BasicTable>
+						<Table.Body>
+							<Table.Row>
+								<Table.Cell>Status:</Table.Cell>
+								<Table.Cell>{member.status}</Table.Cell>
+							</Table.Row>
+							<Table.Row>
+								<Table.Cell>Expiry:</Table.Cell>
+								<Table.Cell>{member.expire_date}</Table.Cell>
+							</Table.Row>
+						</Table.Body>
+					</BasicTable>
 				</Grid.Column>
 			</Grid>
 
 			<Header size='medium'>Details</Header>
 			<BasicTable>
 				<Table.Body>
-					<Table.Row>
-						<Table.Cell>Expiry:</Table.Cell>
-						<Table.Cell>2099-01-01</Table.Cell>
-					</Table.Row>
 					<Table.Row>
 						<Table.Cell>Application:</Table.Cell>
 						<Table.Cell>{member.application_date || '???'}</Table.Cell>