global.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Global</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Global</h1>

    
<section>

<header>
    
        <h2></h2>
        
    
</header>

<article>
    <div class="container-overview">
    
        
<dl class="details">

    
</dl>


    </div>

    
        <h3 class="subsection-title">Members</h3>

        
<h4 class="name" id="HOST"><span class="type-signature">(constant) </span>HOST<span class="type-signature"> :string</span></h4>


<div class="description">
    The base URL for the API server
</div>


    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">string</span>


        </li>
    </ul>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="host.js.html">host.js</a>, <a href="host.js.html#line13">line 13</a>
    </li></ul></dd>
    

</dl>


<h4 class="name" id="PrivateRouteCashier"><span class="type-signature">(constant) </span>PrivateRouteCashier<span class="type-signature"></span></h4>


<div class="description">
    A React memoized component that wraps the given children in a Private Route that restricts access to authorized users only.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_PrivateRoute_privateCashier.js.html">pages/PrivateRoute/privateCashier.js</a>, <a href="pages_PrivateRoute_privateCashier.js.html#line17">line 17</a>
    </li></ul></dd>
    

</dl>


<h4 class="name" id="PrivateRouteManager"><span class="type-signature">(constant) </span>PrivateRouteManager<span class="type-signature"></span></h4>


<div class="description">
    A higher-order component that renders its children only if the user is authorized as a manager.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_PrivateRoute_privateManager.js.html">pages/PrivateRoute/privateManager.js</a>, <a href="pages_PrivateRoute_privateManager.js.html#line17">line 17</a>
    </li></ul></dd>
    

</dl>


<h4 class="name" id="local"><span class="type-signature">(constant) </span>local<span class="type-signature"> :string</span></h4>


<div class="description">
    The current hostname of the window object
</div>


    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">string</span>


        </li>
    </ul>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="host.js.html">host.js</a>, <a href="host.js.html#line6">line 6</a>
    </li></ul></dd>
    

</dl>


<h4 class="name" id="root"><span class="type-signature">(constant) </span>root<span class="type-signature"> :ReactRoot</span></h4>


<div class="description">
    The root element of the React application
</div>


    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">ReactRoot</span>


        </li>
    </ul>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="index.js.html">index.js</a>, <a href="index.js.html#line11">line 11</a>
    </li></ul></dd>
    

</dl>


        <h3 class="subsection-title">Methods</h3>

        
    <h4 class="name" id="App"><span class="type-signature"></span>App<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A React component for the main App
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_App.js.html">pages/App.js</a>, <a href="pages_App.js.html#line32">line 32</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - The App component's UI
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Cashier"><span class="type-signature"></span>Cashier<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for the Cashier section of the app
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_Cashier.js.html">pages/cashier/Cashier.js</a>, <a href="pages_cashier_Cashier.js.html#line12">line 12</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    Cashier component JSX
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="CashierDrink"><span class="type-signature"></span>CashierDrink<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for the Cashier section of the app
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_CashierDrink.js.html">pages/cashier/CashierDrink.js</a>, <a href="pages_cashier_CashierDrink.js.html#line13">line 13</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    Cashier Drink component JSX
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="CashierHeader"><span class="type-signature"></span>CashierHeader<span class="signature">()</span><span class="type-signature"></span></h4>
    

<div class="description">
    Component representing the header for the cashier section of the app.
Contains buttons for navigating between different cashier menu categories.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_CashierHeader.js.html">pages/cashier/CashierHeader.js</a>, <a href="pages_cashier_CashierHeader.js.html#line11">line 11</a>
    </li></ul></dd>
    

</dl>


    <h4 class="name" id="CashierMeal"><span class="type-signature"></span>CashierMeal<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for the Cashier section of the app
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_CashierMeal.js.html">pages/cashier/CashierMeal.js</a>, <a href="pages_cashier_CashierMeal.js.html#line12">line 12</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    Cashier Meal component JSX
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="CashierSauce"><span class="type-signature"></span>CashierSauce<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for the Cashier section of the app
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_CashierSauce.js.html">pages/cashier/CashierSauce.js</a>, <a href="pages_cashier_CashierSauce.js.html#line14">line 14</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    Cashier Sauce component JSX
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="CashierSeasonal"><span class="type-signature"></span>CashierSeasonal<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for the Cashier section of the app
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_cashier_CashierSeasonal.js.html">pages/cashier/CashierSeasonal.js</a>, <a href="pages_cashier_CashierSeasonal.js.html#line13">line 13</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    Cashier Seasonal component JSX
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Customer"><span class="type-signature"></span>Customer<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A functional component that represents a customer page in a restaurant.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_customer_Customer.js.html">pages/customer/Customer.js</a>, <a href="pages_customer_Customer.js.html#line19">line 19</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    The JSX representation of the customer component.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="CustomerDrink"><span class="type-signature"></span>CustomerDrink<span class="signature">()</span><span class="type-signature"></span></h4>
    

