partial #115

enable members to vouch for each other
enable admin to view vouching info on all users

webclient/src/AdminMembers.js

@@ -1,10 +1,11 @@
 import React, { useState, useEffect } from 'react';
 import { Link, useParams } from 'react-router-dom';
 import './light.css';
-import { Button, Checkbox, Dimmer, Form, Message, Header, Icon, Image, Segment, Table } from 'semantic-ui-react';
+import { Button, Checkbox, Dimmer, Form, Message, Header, Icon, Image, Segment, Table, List, ListItem } from 'semantic-ui-react';
 import moment from 'moment-timezone';
 import { statusColor, BasicTable, staticUrl, requester } from './utils.js';
 import { TrainingList } from './Training.js';
+import { MembersList } from './components/MembersList';
 
 function AdminCardDetail(props) {
 	const { token, result, card } = props;
@@ -615,6 +616,18 @@ export function AdminMemberInfo(props) {
 						</Table.Cell>
 					</Table.Row>
 
+					<Table.Row>
+						<Table.Cell>Vouched by:</Table.Cell>
+						<Table.Cell>
+							<MembersList list={ member.sponsored_by }/>
+						</Table.Cell>
+					</Table.Row>
+					<Table.Row>
+						<Table.Cell>Vouches for:</Table.Cell>
+						<Table.Cell>
+							<MembersList list={ member.sponsorship }/>
+						</Table.Cell>
+					</Table.Row>
 					<Table.Row>
 						<Table.Cell>Public Bio:</Table.Cell>
 					</Table.Row>
@@ -788,4 +801,4 @@ export function AdminMemberCertifications(props) {
 
 		</div>
 	);
-};
+};