show gift

.reek.yml

@@ -8,5 +8,9 @@ detectors:
   InstanceVariableAssumption:
     enabled: false
 
+  TooManyInstanceVariables:
+    exclude:
+      - GiftsController
+
 exclude_paths:
   - db/migrate

.rubocop.yml

@@ -34,6 +34,7 @@ Metrics/BlockLength:
     - config/**/*
     - spec/**/*
     - app/admin/**/*
+    - test/factories/*
 
 Metrics/BlockNesting:
   Max: 4

Gemfile

@@ -58,6 +58,7 @@ gem 'kaminari'
 
 group :development, :test do
   # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem
+  gem 'bullet'
   gem 'debug', platforms: %i[mri mswin mswin64 mingw x64_mingw]
   gem 'factory_bot_rails'
 end

Gemfile.lock

@@ -85,6 +85,9 @@ GEM
     bootsnap (1.18.3)
       msgpack (~> 1.2)
     builder (3.2.4)
+    bullet (7.1.6)
+      activesupport (>= 3.0.0)
+      uniform_notifier (~> 1.11)
     capybara (3.40.0)
       addressable
       matrix
@@ -348,6 +351,7 @@ GEM
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
     unicode-display_width (2.5.0)
+    uniform_notifier (1.16.0)
     warden (1.2.9)
       rack (>= 2.0.9)
     web-console (4.2.1)
@@ -374,6 +378,7 @@ PLATFORMS
 
 DEPENDENCIES
   bootsnap
+  bullet
   capybara
   cssbundling-rails
   debug

app/assets/stylesheets/actiontext.css

@@ -0,0 +1,31 @@
+/*
+ * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
+ * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
+ * inclusion directly in any other asset bundle and remove this file.
+ *
+ *= require trix
+*/
+
+/*
+ * We need to override trix.css’s image gallery styles to accommodate the
+ * <action-text-attachment> element we wrap around attachments. Otherwise,
+ * images in galleries will be squished by the max-width: 33%; rule.
+*/
+.trix-content .attachment-gallery > action-text-attachment,
+.trix-content .attachment-gallery > .attachment {
+  flex: 1 0 33%;
+  padding: 0 0.5em;
+  max-width: 33%;
+}
+
+.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
+  flex-basis: 50%;
+  max-width: 50%;
+}
+
+.trix-content action-text-attachment .attachment {
+  padding: 0 !important;
+  max-width: 100% !important;
+}

app/assets/stylesheets/application.bootstrap.scss

@@ -191,6 +191,16 @@ $utilities: map-merge(
   )
 );
 
