From a1462ed9e0aebcf6cba26808428219d7256f4138 Mon Sep 17 00:00:00 2001 From: Ruidy Nemausat Date: Mon, 27 Jan 2020 15:48:18 +0100 Subject: [PATCH] SearchBar & Page --- README.md | 6 ++- public/index.html | 8 ++-- public/manifest.json | 2 +- src/App.js | 76 +++++++++++++++--------------- src/components/SearchBar.js | 32 +++++++++---- src/components/SearchResult.js | 20 ++++++++ src/components/SearchResultList.js | 16 ------- src/pages/CategoryList.js | 2 +- src/pages/Meal.js | 4 +- src/pages/Search.js | 34 ++++++------- 10 files changed, 113 insertions(+), 87 deletions(-) create mode 100644 src/components/SearchResult.js delete mode 100644 src/components/SearchResultList.js diff --git a/README.md b/README.md index f1acf93..efa9bc7 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,8 @@ Free meal planner for cooks short on ideas! (like me …) +[Available on](https://chefs-meal-planner.onrender.com/) + ## Features - Random meal suggestion @@ -52,6 +54,7 @@ Free meal planner for cooks short on ideas! (like me …) - Notation system: know what are the most loved meals - Suggestions based on what your personal taste - Recipes in Video +- Get a full menu (Starter, Main, Dessert + Cocktail) ## Supports @@ -68,7 +71,7 @@ Free meal planner for cooks short on ideas! (like me …) ## Versions -### Features in V.1 +### Features in V.0.1 - WebApp - Random meal suggestion @@ -78,3 +81,4 @@ Free meal planner for cooks short on ideas! (like me …) ## TO DO - put a preloader +- change favicon diff --git a/public/index.html b/public/index.html index 4fba074..e536c43 100644 --- a/public/index.html +++ b/public/index.html @@ -5,7 +5,7 @@ - + @@ -25,15 +25,15 @@ href="https://fonts.googleapis.com/icon?family=Material+Icons" /> - Chef's Meal Planner + Chef's | Meal Planner - -->
diff --git a/public/manifest.json b/public/manifest.json index 9a0ef6e..8cdd059 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -18,7 +18,7 @@ "sizes": "512x512" } ], - "start_url": ".", + "start_url": "/", "display": "standalone", "theme_color": "#000000", "background_color": "#ffffff" diff --git a/src/App.js b/src/App.js index 35aa7d5..f574adf 100644 --- a/src/App.js +++ b/src/App.js @@ -15,6 +15,7 @@ const App = () => { // State Hooks const [searchString, setSearchString] = useState(""); const [categories, setCategories] = useState({ categories: [] }); + const [searchResults, setSearchResults] = useState({ meals: [] }); // const [isLoading, setIsLoading] = useState(true); For Preloader // Default meal object. TODO: Find a better alternative … const mealDef = { @@ -87,8 +88,11 @@ const App = () => { return `${ROOT}${option}.php?c=${keyword}`; } else if (option === "lookup") { return `${ROOT}${option}.php?i=${keyword}`; + } else if (option === "search") { + return `${ROOT}${option}.php?s=${keyword}`; } }; + const getFromAPI = (keyword, set, option = null) => { const URI = createURI(keyword, option); fetch(URI) @@ -111,6 +115,10 @@ const App = () => { getFromAPI("categories", setCategories); }; + const getSearchResults = () => { + getFromAPI(searchString, setSearchResults, "search"); + }; + const handleChange = ev => { const { value } = ev.target; setSearchString(value); @@ -121,42 +129,30 @@ const App = () => {
- +
- ( - - )} + + + + + + /> - ( - - )} - /> - ( - - )} + + + /> { meal={meal} /> + + + - - {/* We'll have to input searchResults somewhere */} - } + + + />