Issue #11 🎫: Navigation bar

app/controllers/foods_controller.rb

@@ -1,9 +1,10 @@
 class FoodsController < ApplicationController
+  before_action :authenticate_user!
   before_action :set_food, only: %i[show edit update destroy]
 
   # GET /foods or /foods.json
   def index
-    @foods = Food.all
+    @foods = Food.where(user_id: current_user.id)
   end
 
   # GET /foods/1 or /foods/1.json
@@ -20,10 +21,12 @@ def edit; end
   # POST /foods or /foods.json
   def create
     @food = Food.new(food_params)
+    @food.user = current_user
 
     respond_to do |format|
       if @food.save
-        format.html { redirect_to food_url(@food), notice: 'Food was successfully created.' }
+        flash[:success] = 'Food was successfully created.'
+        format.html { redirect_to foods_path }
         format.json { render :show, status: :created, location: @food }
       else
         format.html { render :new, status: :unprocessable_entity }
@@ -50,7 +53,8 @@ def destroy
     @food.destroy!
 
     respond_to do |format|
-      format.html { redirect_to foods_url, notice: 'Food was successfully destroyed.' }
+      flash[:success] = 'Food was successfully destroyed.'
+      format.html { redirect_to foods_url }
       format.json { head :no_content }
     end
   end
@@ -64,6 +68,6 @@ def set_food
 
   # Only allow a list of trusted parameters through.
   def food_params
-    params.require(:food).permit(:name, :measurement_unit, :price, :quantity, :user_id)
+    params.require(:food).permit(:name, :measurement_unit, :price, :quantity)
   end
 end

app/models/food.rb

@@ -2,4 +2,13 @@ class Food < ApplicationRecord
   belongs_to :user
   has_many :recipe_foods
   has_many :recipes, through: :recipe_foods
+
+  validates :name, presence: true
+  validates :price, presence: true, numericality: { greater_than: 0 }
+  validates :measurement_unit, presence: true, inclusion: { in: %w[mg g kg l ml] }
+  validates :quantity, presence: true, numericality: { greater_than: 0 }
+
+  def total_price
+    (price * quantity).round(2)
+  end
 end

app/views/foods/_food.html.erb

@@ -1,27 +1,9 @@
-<div id="<%= dom_id food %>">
-  <p>
-    <strong>Name:</strong>
-    <%= food.name %>
-  </p>
-
-  <p>
-    <strong>Measurement unit:</strong>
-    <%= food.measurement_unit %>
-  </p>
-
-  <p>
-    <strong>Price:</strong>
-    <%= food.price %>
-  </p>
-
-  <p>
-    <strong>Quantity:</strong>
-    <%= food.quantity %>
-  </p>
-
-  <p>
-    <strong>User:</strong>
-    <%= food.user_id %>
-  </p>
-
-</div>
+<tr>
+  <td><%= food.name %></td>
+  <td><%= food.measurement_unit %></td>
+  <td><%= "$#{food.price}" %></td>
+  <td><%= "#{food.quantity}#{food.measurement_unit}" %></td>
+  <td><%= button_to "Delete", food,
+                    method: :delete,
+                    class: "btn btn-outline-danger px-2 py-1" %></td>
+</tr>

app/views/foods/_form.html.erb

@@ -11,32 +11,40 @@
     </div>
   <% end %>
 
-  <div>
-    <%= form.label :name, style: "display: block" %>
-    <%= form.text_field :name %>
+  <div class="field">
+    <%= form.text_field :name,
+                        placeholder: "Name",
+                        aria: { label: "Food Name" },
+                        class: "form-control mb-2" %>
   </div>
 
-  <div>
-    <%= form.label :measurement_unit, style: "display: block" %>
-    <%= form.text_field :measurement_unit %>
+ <div class="field">
+    <%= form.select :measurement_unit,
+                    options_for_select(["mg", "g", "kg", "l", "ml"]),
+                    { prompt: "Select Measurement Unit" },
+                    aria: { label: "Measurement unit" },
+                    class: "form-control mb-2" %>
   </div>
 
-  <div>
-    <%= form.label :price, style: "display: block" %>
-    <%= form.text_field :price %>
+  <div class="field">
+    <%= form.text_field :price,
+                        placeholder: "Unit price",
+                        aria: { label: "Unit price" },
+                        class: "form-control mb-2" %>
   </div>
 
-  <div>
-    <%= form.label :quantity, style: "display: block" %>
-    <%= form.number_field :quantity %>
+  <div class="field">
+    <%= form.number_field :quantity,
+                          placeholder: "Quantity",
+                          aria: { label: "Quantity" },
+                          class: "form-control mb-2" %>
   </div>
 
   <div>
-    <%= form.label :user_id, style: "display: block" %>
-    <%= form.text_field :user_id %>
+    <%= form.hidden_field :user_id, value: current_user.id %>
   </div>
 
-  <div>
-    <%= form.submit %>
+  <div class="actions">
+    <%= form.submit "Save", class: "btn btn-success w-100" %>
   </div>
 <% end %>

app/views/foods/index.html.erb

@@ -1,14 +1,32 @@
-<p style="color: green"><%= notice %></p>
+<main class='container mt-4' style="max-width: 900px;">
 
