Added an initial cut at a student segement of the site, with a list of workshops and the ability to sign up for them.

imports/ui/pages/Home.jsx

@@ -0,0 +1,80 @@
+import { Meteor } from 'meteor/meteor';
+import React, { useState, useEffect } from 'react';
+import { useTracker } from 'meteor/react-meteor-data';
+import { useTheme } from '@mui/material/styles';
+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 Box from "@mui/material/Box";
+import ToggleButton from '@mui/material/ToggleButton';
+import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
+import Dialog from '@mui/material/Dialog';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogContentText from '@mui/material/DialogContentText';
+import DialogTitle from '@mui/material/DialogTitle';
+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";
+
+const cssTwoColumnContainer = {
+	display: 'grid',
+	gridTemplateColumns: "1fr 1fr",
+	columnGap: '1rem',
+	rowGap: '0.4rem',
+}
+const cssEditorField = {
+	minWidth: '10rem'
+}
+
+const Statistics = () => {
+	const [selectedMissingAsset, setSelectedMissingAsset] = useState("")
+	
+	const {missingAssets} = useTracker(() => {
+		let missingAssets = [];
+
+		missingAssets = Assets.find({condition: 'Missing'}).fetch();
+
+		for(let next of missingAssets) {
+			next.assetType = AssetTypes.findOne({_id: next.assetTypeId})
+		}
+
+		return {missingAssets}
+	});
+
+	const getListItemStyle = (item) => {
+		return {
+			backgroundColor: selectedMissingAsset === item ? '#EECFA6' : 'white'
+		}
+	}
+	
+	return (
+		<>
+			<h1>Missing Equipment</h1>
+			<List>
+				{missingAssets.map((next, i) => {
+					return (
+						<ListItemButton key={next._id} style={getListItemStyle(next)} selected={selectedMissingAsset === next} onClick={(e) => {setSelectedMissingAsset(next)}}>
+							<ListItemText primary={next.assetId} secondary={next.assetType.name}/>
+						</ListItemButton>
+					)
+				})}
+			</List>
+		</>
+	)
+}
+
+export default () => {
+	// Meteor.subscribe('students');
+	// Meteor.subscribe('staff');
+	Meteor.subscribe('assetTypes');
+	Meteor.subscribe('assets');
+
+	return (
+		<Statistics/>
+	)
+}