Create ItemProvider w/ Docs

src/components/ItemProvider/ItemProvider.js

@@ -0,0 +1,29 @@
+import React, { useState, createContext, useContext, useEffect } from "react";
+
+const ItemContext = createContext();
+const ItemSetterContext = createContext();
+
+export const useItem = () => useContext(ItemContext);
+export const useItemSetter = () => useContext(ItemSetterContext);
+
+
+
+export default function ItemProvider({ children }) {
+	const [item, setItem] = useState( {} );
+
+	useEffect( _ => console.log("Current Item is: ", item));
+
+	const setItemWrapper = (newItem) => {
+		console.log("Old Item: ", item);
+		setItem(newItem);
+		console.log("Set new item.");
+	}
+
+	return (
+		<ItemContext.Provider value={item}>
+			<ItemSetterContext.Provider value={setItemWrapper}>
+				{children}
+			</ItemSetterContext.Provider>
+		</ItemContext.Provider>
+	);
+};

src/components/ItemProvider/ItemProvider.md

@@ -0,0 +1,41 @@
+Utility component that uses [React Contexts](https://reactjs.org/docs/context.html) [React Stateful Variables](https://reactjs.org/docs/hooks-state.html) to provide global access to the active item object. 
+
+Two functions are exported:
+
+Function | Descrioption
+- | -
+`useItem` | Returns a reference to the state variable holding the current Item. Defaults to `false`.
+`useItemSetter` | Returns a reference to the state variable update function.
+
+For an in depth explanation of this pattern, see [this GitHub comment](https://github.itap.purdue.edu/ECN/webqueue2/issues/15#issuecomment-341).
+
+
+## Usage
+```jsx static
+// App
+<ItemProvider>
+    <SomeComponent />
+</ItemProvider>
+```
+
+```jsx static
+// SomeComponent
+import { useEffect } from "react";
+import { useItem, useItemSetter } from "ItemProvider";
+
+const activeItem = useItem();
+const setActiveItem = useItemSetter();
+
+useEffect(
+    let item = someFuncToGetItem();
+    setActiveItem(item);
+);
+
+return(
+    {
+        item
+            ? <p>{`${activeItem.queue} ${activeItem.number} was last updated ${activeItem.lastUpdated}.`}</p>
+            : <p>No item is currently loaded.</p>
+    }
+);
+```

src/components/ItemProvider/index.js

@@ -0,0 +1 @@
+export {default, useItem, useItemSetter } from "./ItemProvider";