-<h1>Foods</h1>
+  <div id="foods">
+    <div class="p-2" style="text-align: end;">
+      <%= link_to "New food", new_food_path, class: "btn btn-outline-primary m-1" %>
+    </div>
+    <% if @foods.empty? %>
+      <div class="alert alert-info text-center">
+        <p class="mb-0">There are no foods in your inventory.</p>
+      </div>
+    <% else %>
+      <table class="table table-hover table-striped border">
+        <thead>
+          <tr>
+            <th>Food</th>
+            <th>Measurement unit</th>
+            <th>Unit Price</th>
+            <th>Quantity</th>
+            <th>Actions</th>
+          </tr>
+        </thead>
 
-<div id="foods">
-  <% @foods.each do |food| %>
-    <%= render food %>
-    <p>
-      <%= link_to "Show this food", food %>
-    </p>
-  <% end %>
-</div>
+        <tbody>
+          <% @foods.each do |food| %>
+            <%= render food %>
+          <% end %>
+        </tbody>
+      </table>
+    <% end %>
+  </div>
+</main>
 
-<%= link_to "New food", new_food_path %>

app/views/foods/new.html.erb

@@ -1,9 +1,11 @@
-<h1>New food</h1>
+<h2 class="text-muted text-center mb-4">Add a new item to inventory</h2>
+<div style="max-width: 400px; margin: 0 auto;" class="mb-3">
 
-<%= render "form", food: @food %>
+  <%= render "form", food: @food %>
 
-<br>
+  <br>
 
-<div>
-  <%= link_to "Back to foods", foods_path %>
-</div>
+  <div>
+    <%= link_to "Back to food list", foods_path, class: "btn btn-secondary px-2 py-1" %>
+  </div>
+</div>

app/views/layouts/_navbar.html.erb

@@ -0,0 +1,43 @@
+<nav class="navbar navbar-light bg-light">
+    <div class="container">
+        <%= link_to root_path, class: "navbar-brand" do %>
+            <img src="<%= asset_path("recipes-app-logo-png-small.png") %>" width="auto" height="50" alt="recipe app logo">
+        <% end %>
+
+
+        <div class="p-1 text-center d-flex align-items-center flex-wrap">
+            <ul class="nav" style="font-size: 0.9rem;">
+                <li class="nav-item">
+                    <%= link_to "Public-recipes", root_path, class: "nav-link pl-0" %>
+                </li>
+
+                <% if user_signed_in? %>
+
+                <% # ! UPDATE THE LINKS BELOW TO POINT TO THE CORRECT PATHS %>
+
+                    <li class="nav-item">
+                        <%= link_to "My-recipes", root_path, class: "nav-link" %>
+                    </li>
+                    <li class="nav-item">
+                        <%= link_to "Food-List", root_path, class: "nav-link" %>
+                    </li>
+                    <li class="nav-item">
+                        <%= link_to "Shopping-list", root_path, class: "nav-link" %>
+                    </li>
+                <% end %>
+            </ul>
+
+            <% if user_signed_in? %>
+                <%= button_to("Sign Out", destroy_user_session_path,
+                              method: :delete,
+                              class: "btn btn-outline-success ml-2 px-2 py-1",
+                              style: "font-size: 0.9rem;") %>
+                <% else %>
+                <%= button_to("Sign in", new_user_session_path,
+                              method: :get,
+                              class: "btn btn-outline-success ml-2 px-2 py-1",
+                              style: "font-size: 0.9rem;") %>
+            <% end %>
+        </div>
+    </div>
+</nav>

app/views/layouts/application.html.erb

@@ -10,6 +10,8 @@
       integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
       crossorigin="anonymous"
     />
+    <%= favicon_link_tag asset_path("recipes-app-logo-png-favicon.png") %>
+
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
 
@@ -18,24 +20,18 @@
   </head>
 
   <body>
-
-  <div class="p-1 text-center">
-  <% if user_signed_in? %>
-    <%= button_to("Sign Out", destroy_user_session_path,
-                  method: :delete,
-                  class: "btn btn-outline-success px-2 py-1",
-                  style: "font-size: 0.9rem;") %>
-  <% else %>
-    <%= button_to("Sign in", new_user_session_path,
-                  method: :get,
-                  class: "btn btn-outline-success px-2 py-1",
-                  style: "font-size: 0.9rem;") %>
-  <% end %>
-  </div>
+    <%= render "layouts/navbar" %>
 
-    <p class="notice"><%= notice %></p>
-    <p class="alert"><%= alert %></p>
+    <div class="container mt-1 text-center">
+      <% flash.each do |key, message| %>
+          <div class="alert alert-<%= key %> m-2">
+              <%= message %>
+          </div>
+      <% end %>
+    </div>
 
-    <%= yield %>
+    <main class="container mt-4" style="max-width: 900px; height: 80vh;">
+      <%= yield %>
+    </main>
   </body>
 </html>

spec/factories/foods.rb

@@ -1,9 +1,11 @@
+require 'faker'
+
 FactoryBot.define do
   factory :food do
-    name { 'MyString' }
-    measurement_unit { 'MyString' }
-    price { '9.99' }
+    name { Faker::Food.ingredient }
+    measurement_unit { 'kg' }
+    price { 1.5 }
     quantity { 1 }
-    user { nil }
+    user { create(:user) }
   end
 end

spec/factories/users.rb

@@ -1,8 +1,11 @@
+require 'faker'
+
 FactoryBot.define do
   factory :user do
     name { Faker::Name.name }
     email { Faker::Internet.email }
     password { '123456' }
     password_confirmation { '123456' }
+    confirmed_at { Time.zone.now }
   end
 end