From 658a00890c7c01cb4206fb744a3fd6edb12f94db Mon Sep 17 00:00:00 2001
From: Dan Barber <github@danbarber.me>
Date: Tue, 2 Apr 2024 21:54:56 -0500
Subject: [PATCH 1/2] Allow multiple file uploads

---
 Gemfile                                       |  2 --
 Gemfile.lock                                  | 10 ------
 app/assets/stylesheets/images/index.scss      | 27 ++++++++++++++-
 app/assets/stylesheets/sessions.scss          |  1 +
 app/controllers/images_controller.rb          | 21 ++++++------
 app/controllers/tags_controller.rb            |  2 +-
 app/javascript/application.js                 |  1 +
 app/javascript/controllers/application.js     |  9 +++++
 app/javascript/controllers/index.js           |  3 ++
 .../controllers/uploads_controller.js         | 15 +++++++++
 app/views/images/index.html.erb               | 33 ++++++++++++++-----
 app/views/images/show.html.erb                |  4 +--
 app/views/sessions/new.html.erb               |  7 +++-
 config/importmap.rb                           |  4 ++-
 14 files changed, 101 insertions(+), 38 deletions(-)
 create mode 100644 app/javascript/controllers/application.js
 create mode 100644 app/javascript/controllers/index.js
 create mode 100644 app/javascript/controllers/uploads_controller.js

diff --git a/Gemfile b/Gemfile
index 1c525e6..3329aaa 100644
--- a/Gemfile
+++ b/Gemfile
@@ -30,8 +30,6 @@ group :development do
 end
 
 group :development, :test do
-  gem "better_errors"
-  gem "binding_of_caller"
   gem "pry"
 end
 
diff --git a/Gemfile.lock b/Gemfile.lock
index 2f41b47..c686d3f 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -71,14 +71,8 @@ GEM
     archive-zip (0.12.0)
       io-like (~> 0.3.0)
     base64 (0.2.0)
-    better_errors (2.10.1)
-      erubi (>= 1.0.0)
-      rack (>= 0.9.0)
-      rouge (>= 1.0.0)
     bigdecimal (3.1.7)
     bindex (0.8.1)
-    binding_of_caller (1.0.1)
-      debug_inspector (>= 1.2.0)
     bootsnap (1.18.3)
       msgpack (~> 1.2)
     builder (3.2.4)
@@ -99,7 +93,6 @@ GEM
       rexml
     crass (1.0.6)
     date (3.3.4)
-    debug_inspector (1.2.0)
     delayed_job (4.1.11)
       activesupport (>= 3.0, < 8.0)
     delayed_job_active_record (4.1.8)
@@ -257,7 +250,6 @@ GEM
     rake (13.1.0)
     regexp_parser (2.9.0)
     rexml (3.2.6)
-    rouge (4.2.1)
     rspec-core (3.13.0)
       rspec-support (~> 3.13.0)
     rspec-expectations (3.13.0)
@@ -342,8 +334,6 @@ PLATFORMS
   arm64-darwin-22
 
 DEPENDENCIES
-  better_errors
-  binding_of_caller
   bootsnap
   capybara
   delayed_job_active_record
