function wait(time) {
    return new Promise(resolve => {
        setTimeout(resolve, time);
    });
}

// Get list of all alcoholic drink IDs from API 
axios.get(`${process.env.API}/filter.php?a=Alcoholic`)
...
axios.get(`${process.env.API}/filter.php?a=Non_Alcoholic`)
...
.then(async response => {
    let drinks = response.data.drinks;
    let numDrinks = drinks.length;
    for (let i = 0; i < numDrinks; i++) {
        drinkIds.push(drinks[i].idDrink);
    }
    for (let i = 0; i < drinkIds.length; i++) {
        axios.get(`${process.env.API}/lookup.php?i=${drinkIds[i]}`)
        .then(response => {
            let drink = response.data.drinks[0];
            let newDrink = {...}
            Recipe.create(newDrink)
            .then(async createdDrink => {     
                for (let i = 1; i <= 15; i++) {
                    let ingredient = drink[`strIngredient${i}`];
                    if (ingredient) {                           
                        await Ingredient.findOne({ name: firstLettersCapitalized(drink[`strIngredient${i}`])})
                        .then(ingredient => {
                            createdDrink.ingredients.push(ingredient);
                            createdDrink.measures.push(drink[`strMeasure${i}`]);
                        })
                        .catch(err => console.log(err.message));
                    }}
                createdDrink.save()
                .then(savedDrink => console.log(savedDrink.name))
                .catch(err => console.log(err.message));
            })})
        .catch(err => console.log(err.message));
        // Wait half a second to avoid API throttling
        await wait(500);
    }
})

const recipeSchema = new mongoose.Schema({
    name: {type: String, required: true},
    ingredients: [{ type: mongoose.Schema.Types.ObjectId, ref: 'Ingredient' }],
    measures: [String],
    instructions: String,
    alcoholic: {type: Boolean, required: true},
    image: String,
    createdBy: [{ type: mongoose.Schema.Types.ObjectId, ref: 'User' }],
    glassType: String,
    category: String,
    favoriteCount: { type: Number, default: 0 },
    comments: [{ type: mongoose.Schema.Types.ObjectId, ref: 'Comment' }],
},{ timestamps:true })

const Recipe = mongoose.model('Recipe', recipeSchema);

 const renderScrollTile = () => {
        if(recipes) {
            const recipeTiles = recipes.map((recipe, i) => (
                <RecipePreviewContainer key={recipe._id} recipe={recipe} />
            ));
            const rows = [];
            for (let i = 0; i < recipeTiles.length; i += 2) {
                rows.push(
                    <div className='tile is-parent'>
                        {recipeTiles[i]}
                        {i + 1 < recipeTiles.length ? recipeTiles[i + 1] : null}
                    </div>
                )
            }
            return rows;
        }
    }

export default function Search() {
...
    const updateIngredientOptions = useCallback((newQuery) => {
        if(newQuery) {
            if(ingredientsLoading) {
                return setIngredientsList(['Loading...']);
            }
            const results = ingredients.filter(ingredient => {
                if (newQuery === '') return true;

                let isAlreadySelected = false;
                selectedParams.forEach(param => {
                    if (ingredient._id === param._id) isAlreadySelected = true;
                });
                if (isAlreadySelected) return false;
                
                return ingredient.name.toLowerCase().includes(newQuery.toLowerCase());
            });
            setIngredientsList(results);
        }
    }, [ingredients, selectedParams, ingredientsLoading]);
    
    const handleChange = (e) => {
        const newQuery = e.target.value;
        setQuery(newQuery);
        updateIngredientOptions(newQuery);
        updateRecipeOptions(newQuery);
        updateUserOptions(newQuery);
    }

    const addParam = (ingredient) => {
        let newParams = [...selectedParams];
        newParams.push(ingredient);
        setSelectedParams(newParams);
        updateIngredientOptions();
    }

    const removeParam = (ingredient) => { ... }


    useEffect(() => {
        updateIngredientOptions(query);
        updateRecipeOptions(query);
        updateUserOptions(query);
    }, [selectedParams, query, updateIngredientOptions, updateRecipeOptions, updateUserOptions]);
    
    return (
        <>
            <div>
                <form onSubmit={handleSubmit}>
                    <input type="search" value={query} onChange={handleChange} />
                    <button type="submit">Search</button>
                </form>
                <ul style={paramStyle}>
                    {(selectedParams === '' ? '' : selectedParams.map(param => {
                        return <li key={param._id}>{param.name} <a onClick={() => {
                            removeParam(param);
                            updateIngredientOptions();
                        }}>X</a></li>
                    }))}
                </ul>
                ...
            </div>
        </>
    );
}