diff --git a/src/Components/Product/Filters.jsx b/src/Components/Product/Filters.jsx
new file mode 100644
index 00000000..51c8ef17
--- /dev/null
+++ b/src/Components/Product/Filters.jsx
@@ -0,0 +1,51 @@
+import React, { useContext } from 'react';
+
+import { GlobalState } from '../../GlobalState';
+
+function Filters() {
+    const state = useContext(GlobalState)
+    const [products, setProducts] = state.productsAPI.products
+    const [categories] = state.productsAPI.categories
+    const [category, setCategory] = state.productsAPI.category
+    const [sort, setSort] = state.productsAPI.sort
+    const [search, setSearch] = state.productsAPI.search
+
+
+    const handleCategory = e => {
+        setCategory(e.target.value)
+        setSearch('')
+    }
+
+    return (
+        <div className="filter_menu">
+            <div className="row">
+                <span>Filters: </span>
+                <select name="category" value={category} onChange={handleCategory} >
+                    <option value="">All Products</option>
+                    {
+                        categories.map(category => (
+                            <option value={"category=" + category._id} key={category._id}>
+                                {category.name}
+                            </option>
+                        ))
+                    }
+                </select>
+            </div>
+            <input type="text" value={search} placeholder="Enter your search"
+                onChange={e => setSearch(e.target.value.toLowerCase())}
+            />
+            <div className="row sort">
+                <span>Sort By: </span>
+                <select value={sort} onChange={e => setSort(e.target.value)} >
+                    <option value="">Newest</option>
+                    <option value="sort=oldest">Oldest</option>
+                    <option value="sort=-sold">Best sales</option>
+                    <option value="sort=-price">Price: High-Low</option>
+                    <option value="sort=price">Price: Low-High</option>
+                </select>
+            </div>
+        </div>
+    )
+}
+
+export default Filters;