diff --git a/app/assets/stylesheets/images/index.scss b/app/assets/stylesheets/images/index.scss
index e8f85b2..c0eb204 100644
--- a/app/assets/stylesheets/images/index.scss
+++ b/app/assets/stylesheets/images/index.scss
@@ -1,4 +1,4 @@
-ul.images {
+.images {
   display: grid;
   grid-gap: 0.75rem;
   grid-template-columns: repeat(2, 1fr);
@@ -19,6 +19,31 @@ ul.images {
     border-radius: 2px;
     padding: 0.25rem;
   }
+
+  &__upload {
+    aspect-ratio: 1 / 1;
+
+    &-form {
+      height: 100%;
+    }
+
+    &-label {
+      align-items: center;
+      border-radius: 2px;
+      outline: 1px dashed white;
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      justify-content: center;
+      opacity: 0.4;
+      width: 100%;
+      cursor: pointer;
+    }
+
+    &-input {
+      display: none;
+    }
+  }
 }
 
 @media (min-width: 380px) {
diff --git a/app/assets/stylesheets/sessions.scss b/app/assets/stylesheets/sessions.scss
index 63745ae..bd42cbc 100644
--- a/app/assets/stylesheets/sessions.scss
+++ b/app/assets/stylesheets/sessions.scss
@@ -19,6 +19,7 @@
   text-decoration: none;
   padding: 0.5rem 2rem;
   border-radius: 0.5rem;
+
   img {
     width: 1.2rem;
     vertical-align: middle;
diff --git a/app/controllers/images_controller.rb b/app/controllers/images_controller.rb
index 834ebc5..6792e7f 100644
--- a/app/controllers/images_controller.rb
+++ b/app/controllers/images_controller.rb
@@ -8,19 +8,18 @@ class ImagesController < ApplicationController
 
   def show
     @image = @current_user.images.find(params[:id])
-
-    if turbo_frame_request?
-      render partial: "tags/tags", locals: {
-        image: @image,
-        tags: @image.tags
-      }
-    end
   end
 
   def create
-    @image = Image.create(permitted_params)
-    @current_user.images << @image
-    TagImageJob.perform_later(image_id: @image.id)
+    permitted_params[:images].select(&:present?).each do |image|
+      @image = Image.create(
+        user_id: permitted_params[:user_id],
+        album_id: permitted_params[:album_id],
+        image: image,
+      )
+      @current_user.images << @image
+      TagImageJob.perform_later(image_id: @image.id)
+    end
 
     redirect_for(@image)
   end
@@ -53,6 +52,6 @@ class ImagesController < ApplicationController
   end
 
   def permitted_params
-    params.require(:image).permit(:user_id, :album_id, :image)
+    params.require(:image).permit(:user_id, :album_id, images: [])
   end
 end
diff --git a/app/controllers/tags_controller.rb b/app/controllers/tags_controller.rb
index 9abe2d8..fa6ca04 100644
--- a/app/controllers/tags_controller.rb
+++ b/app/controllers/tags_controller.rb
@@ -5,7 +5,7 @@ class TagsController < ApplicationController
     image = @current_user.images.find(params[:image_id])
     tag = params[:tag]
 
-    if !image.tags.include?(tag)
+    if !image.tags.include?(tag) && tag.present?
       image.tags << tag
       image.save
       redirect_to image, turbo_frame: "tags"
diff --git a/app/javascript/application.js b/app/javascript/application.js
index b62af4a..a2aee09 100644
--- a/app/javascript/application.js
+++ b/app/javascript/application.js
@@ -3,5 +3,6 @@
 import "@hotwired/turbo-rails"
 import Rails from "@rails/ujs";
 import { Application } from "@hotwired/stimulus";
+import "controllers"
 
 Rails.start();
diff --git a/app/javascript/controllers/application.js b/app/javascript/controllers/application.js
new file mode 100644
index 0000000..c84f770
--- /dev/null
+++ b/app/javascript/controllers/application.js
@@ -0,0 +1,9 @@
+import { Application } from "@hotwired/stimulus"
+
+const application = Application.start()
+
+// Configure Stimulus development experience
+application.debug = true
+window.Stimulus   = application
+
+export { application }
diff --git a/app/javascript/controllers/index.js b/app/javascript/controllers/index.js
new file mode 100644
index 0000000..6ffb4e9
--- /dev/null
+++ b/app/javascript/controllers/index.js
@@ -0,0 +1,3 @@
+import { application } from "controllers/application"
+import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
+eagerLoadControllersFrom("controllers", application)
diff --git a/app/javascript/controllers/uploads_controller.js b/app/javascript/controllers/uploads_controller.js
new file mode 100644
index 0000000..a945d43
--- /dev/null
+++ b/app/javascript/controllers/uploads_controller.js
@@ -0,0 +1,15 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  static targets = ["form", "fileField"];
+
+  connect() {
+    this.element.addEventListener("dragenter", (event) => {
+      console.log(event);
+    });
+
+    this.fileFieldTarget.addEventListener("change", (event) => {
+      this.formTarget.submit();
+    });
+  }
+}
diff --git a/app/views/images/index.html.erb b/app/views/images/index.html.erb
index 20bac05..8178b1f 100644
--- a/app/views/images/index.html.erb
+++ b/app/views/images/index.html.erb
@@ -15,13 +15,28 @@
           method: :delete, data: { confirm: 'Are you sure?' } %>
     </li>
   <% end %>
+
+  <li class="images__upload" data-controller="uploads">
+    <%= form_for(
+      @images.new,
+      html: {
+        class: "images__upload-form",
+        data: {"uploads-target": "form"}
+      }
+    ) do |f| %>
+      <%= f.hidden_field :user_id %>
+      <%= f.hidden_field :album_id %>
+      <%= f.file_field(
+        :images,
+        class: "images__upload-input",
+        multiple: true,
+        accept: "image/*",
+        data: {"uploads-target": "fileField"}
+      ) %>
+      <label for="image_images" class="images__upload-label">
+        <span>↑</span>
+        Upload
+      </label>
+    <% end %>
+  </li>
 </ul>
-
-<h2>Upload New Image</h2>
-
-<%= simple_form_for @images.new do |f| %>
-  <%= f.input :user_id, as: :hidden %>
-  <%= f.input :album_id, as: :hidden %>
-  <%= f.input :image, as: :file %>
-  <%= f.submit %>
-<% end %>
diff --git a/app/views/images/show.html.erb b/app/views/images/show.html.erb
index f0ace45..087b2d2 100644
--- a/app/views/images/show.html.erb
+++ b/app/views/images/show.html.erb
@@ -4,10 +4,10 @@
     &rarr;
     <%= link_to @image.album.title, album_images_path(@image.album) %>
   <% end %>
-  &rarr;
-  <%= @image.image.name %>
 <% end %>
 
+<h2><%= @image.image.name %></h2>
+
 <div class="show-image" data-image-id="<%= @image.id %>">
   <div class="image-container">
     <%= render "image", image: @image %>
diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb
index c51e910..436a13a 100644
--- a/app/views/sessions/new.html.erb
+++ b/app/views/sessions/new.html.erb
@@ -1,7 +1,12 @@
 <% content_for :title, "My Images" %>
 
 <div class="centre-stage">
-  <%= link_to '/auth/github', class: "github-button", method: :post do %>
+  <%= button_to(
+    '/auth/github',
+    class: "github-button",
+    method: :post,
+    data: {turbo: false}
+  ) do %>
     <%= image_tag "github.svg" %>
     Sign in with GitHub
   <% end %>
diff --git a/config/importmap.rb b/config/importmap.rb
index 920f51a..354c018 100644
--- a/config/importmap.rb
+++ b/config/importmap.rb
@@ -2,7 +2,9 @@
 
 pin "application"
 pin "@rails/ujs", to: "@rails--ujs.js" # @7.1.3
-pin "@hotwired/stimulus", to: "@hotwired--stimulus.js" # @3.2.2
 pin "@hotwired/turbo-rails", to: "@hotwired--turbo-rails.js" # @8.0.4
 pin "@hotwired/turbo", to: "@hotwired--turbo.js" # @8.0.4
 pin "@rails/actioncable/src", to: "@rails--actioncable--src.js" # @7.1.3
+pin "@hotwired/stimulus", to: "stimulus.min.js"
+pin "@hotwired/stimulus-loading", to: "stimulus-loading.js"
+pin_all_from "app/javascript/controllers", under: "controllers"

From 5f79654684f88c07a60c3fc2dc2b8277b8c26427 Mon Sep 17 00:00:00 2001
From: Dan Barber <github@danbarber.me>
Date: Tue, 9 Apr 2024 17:11:10 -0500
Subject: [PATCH 2/2] Add Hound config

---
 .hound.yml | 2 ++
 1 file changed, 2 insertions(+)
 create mode 100644 .hound.yml

diff --git a/.hound.yml b/.hound.yml
new file mode 100644
index 0000000..c47bbe0
--- /dev/null
+++ b/.hound.yml
@@ -0,0 +1,2 @@
+rubocop:
+  version: 1.22.1