Merge branch 'dev' into 'google_auth'

# Conflicts:
#   src/pages/OrderIndexPage.tsx

src/components/SearchOrder.tsx

+import React, { useState, useEffect } from 'react'
+import { Link } from 'react-router-dom'
+import { Order } from 'Order';
+
+
+
+const SearchOrder = (props: any) => {
+    const orders = props.orders;
+
+    const [searchInput, setSearchInput] = useState("");
+    const [searchResult, setSearchResult] = useState([]);
+
+    console.log("ORDERS", orders)
+
+    // console.log("props", props)
+
+
+    const handleSearchInput = (event: any) => {
+        setSearchInput(event.target.value);
+    }
+
+    const resetInputField = () => {
+        setSearchInput("");
+    }
+
+    useEffect(() => {
+        if (orders.length > 0) {
+            const res = orders.filter((order: any) => 
+                order.orderNumber.includes(searchInput) //|| order.date.includes(searchInput)
+                // console.log(orderNum)
+
+            );
+            // debugger
+            setSearchResult(res);
+        }
+    }, [searchInput]);
+
+
+    return (
+        <div>
+            <h1>Search</h1>
+            <input
+                type="text"
+                placeholder="Search"
+                value={searchInput}
+                onChange={handleSearchInput}
+            />
+            <ul>
+
+                {searchResult.map((item: any, idx) => {
+                    // debugger
+                    return (
+                        <li key={idx}>
+                            <Link to={"/orders/" + item.orderNumber}>{item.orderNumber}</Link>
+                        </li>
+                    )
+                })} 
+            </ul>
+        </div>
+    );
+}
+
+export default SearchOrder
+
+

src/components/index.ts

@@ -3,4 +3,5 @@ export {default as LoginForm} from './LoginForm'
 export {default as Nav} from './Nav'
 export {default as OrderDetails} from './OrderDetails'
 export {default as SignUpForm} from './SignUpForm'
-export {default as OrderShowDetails} from './OrderShowDetails'
\ No newline at end of file
+export {default as OrderShowDetails} from './OrderShowDetails'
+export {default as SearchOrder} from './SearchOrder'
\ No newline at end of file

src/pages/OrderIndexPage.tsx

 import React, {useState, useEffect} from 'react'
-import {OrderDetails} from 'components'
+import {OrderDetails, SearchOrder} from 'components'
+import { OrderService } from 'services';
 import { Order } from 'Order';
 import { useAllOrders } from 'hooks'
 
@@ -26,6 +27,7 @@ const OrderIndexPage = () => {
                     {orderDetailsArr}
                 </tbody>
             </table>
+            <SearchOrder orders={orders}/>
         </>
     )
 }