<div class="description">
    Represents a component for ordering drinks as a customer.

Uses state to keep track of the menu items and the total cost of the order.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_customer_CustomerDrink.js.html">pages/customer/CustomerDrink.js</a>, <a href="pages_customer_CustomerDrink.js.html#line15">line 15</a>
    </li></ul></dd>
    

</dl>


    <h4 class="name" id="ExcessReport"><span class="type-signature"></span>ExcessReport<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A functional component that displays an excess report of items for a given date range.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ExcessReport.js.html">pages/manager/ExcessReport.js</a>, <a href="pages_manager_ExcessReport.js.html#line11">line 11</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    ExcessReport component JSX code
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Home"><span class="type-signature"></span>Home<span class="signature">(user, setUser)</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    Home component that handles user login using Google accounts
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>user</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            </td>

            
            <td class="description last">User object</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>setUser</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            </td>

            
            <td class="description last">Function to update user object</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_home_Home.js.html">pages/home/Home.js</a>, <a href="pages_home_Home.js.html#line17">line 17</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - Home component JSX elements
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Inventory"><span class="type-signature"></span>Inventory<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    React component for displaying the inventory.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_Inventory.js.html">pages/manager/Inventory.js</a>, <a href="pages_manager_Inventory.js.html#line8">line 8</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    JSX element of the inventory component.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Login"><span class="type-signature"></span>Login<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    The Login component's UI, which renders a Google login button that can be used to authenticate with the Google API
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="login_comp_login.js.html">login_comp/login.js</a>, <a href="login_comp_login.js.html#line12">line 12</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - The Login component's UI
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Logout"><span class="type-signature"></span>Logout<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    The Logout component's UI, which renders a Google logout button that can be used to log out of the Google API
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="login_comp_logout.js.html">login_comp/logout.js</a>, <a href="login_comp_logout.js.html#line11">line 11</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - The Logout component's UI
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Manager"><span class="type-signature"></span>Manager<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    Renders the Manager component.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_Manager.js.html">pages/manager/Manager.js</a>, <a href="pages_manager_Manager.js.html#line21">line 21</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    The rendered component.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="MenuAdder"><span class="type-signature"></span>MenuAdder<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A React component that allows the user to add ingredients and create a menu item.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_AddMenuItem.js.html">pages/manager/AddMenuItem.js</a>, <a href="pages_manager_AddMenuItem.js.html#line11">line 11</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    A React component that includes input fields for adding ingredients, and creating a menu item.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="MenuItems"><span class="type-signature"></span>MenuItems<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    MenuItems Component - displays a list of menu items
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_MenuItems.js.html">pages/manager/MenuItems.js</a>, <a href="pages_manager_MenuItems.js.html#line9">line 9</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - JSX element representing the MenuItems component
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="Orders"><span class="type-signature"></span>Orders<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    Functional component for displaying orders and their details.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_Orders.js.html">pages/manager/Orders.js</a>, <a href="pages_manager_Orders.js.html#line12">line 12</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    The Orders component
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="UserInputLogger"><span class="type-signature"></span>UserInputLogger<span class="signature">()</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A React component that logs user input to the console.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_AddIngredient.js.html">pages/manager/AddIngredient.js</a>, <a href="pages_manager_AddIngredient.js.html#line10">line 10</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    A React component that includes an input field and a button to log the user's input to the console.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="getMenuEffect"><span class="type-signature"></span>getMenuEffect<span class="signature">(dependencies)</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    This effect retrieves the menu from the server and sets the state of the menu and menu1.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>dependencies</code></td>
            

            <td class="type">
            
                
<span class="param-type">Array</span>


            </td>

            
            <td class="description last">an empty array indicating that the effect should only run once on mount.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_menu_Menu.js.html">pages/menu/Menu.js</a>, <a href="pages_menu_Menu.js.html#line33">line 33</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="getMenuPrice"><span class="type-signature"></span>getMenuPrice<span class="signature">(menuItemId, menu)</span><span class="type-signature"> &rarr; {number|null}</span></h4>
    

<div class="description">
    Gets the price of a menu item given its ID.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>menuItemId</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            </td>

            
            <td class="description last">ID of the menu item to get the price for.</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>menu</code></td>
            

            <td class="type">
            
                
