Updated meteor; Modified the assignments byPerson page considerably to improve the workflow; Added an external id to sites; Added an import for students; Improved the students page.

2023-06-16 11:52:48 -07:00
parent 9444cac85d
commit 3c76d5e6a0
15 changed files with 664 additions and 180 deletions
--- a/imports/ui/pages/Assignments/ByAsset.jsx
+++ b/imports/ui/pages/Assignments/ByAsset.jsx
@@ -42,6 +42,7 @@ const AssignmentsByAsset = () => {

 	//Dialog stuff.
 	const [openUnassignDialog, setOpenUnassignDialog] = useState(false)
+	const [unassignDialogEditConditionOnly, setUnassignDialogEditConditionOnly] = useState(false)
 	const [unassignCondition, setUnassignCondition] = useState(conditions[2])
 	const [unassignComment, setUnassignComment] = useState("")
 	const [unassignConditionDetails, setUnassignConditionDetails] = useState("")
@@ -71,8 +72,9 @@ const AssignmentsByAsset = () => {
 	// 	if(assetIdInput) assetIdInput.focus()
 	// })

-	const unassign = () => {
+	const unassign = (editConditionOnly) => {
 		// Open the dialog to get condition and comment.
+		setUnassignDialogEditConditionOnly(editConditionOnly)
 		setUnassignComment("")
 		setUnassignCondition(foundAsset.condition ? foundAsset.condition : conditions[2])
 		setUnassignConditionDetails(foundAsset.conditionDetails || "")
@@ -82,18 +84,26 @@ const AssignmentsByAsset = () => {
 		setOpenUnassignDialog(false)

 		if(unassign === true) {
-			// Call assets.unassign(assetId, comment, condition, conditionDetails, date)
-			Meteor.call('assets.unassign', foundAsset.assetId, unassignComment, unassignCondition, unassignConditionDetails, (err, result) => {
-				if(err) console.error(err)
-				else if(assetIdInput) assetIdInput.focus()
-			})
+			if(unassignDialogEditConditionOnly) {
+				Meteor.call('assets.updateCondition', unassignAsset._id, unassignCondition, unassignConditionDetails, (err, result) => {
+					if(err) console.error(err)
+					else if(assetIdInput) assetIdInput.focus()
+				})
+			}
+			else {
+				// Call assets.unassign(assetId, comment, condition, conditionDetails, date)
+				Meteor.call('assets.unassign', foundAsset.assetId, unassignComment, unassignCondition, unassignConditionDetails, (err, result) => {
+					if (err) console.error(err)
+					else if (assetIdInput) assetIdInput.focus()
+				})
+			}
 		}
 	}

 	return (
 		<>
 			<Dialog open={openUnassignDialog} onClose={unassignDialogClosed}>
-				<DialogTitle>Unassign Asset</DialogTitle>
+				<DialogTitle>{unassignDialogEditConditionOnly ? "Edit Condition" : "Unassign Asset"}</DialogTitle>
 				<DialogContent style={{display: 'flex', flexDirection: 'column'}}>
 					<div>
 						<TextField style={cssEditorField} select variant="standard" label="Condition" value={unassignCondition} onChange={(e)=>{setUnassignCondition(e.target.value)}}>
@@ -102,11 +112,11 @@ const AssignmentsByAsset = () => {
 							})}
 						</TextField>
 					</div>
-					<TextField style={{marginTop: '1rem',minWidth: '30rem'}} variant="standard" label="Comment" value={unassignComment} onChange={(e) => {setUnassignComment(e.target.value)}}/>
+					{!unassignDialogEditConditionOnly && <TextField style={{marginTop: '1rem',minWidth: '30rem'}} variant="standard" label="Comment" value={unassignComment} onChange={(e) => {setUnassignComment(e.target.value)}}/>}
 					<TextField style={{marginTop: '1rem',minWidth: '30rem'}} multiline rows={4} variant="outlined" label="Condition Details" value={unassignConditionDetails} onChange={(e) => {setUnassignConditionDetails(e.target.value)}}/>
 				</DialogContent>
 				<DialogActions>
-					<Button onClick={() => unassignDialogClosed(true)}>Unassign</Button>
+					<Button onClick={() => unassignDialogClosed(true)}>{unassignDialogEditConditionOnly ? "Save" : "Unassign"}</Button>
 					<Button onClick={() => unassignDialogClosed(false)}>Cancel</Button>
 				</DialogActions>
 			</Dialog>
@@ -123,7 +133,9 @@ const AssignmentsByAsset = () => {
 						<>
 							<div>Assigned on: {foundAsset.assignmentDate.toString()}</div>
 							<div>Assigned to: {foundAsset.assignee.firstName} {foundAsset.assignee.lastName} {foundAsset.assignee.grade && foundAsset.assignee.grade} (<Link to={"/search?email=" + encodeURIComponent(foundAsset.assignee.email)}>{foundAsset.assignee.email}</Link>)</div>
-							<Button variant="contained" color='secondary' className="button" onClick={()=>unassign()}>Unassign</Button>
+							<Button variant="contained" color='secondary' className="button" onClick={()=>unassign(false)}>Unassign</Button>
+							{"  "}
+							<Button variant="contained" color='secondary' className="button" onClick={()=>unassign(true)}>Edit</Button>
 						</>
 					)}
 				</div>
--- a/imports/ui/pages/Assignments/ByPerson.jsx
+++ b/imports/ui/pages/Assignments/ByPerson.jsx
@@ -6,7 +6,7 @@ import _ from 'lodash';
 import TextField from "@mui/material/TextField";
 import Button from "@mui/material/Button";
 import MenuItem from '@mui/material/MenuItem';
-import {InputLabel, List, ListItem, ListItemButton, ListItemText} from "@mui/material";
+import {InputLabel, List, ListItem, ListItemButton, ListItemText, Switch} from "@mui/material";
 import Box from "@mui/material/Box";
 import ToggleButton from '@mui/material/ToggleButton';
 import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
@@ -19,7 +19,9 @@ import {Assets, conditions} from "/imports/api/assets";
 import {AssetTypes} from "/imports/api/asset-types";
 import {Students} from "/imports/api/students";
 import {Staff} from "/imports/api/staff";
-import {Link} from "react-router-dom";
+import {Link, useLocation, useNavigate, useNavigationType} from "react-router-dom";
+import { Action as NavigationType } from "@remix-run/router";
+import FormControlLabel from "@mui/material/FormControlLabel";

 const cssTwoColumnContainer = {
 	display: 'grid',
@@ -32,10 +34,15 @@ const cssEditorField = {
 }

 const AssignmentsByPerson = () => {
-	const theme = useTheme();
-	const [searchType, setSearchType] = useState("Email")
-	const [search, setSearch] = useState("")
-	const [selectedPerson, setSelectedPerson] = useState("")
+	const navigate = useNavigate()
+	const navigateType = useNavigationType()
+	const location = useLocation()
+	const state = location.state
+	const theme = useTheme()
+	// const [searchType, setSearchType] = useState("Email")
+	const [search, setSearch] = useState(state && state.search ? state.search : "")
+	const [includeInactive, setIncludeInactive] = useState(false)
+	const [selectedPerson, setSelectedPerson] = useState(state && state.person ? state.person : "")
 	const [assetId, setAssetId] = useState("")
 	const [openAssignDialog, setOpenAssignDialog] = useState(false)
 	const [assignCondition, setAssignCondition] = useState(conditions[2])
@@ -43,6 +50,7 @@ const AssignmentsByPerson = () => {
 	
 	//Dialog stuff.
 	const [openUnassignDialog, setOpenUnassignDialog] = useState(false)
+	const [unassignDialogEditConditionOnly, setUnassignDialogEditConditionOnly] = useState(false)
 	const [unassignCondition, setUnassignCondition] = useState(conditions[2])
 	const [unassignComment, setUnassignComment] = useState("")
 	const [unassignConditionDetails, setUnassignConditionDetails] = useState("")
@@ -56,13 +64,17 @@ const AssignmentsByPerson = () => {
 		if(search && search.length > 1) {
 			let query;
 			
-			if(searchType === "Email") {
-				query = {email: {$regex: search, $options: 'i'}};
-			} else if(searchType === 'First Name') {
-				query = {firstName: {$regex: search, $options: 'i'}}
-			} else {
-				query = {lastName: {$regex: search, $options: 'i'}}
-			}
+			query = {$or: [{email: {$regex: search, $options: 'i'}}, {firstName: {$regex: search, $options: 'i'}}, {firstNameAlias: {$regex: search, $options: 'i'}}, {lastName: {$regex: search, $options: 'i'}}]}
+			// if(searchType === "Email") {
+			// 	query = {email: {$regex: search, $options: 'i'}};
+			// } else if(searchType === 'First Name') {
+			// 	query = {firstName: {$regex: search, $options: 'i'}}
+			// } else {
+			// 	query = {lastName: {$regex: search, $options: 'i'}}
+			// }
+			
+			// Look for students/staff that are active or whose active flag is not set.
+			if(!includeInactive) query = {$and: [query, {$or: [{active: true}, {active: {$exists: false}}]}]}
 			
 			const students = Students.find(query).fetch();
 			const staff = Staff.find(query).fetch();
@@ -143,8 +155,9 @@ const AssignmentsByPerson = () => {
 	// 	if(assetIdInput) assetIdInput.focus()
 	// })
 	
-	const unassign = (asset) => {
+	const unassign = (asset, editConditionOnly) => {
 		// Open the dialog to get condition and comment.
+		setUnassignDialogEditConditionOnly(editConditionOnly)
 		setUnassignAsset(asset);
 		setUnassignComment("")
 		setUnassignCondition(asset.condition ? asset.condition : conditions[2])
@@ -155,11 +168,19 @@ const AssignmentsByPerson = () => {
 		setOpenUnassignDialog(false)

 		if(unassign === true) {
-			// Call assets.unassign(assetId, comment, condition, conditionDetails, date)
-			Meteor.call('assets.unassign', unassignAsset.assetId, unassignComment, unassignCondition, unassignConditionDetails, (err, result) => {
-				if(err) console.error(err)
-				else if(assetIdInput) assetIdInput.focus()
-			})
+			if(unassignDialogEditConditionOnly) {
+				Meteor.call('assets.updateCondition', unassignAsset._id, unassignCondition, unassignConditionDetails, (err, result) => {
+					if(err) console.error(err)
+					else if(assetIdInput) assetIdInput.focus()
+				})
+			}
+			else {
+				// Call assets.unassign(assetId, comment, condition, conditionDetails, date)
+				Meteor.call('assets.unassign', unassignAsset.assetId, unassignComment, unassignCondition, unassignConditionDetails, (err, result) => {
+					if(err) console.error(err)
+					else if(assetIdInput) assetIdInput.focus()
+				})
+			}
 		}
 	}

@@ -171,6 +192,20 @@ const AssignmentsByPerson = () => {
 		userSelect: 'none',
 		// '&:nthChild(even)': {backgroundColor: '#935e5e'}
 	}
+
+	const changeSelectedPerson = (person) => {
+		setSelectedPerson(person)
+		navigate("/assignments", {replace: false, state: {person, search}});
+	}
+	useEffect(() => {
+		if(!state) navigate("/assignments/byPerson", {replace: true, state: {search: "", person: null}})
+		else {
+			if(navigateType === NavigationType.Pop) {
+				setSearch(state.search)
+				setSelectedPerson(state.person)
+			}
+		}
+	})
 	
 	return (
 		<>
@@ -193,7 +228,7 @@ const AssignmentsByPerson = () => {
 			</Dialog>
 			
 			<Dialog open={openUnassignDialog} onClose={unassignDialogClosed}>
-				<DialogTitle>Unassign Asset</DialogTitle>
+				<DialogTitle>{unassignDialogEditConditionOnly ? "Edit Condition" : "Unassign Asset"}</DialogTitle>
 				<DialogContent style={{display: 'flex', flexDirection: 'column'}}>
 					<div>
 						<TextField style={cssEditorField} select variant="standard" label="Condition" value={unassignCondition} onChange={(e)=>{setUnassignCondition(e.target.value)}}>
@@ -202,47 +237,51 @@ const AssignmentsByPerson = () => {
 							})}
 						</TextField>
 					</div>
-					<TextField style={{marginTop: '1rem',minWidth: '30rem'}} variant="standard" label="Comment" value={unassignComment} onChange={(e) => {setUnassignComment(e.target.value)}}/>
+					{!unassignDialogEditConditionOnly && <TextField style={{marginTop: '1rem',minWidth: '30rem'}} variant="standard" label="Comment" value={unassignComment} onChange={(e) => {setUnassignComment(e.target.value)}}/>}
 					<TextField style={{marginTop: '1rem',minWidth: '30rem'}} multiline rows={4} variant="outlined" label="Condition Details" value={unassignConditionDetails} onChange={(e) => {setUnassignConditionDetails(e.target.value)}}/>
 				</DialogContent>
 				<DialogActions>
-					<Button onClick={() => unassignDialogClosed(true)}>Unassign</Button>
+					<Button onClick={() => unassignDialogClosed(true)}>{unassignDialogEditConditionOnly ? "Save" : "Unassign"}</Button>
 					<Button onClick={() => unassignDialogClosed(false)}>Cancel</Button>
 				</DialogActions>
 			</Dialog>
 			
-			<Box style={{marginTop: '1rem',...cssTwoColumnContainer}}>
-				<ToggleButtonGroup color="primary" value={searchType} exclusive onChange={(e, type)=>setSearchType(type)} aria-label="Search Type">
-					<ToggleButton value="Email">Email</ToggleButton>
-					<ToggleButton value="First Name">First Name</ToggleButton>
-					<ToggleButton value="Last Name">Last Name</ToggleButton>
-				</ToggleButtonGroup>
+			<Box style={{margin: '1rem 0 0 0', padding: '0 1rem',...cssTwoColumnContainer, width: "24rem"}}>
+				{/*<ToggleButtonGroup color="primary" value={searchType} exclusive onChange={(e, type)=>setSearchType(type)} aria-label="Search Type">*/}
+				{/*	<ToggleButton value="Email">Email</ToggleButton>*/}
+				{/*	<ToggleButton value="First Name">First Name</ToggleButton>*/}
+				{/*	<ToggleButton value="Last Name">Last Name</ToggleButton>*/}
+				{/*</ToggleButtonGroup>*/}
+				<FormControlLabel sx={{marginTop: '0.7rem'}} control={<Switch variant="standard" checked={includeInactive} onChange={(e) => {setIncludeInactive(e.target.checked)}}/>} label="Inactive"/>
 				<TextField style={cssEditorField} variant="standard" label="Search" value={search} onChange={(e) => {setSearch(e.target.value)}}/>
 			</Box>
-			<Box style={cssTwoColumnContainer}>
-				<div style={{maxHeight: '26rem', overflowY:'auto', minWidth: '10rem', minHeight: '10rem'}}>
+			<Box style={{...cssTwoColumnContainer, gridTemplateColumns: "24rem 1fr"}}>
+				<div style={{maxHeight: '26rem', overflowY:'auto', minWidth: '10rem', minHeight: '10rem', maxWidth: '40rem'}}>
 					<List>
 						{people.map((next, i) => {
 							return (
-								<ListItemButton key={next._id} style={getListItemStyle(next)} selected={selectedPerson === next} onClick={(e) => {setSelectedPerson(next)}}>
-									<ListItemText primary={next.firstName + " " + next.lastName} secondary={next.email}/>
+								<ListItemButton key={next._id} style={getListItemStyle(next)} selected={selectedPerson === next} onClick={(e) => {changeSelectedPerson(next)}}>
+									<ListItemText primary={next.firstName + " " + (next.firstNameAlias ? "'" + next.firstNameAlias + "' " : "") + next.lastName + (next.grade ? " (" + next.grade + ")" : "")} secondary={next.email}/>
 								</ListItemButton>
 							)
 						})}
 					</List>
 				</div>
-				<div style={{display: 'flex', flexDirection: 'column', margin: '1rem 0 0 .5rem'}}>
+				<div style={{display: 'flex', flexDirection: 'column', margin: '0 0 0 .5rem'}}>
 					{selectedPerson && (
-						<div style={cssAssetTile}>
-							<div style={{marginBottom: '1rem'}}><TextField id='assetIdInput' inputRef={input=>setAssetIdInput(input)} style={cssEditorField} variant="standard" label="Asset ID" value={assetId} onChange={(e) => {setAssetId(e.target.value.toUpperCase())}}/></div>
-							<div>{foundAsset && foundAsset.assetType.name}</div>
-							<div>{foundAsset && <Link to={"/search?assetId=" + encodeURIComponent(foundAsset.assetId)}>{foundAsset.assetId}</Link>}</div>
-							<div>{foundAsset && <Link to={"/search?serial=" + encodeURIComponent(foundAsset.serial)}>{foundAsset.serial}</Link>}</div>
-							{foundAsset && foundAsset.assignee && (
-								<div>Assigned To: {foundAsset.assignee.firstName} {foundAsset.assignee.lastName}</div>
-							)}
-							<Button variant="contained" color='primary' className="button" disabled={!foundAsset || foundAsset.assignee !== undefined} onClick={()=>assign()}>Assign</Button>
-						</div>
+						<>
+							<h3 style={{margin: "0 0 0.5rem 0"}}>{selectedPerson.firstName + " " + (selectedPerson.firstNameAlias ? "'" + selectedPerson.firstNameAlias + "' " : "") + selectedPerson.lastName + (selectedPerson.grade ? " (" + selectedPerson.grade + ")" : "")}</h3>
+							<div style={{...cssAssetTile, paddingTop: "0"}}>
+								<div style={{marginBottom: '1rem'}}><TextField id='assetIdInput' inputRef={input=>setAssetIdInput(input)} style={cssEditorField} variant="standard" label="Asset ID" value={assetId} onChange={(e) => {setAssetId(e.target.value.toUpperCase())}}/></div>
+								<div>{foundAsset && foundAsset.assetType.name}</div>
+								<div>{foundAsset && <Link to={"/search?assetId=" + encodeURIComponent(foundAsset.assetId)}>{foundAsset.assetId}</Link>}</div>
+								<div>{foundAsset && <Link to={"/search?serial=" + encodeURIComponent(foundAsset.serial)}>{foundAsset.serial}</Link>}</div>
+								{foundAsset && foundAsset.assignee && (
+									<div>Assigned To: {foundAsset.assignee.firstName} {foundAsset.assignee.lastName}</div>
+								)}
+								<Button variant="contained" color='primary' className="button" disabled={!foundAsset || foundAsset.assignee !== undefined} onClick={()=>assign()}>Assign</Button>
+							</div>
+						</>
 					)}
 					{assets.map((next, i) => {
 						return (
@@ -250,7 +289,9 @@ const AssignmentsByPerson = () => {
 								<div>{next.assetType.name}</div>
 								<div><Link to={"/search?assetId=" + encodeURIComponent(next.assetId)}>{next.assetId}</Link></div>
 								<div><Link to={"/search?serial=" + encodeURIComponent(next.serial)}>{next.serial}</Link></div>
-								<Button variant="contained" color='secondary' className="button" onClick={()=>unassign(next)}>Unassign</Button>
+								<Button variant="contained" color='secondary' className="button" onClick={()=>unassign(next, false)}>Unassign</Button>
+								{"  "}
+								<Button variant="contained" color='secondary' className="button" onClick={()=>unassign(next, true)}>Edit</Button>
 							</div>
 						)
 					})}
--- a/imports/ui/pages/Assignments/Report.jsx
+++ b/imports/ui/pages/Assignments/Report.jsx
@@ -0,0 +1,168 @@
+import {Meteor} from "meteor/meteor";
+import React from "react";
+import {useTheme} from "@mui/material/styles";
+import {useTracker} from "meteor/react-meteor-data";
+import {AssetTypes} from "/imports/api/asset-types";
+import {Assets} from "/imports/api/assets";
+import {Students} from "/imports/api/students";
+import {Staff} from "/imports/api/staff";
+import SimpleTable from "/imports/ui/util/SimpleTable";
+import moment from "moment";
+import {Box, Grid} from "@mui/material";
+import TextField from "@mui/material/TextField";
+import MenuItem from "@mui/material/MenuItem";
+import Button from "@mui/material/Button";
+
+const AssignmentsReport = () => {
+	const theme = useTheme();
+
+	const {people} = useTracker(() => {
+		let assets = Assets.find({assigneeId: {$exists: true}, assigneeType: "Student"}).fetch()
+		let assetTypes = AssetTypes.find().fetch()
+		let students = Students.find().fetch()
+		let people = []
+
+		let assetTypesById = assetTypes.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+		let studentsById = students.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+		// let staffById = staff.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+
+		for(let next of assets) {
+			let student = studentsById[next.assigneeId]
+			let assetType = assetTypesById[next.assetTypeId]
+			
+			people.push({_id: next._id, firstName: student.firstName, lastName: student.lastName, grade: student.grade, assetName: assetType.name, checkOutDate: next.assignmentDate, condition: next.condition, assetTag: next.assetId})
+		}
+		
+		people.sort((a, b) => {
+			let firstName = a.firstName.localeCompare(b.firstName)
+			let lastName = a.lastName.localeCompare(b.lastName)
+			
+			return a.grade === b.grade ? lastName ? lastName : firstName : b.grade - a.grade
+		})
+		
+		return {people}
+	});
+	
+	const exportData = () => {
+		let csv
+		
+		for(let next of people) {
+			if(csv) csv += "\r\n"
+			else csv = "First Name;Last Name;Grade;Asset Name;Check Out Date;Condition;Asset Tag\r\n"
+			
+			csv += next.firstName + ";" + next.lastName + ";" + next.grade + ";" + next.assetName + ";" + next.checkOutDate + ";" + next.condition + ";" + next.assetTag + ";"
+		}
+		
+		let blob = new Blob([csv], {type: 'text/csv'})
+		let a = document.createElement('a')
+		a.download = 'export.csv'
+		a.href = window.URL.createObjectURL(blob)
+		a.click()
+	}
+
+	// const {checkedOutAssets} = useTracker(() => {
+	// 	let assets = Assets.find({assigneeId: {$exists: true}}).fetch()
+	// 	let assetTypes = AssetTypes.find().fetch()
+	// 	let students = Students.find().fetch()
+	// 	let staff = Staff.find().fetch()
+	//	
+	// 	let assetTypesById = assetTypes.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+	// 	let studentsById = students.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+	// 	let staffById = staff.reduce((map, obj) => {map[obj._id] = obj; return map}, {})
+	//	
+	// 	for(let next of assets) {
+	// 		next.assetType = assetTypesById[next.assetTypeId]
+	// 		if(next.assigneeType === "Staff")
+	// 			next.person = staffById[next.assigneeId]
+	// 		else
+	// 			next.person = studentsById[next.assigneeId]
+	// 	}
+	//
+	// 	let checkedOutAssets = [];
+	//
+	// 	for(let next of assets) {
+	// 		if(next.assigneeType === "Student") {
+	// 			checkedOutAssets.push(next);
+	// 		}
+	// 	}
+	//
+	// 	return {checkedOutAssets}
+	// });
+
+	// people.push({firstName: student.firstName, lastName: student.lastName, grade: student.grade, assetName: assetType.name, checkOutDate: next.assignmentDate, condition: next.condition, assetTag: next.assetTag})
+	const columns = [
+		{
+			name: "First Name",
+			//value: (checkedOutAsset) => checkedOutAsset.person ? checkedOutAsset.person.firstName : ""
+			value: (next) => next.firstName
+		},
+		{
+			name: "Last Name",
+			// value: (checkedOutAsset) => checkedOutAsset.person ? checkedOutAsset.person.lastName : ""
+			value: (next) => next.lastName
+		},
+		{
+			name: "Grade",
+			value: (next) => next.grade,
+		},
+		{
+			name: "Asset",
+			value: (next) => next.assetName,
+		},
+		{
+			name: "Asset Tag",
+			value: (next) => next.assetTag,
+		},
+		{
+			name: "Checkout Date",
+			value: (next) => moment(next.assignmentDate).format("YYYY-MM-DD"),
+		},
+		{
+			name: "Condition",
+			value: (next) => next.condition,
+		},
+	]
+
+	const options = {
+		key: (row) => row._id,
+		// editor: (row, close) => {return (<AssetTypeEditor value={row} close={close}/>)},
+		add: false,
+		maxHeight: '40rem',
+		keyHandler: (e, selected) => {
+			// if(selected && selected._id && e.key === "Delete") {
+			// 	Meteor.call("assetTypes.remove", selected._id);
+			// }
+		}
+	}
+	
+	return (
+		<>
+			
+			<Box component="div" sx={{m: 2, p: 2, border: '1px dashed grey'}}>
+				<Button variant="contained" color='secondary' className="button" onClick={()=>exportData()}>Export</Button>
+			{/*	<h4 style={{margin: 0, padding: 0}}>Filter</h4>*/}
+			{/*	<Grid container spacing={2}>*/}
+			{/*		<Grid item xs={4}>*/}
+			{/*			<TextField style={cssEditorField} select variant="standard" value={assetTypeId} onChange={(e)=>{setAssetTypeId(e.target.value)}} label="Grade">*/}
+			{/*				{assetTypes.map((assetType, i) => {*/}
+			{/*					return <MenuItem key={i} value={assetType._id}>{assetType.name}</MenuItem>*/}
+			{/*				})}*/}
+			{/*			</TextField>*/}
+			{/*		</Grid>*/}
+			{/*	</Grid>*/}
+			</Box>
+			<SimpleTable rows={people} columns={columns} options={options}/>
+		</>
+	)
+}
+
+export default () => {
+	Meteor.subscribe('students');
+	Meteor.subscribe('staff');
+	Meteor.subscribe('assetTypes');
+	Meteor.subscribe('assets');
+
+	return (
+		<AssignmentsReport/>
+	)
+}