diff --git a/app/Http/Controllers/IngredientPickerController.php b/app/Http/Controllers/IngredientPickerController.php
index c559ad9..65850e5 100644
--- a/app/Http/Controllers/IngredientPickerController.php
+++ b/app/Http/Controllers/IngredientPickerController.php
@@ -2,18 +2,22 @@
 
 namespace App\Http\Controllers;
 
+use App\Models\Food;
 use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
 
 class IngredientPickerController extends Controller
 {
     /**
      * Search for ingredients.
      */
-    public function search(): JsonResponse
+    public function search(Request $request): JsonResponse
     {
-        return response()->json([
-            ['id' => 1, 'name' => 'Flour'],
-            ['id' => 2, 'name' => 'Eggs'],
-        ]);
+        $results = [];
+        $term = $request->query->get('term');
+        if (!empty($term)) {
+            $results = Food::search($term);
+        }
+        return response()->json($results);
     }
 }
diff --git a/app/Http/Controllers/RecipeController.php b/app/Http/Controllers/RecipeController.php
index 7caecb8..23c5d25 100644
--- a/app/Http/Controllers/RecipeController.php
+++ b/app/Http/Controllers/RecipeController.php
@@ -2,7 +2,6 @@
 
 namespace App\Http\Controllers;
 
-use App\Models\Food;
 use App\Models\FoodAmount;
 use App\Models\Recipe;
 use App\Models\RecipeStep;