<span class="param-type">object</span>


            </td>

            
            <td class="description last">Object containing menu items and their prices.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_customer_Customer.js.html">pages/customer/Customer.js</a>, <a href="pages_customer_Customer.js.html#line136">line 136</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    The price of the menu item or null if it doesn't exist in the menu object.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">number</span>
|

<span class="param-type">null</span>


    </dd>
</dl>

    
    <h4 class="name" id="handleComplete"><span class="type-signature">(async) </span>handleComplete<span class="signature">(z<span class="signature-attributes">opt</span>)</span><span class="type-signature"> &rarr; {Promise.&lt;void>}</span></h4>
    

<div class="description">
    Completes the order by updating the order and inventory states
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>z</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

                <td class="default">
                
                    'cashier'
                
                </td>
            

            <td class="description last">The role of the user completing the order</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="hooks_CashierHelper.js.html">hooks/CashierHelper.js</a>, <a href="hooks_CashierHelper.js.html#line50">line 50</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Promise.&lt;void></span>


    </dd>
</dl>

    
    <h4 class="name" id="handleIdChange"><span class="type-signature"></span>handleIdChange<span class="signature">(event)</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    Handles changing the value of 'id' based on the input event.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            </td>

            
            <td class="description last">The input event object.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ChangeMenu.js.html">pages/manager/ChangeMenu.js</a>, <a href="pages_manager_ChangeMenu.js.html#line35">line 35</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="handleInventory"><span class="type-signature">(async) </span>handleInventory<span class="signature">(key)</span><span class="type-signature"> &rarr; {Promise.&lt;void>}</span></h4>
    

<div class="description">
    Updates the inventory after an order is placed
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>key</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            </td>

            
            <td class="description last">The key of the item in the current items state</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="hooks_CashierHelper.js.html">hooks/CashierHelper.js</a>, <a href="hooks_CashierHelper.js.html#line24">line 24</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Promise.&lt;void></span>


    </dd>
</dl>

    
    <h4 class="name" id="handleNameChange"><span class="type-signature"></span>handleNameChange<span class="signature">(event)</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    Handles changing the value of 'name' based on the input event.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            </td>

            
            <td class="description last">The input event object.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ChangeMenu.js.html">pages/manager/ChangeMenu.js</a>, <a href="pages_manager_ChangeMenu.js.html#line55">line 55</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="handleNewOrder"><span class="type-signature"></span>handleNewOrder<span class="signature">()</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    Sets the current items and total cost to zero to start a new order
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="hooks_CashierHelper.js.html">hooks/CashierHelper.js</a>, <a href="hooks_CashierHelper.js.html#line13">line 13</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="handlePriceChange"><span class="type-signature"></span>handlePriceChange<span class="signature">(event)</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    Handles changing the value of 'price' based on the input event.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            </td>

            
            <td class="description last">The input event object.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ChangeMenu.js.html">pages/manager/ChangeMenu.js</a>, <a href="pages_manager_ChangeMenu.js.html#line45">line 45</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="handleSubmit"><span class="type-signature"></span>handleSubmit<span class="signature">()</span><span class="type-signature"></span></h4>
    

<div class="description">
    A functional component that changes menu items
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ChangeMenu.js.html">pages/manager/ChangeMenu.js</a>, <a href="pages_manager_ChangeMenu.js.html#line4">line 4</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
    <h4 class="name" id="handleSubmit"><span class="type-signature"></span>handleSubmit<span class="signature">()</span><span class="type-signature"> &rarr; {Promise.&lt;void>}</span></h4>
    

<div class="description">
    Handles submitting the changes for the menu based on the current values of 'id', 'price' and 'name'. Sends the updated values to the server to change the price and name of the menu.
</div>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_manager_ChangeMenu.js.html">pages/manager/ChangeMenu.js</a>, <a href="pages_manager_ChangeMenu.js.html#line15">line 15</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Promise.&lt;void></span>


    </dd>
</dl>

    
    <h4 class="name" id="useEffect"><span class="type-signature">(async) </span>useEffect<span class="signature">(apiKey, HOST, setTemp, setMenu)</span><span class="type-signature"> &rarr; {void}</span></h4>
    

<div class="description">
    Fetches weather data from OpenWeatherMap API and sets the temperature state.