+.border-solid {
+  border-style: solid;
+  border-color: black;
+}
+.text-in-image{
+  top: 10%;
+  left: 15%;
+  transform: translate(-50%, -50%);
+}
+
 .img-highlight{
   width: 325px;
   height: 275px;
@@ -217,6 +227,10 @@ $utilities: map-merge(
   list-style-type: none;
 }
 
+.height-gift {
+  height: 275px;
+}
+
 .border-bottom-style-solid {
   border-bottom-style: solid;
 }
@@ -325,6 +339,16 @@ $utilities: map-merge(
   color: black;
 }
 
+.shadow {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  box-shadow: inset 3px 3px 10px 0 #000000;
+  border-radius: 20px;
+  top: 0;
+  left: 0;
+}
+
 .img-icon{
   width: 15px;
   height: 15px;
@@ -344,8 +368,16 @@ $utilities: map-merge(
 .rounded-header {
   border-radius: 0.375rem
 }
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+}
 
 @include media-breakpoint-up(sm) {
+  .height-gift {
+    height: 350px;
+  }
+
   .transform-sm {
     transform: rotate(10deg) translateY(-356px) translateX(-126px);
   }
@@ -364,6 +396,10 @@ $utilities: map-merge(
     transform: rotate(10deg) translateY(-341px) translateX(-160px);
   }
 
+  .gift-img {
+    width:400px;
+    height: 250px;
+  }
   .footer-logo{
     width:150px;
     height: 60px;
@@ -383,6 +419,10 @@ $utilities: map-merge(
   .w-lg-40 {
     width: 40%
   }
+  .gift-img {
+    width:600px;
+    height: 340px;
+  }
 
 }
 

app/controllers/gifts_controller.rb

@@ -14,6 +14,10 @@ def index
     @gifts = query.page(params[:page])
   end
 
+  def show
+    @gift = Gift.find(params[:id])
+  end
+
   private
 
   def load_filters_and_categories

app/javascript/application.js

@@ -2,3 +2,6 @@
 import "@hotwired/turbo-rails"
 import "./controllers"
 import * as bootstrap from "bootstrap"
+
+import "trix"
+import "@rails/actiontext"

app/javascript/controllers/gift_amount_controller.js

@@ -0,0 +1,35 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Connects to data-controller="gift-amount"
+export default class extends Controller {
+  static targets = ['amount', 'increaseButton', 'decreaseButton']
+
+  editButtons() {
+    switch (this.amountTarget.value) {
+      case '0':
+        this.decreaseButtonTarget.disabled = true
+        break
+      case '5':
+        this.increaseButtonTarget.disabled = true
+        break
+      default:
+        this.decreaseButtonTarget.disabled = false
+        this.increaseButtonTarget.disabled = false
+    }
+  }
+
+  decrease() {
+    if (this.amountTarget.value > 0) {
+      this.amountTarget.value --
+    }
+    this.editButtons()
+  }
+
+  increase() {
+    if (this.amountTarget.value < 5) {
+      this.amountTarget.value ++
+    }
+    this.editButtons()
+  }
+
+}

app/javascript/controllers/index.js

@@ -10,6 +10,9 @@ application.register("auto-submit", AutoSubmitController)
 import DropDownController from "./dropDown_controller"
 application.register("dropDown", DropDownController)
 
+import GiftAmountController from "./gift_amount_controller"
+application.register("gift-amount", GiftAmountController)
+
 import HelloController from "./hello_controller"
 application.register("hello", HelloController)
 

app/models/customization.rb

@@ -0,0 +1,4 @@
+class Customization < ApplicationRecord
+  has_many :gift_customizations
+  has_many :gifts, through: :gift_customizations
+end

app/models/gift.rb

@@ -1,9 +1,12 @@
 class Gift < ApplicationRecord
   has_many :gift_categorizations
   has_many :categories, through: :gift_categorizations
+  has_many :gift_customizations
+  has_many :customizations, through: :gift_customizations
   belongs_to :supplier
   delegate :name, to: :supplier, prefix: true
   has_one_attached :image
+  has_rich_text :content
 
   scope :with_categories, lambda { |categories|
     joins(:gift_categorizations)

app/models/gift_customization.rb

@@ -0,0 +1,4 @@
+class GiftCustomization < ApplicationRecord
+  belongs_to :gift
+  belongs_to :customization
+end

app/views/active_storage/blobs/_blob.html.erb

@@ -0,0 +1,14 @@
+<figure class="attachment attachment--<%= blob.representable? ? "preview" : "file" %> attachment--<%= blob.filename.extension %>">
+  <% if blob.representable? %>
+    <%= image_tag blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [ 800, 600 ] : [ 1024, 768 ]) %>
+  <% end %>
+
+  <figcaption class="attachment__caption">
+    <% if caption = blob.try(:caption) %>
+      <%= caption %>
+    <% else %>
+      <span class="attachment__name"><%= blob.filename %></span>
+      <span class="attachment__size"><%= number_to_human_size blob.byte_size %></span>
+    <% end %>
+  </figcaption>
+</figure>

app/views/application/_header.html.erb

@@ -1,10 +1,10 @@
-<div class="shadow-header rounded-header position-relative z-1">
+<div class="shadow-header rounded-header position-relative z-1 <%= show_gift ? 'd-none d-md-flex' : '' %>">
   <%= render 'application/flash' %>
-  <div class="d-flex justify-content-between align-items-center align-items-lg-end pt-10 pt-lg-0 px-md-7 px-xl-15 px-3 pb-3">
+  <div class="w-100 d-flex justify-content-between align-items-center align-items-lg-end pt-10 pt-lg-0 px-md-7 px-xl-15 px-3 pb-3">
     <%= image_tag('footer_logo.svg', class: 'header-logo') %>
     <div class="d-lg-flex flex-column ">
       <div class="d-lg-flex d-none column-gap-8 pt-3 justify-content-center fs-4 fw-medium pb-3">
-        <div class = "<%= current_page?( '/regalos') || current_page?('/') ? 'border-bottom-style-solid border-1 border-blue' : '' %>">
+        <div class = "<%= request.path.start_with?('/regalos') || current_page?('/') ? 'border-bottom-style-solid border-1 border-blue' : '' %>">
           <%= link_to 'Regalos', gifts_path, class: 'bg-text-gradient-blue-20 text-fill-color-transparent' %>
         </div>
         <div class = "<%= current_page?(controller: '/catering') ? 'border-bottom-style-solid border-1 border-blue' : '' %>">

app/views/devise/registrations/edit.html.erb

@@ -1,3 +1,6 @@
+<% content_for :header do %>
+  <% render 'header', show_gift: false, categories: @categories, filters: @filter  %>
+<% end %>
 <p class = "fs-4 fs-md-6 fw-medium pb-3 pb-lg-1">Información personal</p>
 <div class="d-flex flex-column flex-lg-row justify-content-lg-between px-lg-15 bg-lg-white py-lg-6">
   <div class="w-lg-50">

app/views/gifts/index.html.erb

@@ -1,3 +1,6 @@
+<% content_for :header do %>
+  <% render 'header', show_gift: false, categories: @categories, filters: @filters  %>
+<% end %>
 <div class="d-none d-sm-flex flex-column">
   <h6 class = "fs-5 fw-normal">REGALOS</h6>
   <h4 class = "fs-7 fw-medium">Food Box</h4>
@@ -21,21 +24,23 @@
 </div>
 <div class="d-flex justify-content-sm-between justify-content-center pt-8 flex-wrap row-gap-5">
   <% @gifts.each do |gift| %>
-    <div class="d-flex flex-column bg-white rounded-2 hover-border-grey border-style-solid border-color-transparent me-2">
-      <div>
-        <%= image_tag(gift.image_resized, class: 'rounded-top-2') %>
-      </div>
-      <div class="d-flex flex-column px-3 pt-4">
-        <div class="d-flex justify-content-between">
-          <p class= "fs-4 fw-medium mb-0"><%= gift.name.truncate(12, separator: ' ') %></p>
-          <div class="d-flex align-items-center">
-            <p class="mb-0 fs-4 bg-text-gradient-blue-20 text-fill-color-transparent "><%= gift.valoration %> <%= image_tag('Estrella.svg', class:'pb-1') %></p>
+    <%= link_to  gift_path(gift), class:'text-decoration-none' do %>
+      <div class="d-flex flex-column bg-white rounded-2 hover-border-grey border-style-solid border-color-transparent me-2">
+        <div>
+          <%= image_tag(gift.image_resized, class: 'rounded-top-2') %>
+        </div>
+        <div class="d-flex flex-column px-3 pt-4">
+          <div class="d-flex justify-content-between">
+            <p class= "fs-4 fw-medium mb-0 text-black"><%= gift.name.truncate(12, separator: ' ') %></p>
+            <div class="d-flex align-items-center">
+              <p class="mb-0 fs-4 bg-text-gradient-blue-20 text-fill-color-transparent "><%= gift.valoration %> <%= image_tag('Estrella.svg', class:'pb-1') %></p>
+            </div>
           </div>
+          <p class="fs-4 text-role-grey mb--3"><%= gift.supplier_name %></p>
+          <p class="fs-4 text-blue-2 mb-3">$<%= gift.price %></p>
         </div>
-        <p class="fs-4 text-role-grey mb--3"><%= gift.supplier_name %></p>
-        <p class="fs-4 text-blue-2 mb-3">$<%= gift.price %></p>
       </div>
-    </div>
+    <% end %>
   <% end %>
 </div>
 <div class="d-flex my-3 justify-content-center mx-0">