@@ -73,7 +72,7 @@ class RecipeController extends Controller
     {
         return view('recipes.edit')
             ->with('recipe', $recipe)
-            ->with('food_units', new Collection([
+            ->with('ingredients_units', new Collection([
                 ['value' => 'tsp', 'label' => 'tsp.'],
                 ['value' => 'tbsp', 'label' => 'tbsp.'],
                 ['value' => 'cup', 'label' => 'cup'],
@@ -99,14 +98,14 @@ class RecipeController extends Controller
             'description' => 'nullable|string',
             'source' => 'nullable|string',
             'servings' => 'required|numeric',
-            'foods_amount' => ['required', 'array', new ArrayNotEmpty],
-            'foods_amount.*' => ['required_with:foods.*', 'nullable', new StringIsDecimalOrFraction],
-            'foods_unit' => ['required', 'array'],
-            'foods_unit.*' => 'nullable|string',
-            'foods_detail' => ['required', 'array'],
-            'foods_detail.*' => 'nullable|string',
-            'foods' => ['required', 'array', new ArrayNotEmpty],
-            'foods.*' => 'required_with:foods_amount.*|nullable|exists:App\Models\Food,id',
+            'ingredients_amount' => ['required', 'array', new ArrayNotEmpty],
+            'ingredients_amount.*' => ['required_with:ingredients.*', 'nullable', new StringIsDecimalOrFraction],
+            'ingredients_unit' => ['required', 'array'],
+            'ingredients_unit.*' => 'nullable|string',
+            'ingredients_detail' => ['required', 'array'],
+            'ingredients_detail.*' => 'nullable|string',
+            'ingredients' => ['required', 'array', new ArrayNotEmpty],
+            'ingredients.*' => 'required_with:ingredients_amount.*|nullable|exists:App\Models\Food,id',
             'steps' => ['required', 'array', new ArrayNotEmpty],
             'steps.*' => 'nullable|string',
         ]);
@@ -127,15 +126,15 @@ class RecipeController extends Controller
                 $food_amounts = [];
                 $weight = 0;
                 // TODO: Handle removals.
-                foreach (array_filter($input['foods_amount']) as $key => $amount) {
+                foreach (array_filter($input['ingredients_amount']) as $key => $amount) {
                     $food_amounts[$key] = $recipe->foodAmounts[$key] ?? new FoodAmount();
                     $food_amounts[$key]->fill([
                         'amount' => Number::floatFromString($amount),
-                        'unit' => $input['foods_unit'][$key],
-                        'detail' => $input['foods_detail'][$key],
+                        'unit' => $input['ingredients_unit'][$key],
+                        'detail' => $input['ingredients_detail'][$key],
                         'weight' => $weight++,
                     ]);
-                    $food_amounts[$key]->food()->associate($input['foods'][$key]);
+                    $food_amounts[$key]->food()->associate($input['ingredients'][$key]);
                 }
                 $recipe->foodAmounts()->saveMany($food_amounts);
 
diff --git a/app/Models/Food.php b/app/Models/Food.php
index 0208336..d95a2a0 100644
--- a/app/Models/Food.php
+++ b/app/Models/Food.php
@@ -4,6 +4,7 @@ namespace App\Models;
 
 use App\Models\Traits\Journalable;
 use App\Models\Traits\Sluggable;
+use App\Support\Number;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\HasMany;
@@ -84,7 +85,7 @@ class Food extends Model
     ];
 
     /**
-     * The attributes that should be cast.
+     * @inheritdoc
      */
     protected $casts = [
         'calories' => 'float',
@@ -97,6 +98,18 @@ class Food extends Model
         'sodium' => 'float',
     ];
 
+    /**
+     * @inheritdoc
+     */
+    protected $appends = ['serving_size_formatted'];
+
+    /**
+     * Get the serving size as a fractional.
+     */
+    public function getServingSizeFormattedAttribute(): string {
+        return Number::fractionStringFromFloat($this->serving_size);
+    }
+
     /**
      * Get the food amounts using this food.
      */
diff --git a/resources/views/components/ingredient-picker.blade.php b/resources/views/components/ingredient-picker.blade.php
index 7747975..946add9 100644
--- a/resources/views/components/ingredient-picker.blade.php
+++ b/resources/views/components/ingredient-picker.blade.php
@@ -2,33 +2,42 @@
     <div>
         <div>
             <x-inputs.input type="hidden"
-                            name="ingredients[{{ $index }}]"
+                            name="ingredients[]"
                             value="{{ $defaultId ?? '' }}"
-                            x-ref="ingredients{{ $index }}"/>
+                            x-ref="ingredients"/>
             <x-inputs.input type="text"
-                            name="ingredients_name[{{ $index }}]"
+                            name="ingredients_name[]"
                             value="{{ $defaultName ?? '' }}"
                             placeholder="Search..."
                             autocomplete="off"
                             x-on:input.debounce.400ms="if ($event.target.value != '') {
-                                fetch('{{ route('ingredient-picker.search') }}')
+                                fetch('{{ route('ingredient-picker.search') }}?term=' + $event.target.value)
                                   .then(response => response.json())
                                   .then(data => { results = data; searching = true; }); }"
                             x-on:focusout.debounce.200ms="searching = false;"
-                            x-ref="ingredients_name{{ $index }}" />
+                            x-ref="ingredients_name" />
         </div>
         <div x-show="searching" x-cloak>
             <div class="absolute border-2 border-gray-500 border-b-0 bg-white"
-                 x-on:click="selected = $event.target; if (selected.dataset.id) { $refs.ingredients_name{{ $index }}.value = selected.dataset.value; $refs.ingredients{{ $index }}.value = selected.dataset.id; searching = false; }">
+                 x-on:click="selected = $event.target; if (selected.dataset.id) { $refs.ingredients_name.value = selected.dataset.value; $refs.ingredients.value = selected.dataset.id; searching = false; }">
                 <template x-for="result in results" :key="result.id">
                     <div class="p-1 border-b-2 border-gray-500 hover:bg-yellow-300 cursor-pointer"
                          x-bind:data-id="result.id"
                          x-bind:data-value="result.name">
                         <div class="pointer-events-none">
                             <div x-text="result.name"></div>
+                            <div class="text-sm text-gray-600" x-text="result.brand" x-show="result.brand"></div>
+                            <div class="text-sm">
+                                Serving size <span x-text="result.serving_size_formatted"></span>
+                                <span x-text="result.serving_unit"></span>
+                                (<span x-text="result.serving_weight"></span>g)
+                            </div>
                         </div>
                     </div>
                 </template>
+                <div class="p-1 border-b-2 border-gray-500" x-cloak x-show="searching && results.length == 0">
+                    No results found.
+                </div>
             </div>
         </div>
     </div>
diff --git a/resources/views/recipes/edit.blade.php b/resources/views/recipes/edit.blade.php
index ebe2a85..37520fe 100644
--- a/resources/views/recipes/edit.blade.php
+++ b/resources/views/recipes/edit.blade.php
@@ -64,46 +64,40 @@
                         <!-- Ingredients -->
                         <h3 class="pt-2 mb-2 font-extrabold">Ingredients</h3>
                         <div x-data="{ ingredients: 0 }">
-{{--                            @foreach($recipe->foodAmounts as $foodAmount)--}}
-{{--                                <div class="flex flex-row space-x-4 mb-4">--}}
-{{--                                    <x-inputs.input type="text"--}}
-{{--                                                    name="foods_amount[]"--}}
-{{--                                                    size="5"--}}
-{{--                                                    :value="old('foods_amount.' . $loop->index, \App\Support\Number::fractionStringFromFloat($foodAmount->amount))" />--}}
-{{--                                    <x-inputs.select name="foods_unit[]"--}}
-{{--                                                     :options="$food_units"--}}
-{{--                                                     :selectedValue="old('foods_unit.' . $loop->index, $foodAmount->unit)">--}}
-{{--                                        <option value=""></option>--}}
-{{--                                    </x-inputs.select>--}}
-{{--                                    <livewire:food-picker :index="$loop->index"--}}
-{{--                                                          :default-id="old('foods.' . $loop->index, $foodAmount->food->id)"--}}
-{{--                                                          :default-name="old('foods_name.' . $loop->index, $foodAmount->food->name)" />--}}
-{{--                                    <x-inputs.input type="text"--}}
-{{--                                                    class="block"--}}
-{{--                                                    name="foods_detail[]"--}}
-{{--                                                    :value="old('foods_detail.' . $loop->index, $foodAmount->detail)" />--}}
-{{--                                </div>--}}
-{{--                            @endforeach--}}
+                            @foreach($recipe->foodAmounts as $foodAmount)
+                                <div class="flex flex-row space-x-4 mb-4">
+                                    <x-inputs.input type="text"
+                                                    name="ingredients_amount[]"
+                                                    size="5"
+                                                    :value="old('ingredients_amount.' . $loop->index, \App\Support\Number::fractionStringFromFloat($foodAmount->amount))" />
+                                    <x-inputs.select name="ingredients_unit[]"
+                                                     :options="$ingredients_units"
+                                                     :selectedValue="old('ingredients_unit.' . $loop->index, $foodAmount->unit)">
+                                        <option value=""></option>
+                                    </x-inputs.select>
+                                    <x-ingredient-picker :default-id="old('ingredients.' . $loop->index, $foodAmount->food->id)"
+                                                         :default-name="old('ingredients_name.' . $loop->index, $foodAmount->food->name)"/>
+                                    <x-inputs.input type="text"
+                                                    class="block"
+                                                    name="ingredients_detail[]"
+                                                    :value="old('ingredients_detail.' . $loop->index, $foodAmount->detail)" />
+                                </div>
+                            @endforeach
                             <template x-for="i in ingredients + 1">
-                                <x-ingredient-picker index="1" />
+                                <div class="flex flex-row space-x-4 mb-4">
+                                    <x-inputs.input type="text"
+                                                    name="ingredients_amount[]"
+                                                    size="5" />
+                                    <x-inputs.select name="ingredients_unit[]"
+                                                     :options="$ingredients_units" >
+                                        <option value=""></option>
+                                    </x-inputs.select>
+                                    <x-ingredient-picker/>
+                                    <x-inputs.input type="text"
+                                                    class="block"
+                                                    name="ingredients_detail[]" />
+                                </div>
                             </template>
-
-{{--                            <template x-for="i in ingredients + 1">--}}
-{{--                                <div class="flex flex-row space-x-4 mb-4">--}}
-{{--                                    <x-inputs.input type="text"--}}
-{{--                                                    name="foods_amount[]"--}}
-{{--                                                    size="5" />--}}
-{{--                                    <x-inputs.select name="foods_unit[]"--}}
-{{--                                                     :options="$food_units" >--}}
-{{--                                        <option value=""></option>--}}
-{{--                                    </x-inputs.select>--}}
-{{--                                    <!-- TODO: Get this working in the template. See wire:init or use wire:click? -->--}}
-{{--                                    <livewire:food-picker index="1" />--}}
-{{--                                    <x-inputs.input type="text"--}}
-{{--                                                    class="block"--}}
-{{--                                                    name="foods_detail[]" />--}}
-{{--                                </div>--}}
-{{--                            </template>--}}
                             <x-inputs.button type="button" class="ml-3" x-on:click="ingredients++;">
                                 Add Ingredient
                             </x-inputs.button>