Fetches the menu from the server and sets the menu state.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>apiKey</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            </td>

            
            <td class="description last">API key for OpenWeatherMap API.</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>HOST</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            </td>

            
            <td class="description last">URL for the server to fetch menu from.</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>setTemp</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            </td>

            
            <td class="description last">State setter function for temperature.</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>setMenu</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            </td>

            
            <td class="description last">State setter function for menu.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_customer_Customer.js.html">pages/customer/Customer.js</a>, <a href="pages_customer_Customer.js.html#line93">line 93</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">void</span>


    </dd>
</dl>

    
    <h4 class="name" id="useGoogleSignIn"><span class="type-signature"></span>useGoogleSignIn<span class="signature">(handleCallbackResponse)</span><span class="type-signature"> &rarr; {JSX.Element}</span></h4>
    

<div class="description">
    A hook that initializes and renders the Google Sign-In button to allow users to sign in using their Google account.
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>handleCallbackResponse</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            </td>

            
            <td class="description last">A function to handle the response from the Google Sign-In API.</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_home_Home.js.html">pages/home/Home.js</a>, <a href="pages_home_Home.js.html#line33">line 33</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    - Returns a JSX element containing the Google Sign-In button.
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">JSX.Element</span>


    </dd>
</dl>

    
    <h4 class="name" id="useLocalState"><span class="type-signature"></span>useLocalState<span class="signature">(defaultValue, key)</span><span class="type-signature"> &rarr; {Array}</span></h4>
    

<div class="description">
    Custom hook for managing state using local storage
</div>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>defaultValue</code></td>
            

            <td class="type">
            
                
<span class="param-type">*</span>


            </td>

            
            <td class="description last">the initial value of the state</td>
        </tr>

    
        <tr>
            
                <td class="name"><code>key</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            </td>

            
            <td class="description last">the key to use for the local storage item</td>
        </tr>

    
    </tbody>
</table>


<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="pages_util_useLocalStorage.js.html">pages/util/useLocalStorage.js</a>, <a href="pages_util_useLocalStorage.js.html#line12">line 12</a>
    </li></ul></dd>
    

</dl>


<h5>Returns:</h5>

        
<div class="param-desc">
    an array containing the state value and the function to update it
</div>


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array</span>


    </dd>
</dl>

    
</article>

</section>


</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Global</h3><ul><li><a href="global.html#App">App</a></li><li><a href="global.html#Cashier">Cashier</a></li><li><a href="global.html#CashierDrink">CashierDrink</a></li><li><a href="global.html#CashierHeader">CashierHeader</a></li><li><a href="global.html#CashierMeal">CashierMeal</a></li><li><a href="global.html#CashierSauce">CashierSauce</a></li><li><a href="global.html#CashierSeasonal">CashierSeasonal</a></li><li><a href="global.html#Customer">Customer</a></li><li><a href="global.html#CustomerDrink">CustomerDrink</a></li><li><a href="global.html#ExcessReport">ExcessReport</a></li><li><a href="global.html#HOST">HOST</a></li><li><a href="global.html#Home">Home</a></li><li><a href="global.html#Inventory">Inventory</a></li><li><a href="global.html#Login">Login</a></li><li><a href="global.html#Logout">Logout</a></li><li><a href="global.html#Manager">Manager</a></li><li><a href="global.html#MenuAdder">MenuAdder</a></li><li><a href="global.html#MenuItems">MenuItems</a></li><li><a href="global.html#Orders">Orders</a></li><li><a href="global.html#PrivateRouteCashier">PrivateRouteCashier</a></li><li><a href="global.html#PrivateRouteManager">PrivateRouteManager</a></li><li><a href="global.html#UserInputLogger">UserInputLogger</a></li><li><a href="global.html#getMenuEffect">getMenuEffect</a></li><li><a href="global.html#getMenuPrice">getMenuPrice</a></li><li><a href="global.html#handleComplete">handleComplete</a></li><li><a href="global.html#handleIdChange">handleIdChange</a></li><li><a href="global.html#handleInventory">handleInventory</a></li><li><a href="global.html#handleNameChange">handleNameChange</a></li><li><a href="global.html#handleNewOrder">handleNewOrder</a></li><li><a href="global.html#handlePriceChange">handlePriceChange</a></li><li><a href="global.html#handleSubmit">handleSubmit</a></li><li><a href="global.html#local">local</a></li><li><a href="global.html#root">root</a></li><li><a href="global.html#useEffect">useEffect</a></li><li><a href="global.html#useGoogleSignIn">useGoogleSignIn</a></li><li><a href="global.html#useLocalState">useLocalState</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.2</a> on Tue May 02 2023 22:48:22 GMT-0500 (Central Daylight Time)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>