KitsonBroadhurst

import React, { useState, useEffect } from 'react'
// fetchOptionsGenerator is a bespoke header generator for our use case
import fetchOptionsGenerator from "./fetchOptionsGenerator"

/**
 * Data fetching hook which takes a route url as a string
 * and returns data from the backend for that route, along with a loading and error variable
 * @param route: string
 */

KitsonBroadhurst

import React from 'react'

import { Card,
         CardActionArea,
         CardMedia,
         CardContent,
         Typography,
         CardActions,
         Button }     from '@material-ui/core'
import { makeStyles } from '@material-ui/styles'

KitsonBroadhurst

import React, { useState, useLayoutEffect } from 'react'

const useWindowSize = () => {
  const [size, setSize] = useState([0, 0])
  
  useLayoutEffect(() => {
    const updateSize = () => {
      setSize([window.innerWidth, window.innerHeight])
    }
    

KitsonBroadhurst

import React, { useState, useEffect, useRef } from 'react'

const SignUpForm = () => {
  // we use the help of useRef to test if it's the first render
  const firstRender = useRef(true)

  // set a state variable which can be used to disable the save/submit button
  // we set it to true so that the form is disabled on first render
  const [disable, setDisabled] = useState(true)