From f134388fac0325722e6b3e7c565dca1456713b1e Mon Sep 17 00:00:00 2001
From: Dan Barber <github@danbarber.me>
Date: Wed, 12 Sep 2018 09:14:26 -0400
Subject: [PATCH] Ended up not using Rails UJS after all

---
 app/controllers/tags_controller.rb            |  4 ++--
 app/javascript/controllers/tag_controller.js  |  1 -
 app/javascript/controllers/tags_controller.js | 17 +++++++++++++----
 app/javascript/packs/application.js           |  3 ---
 app/javascript/services/ajax_service.js       |  7 +++++--
 app/views/images/_info.html.erb               | 10 ++--------
 package.json                                  |  1 -
 yarn.lock                                     |  4 ----
 8 files changed, 22 insertions(+), 25 deletions(-)

diff --git a/app/controllers/tags_controller.rb b/app/controllers/tags_controller.rb
index dd32de7..919e6fc 100644
--- a/app/controllers/tags_controller.rb
+++ b/app/controllers/tags_controller.rb
@@ -9,7 +9,7 @@ class TagsController < ApplicationController
       image.save
       render partial: "tags/tag", locals: { image: image, tag: tag }
     else
-      head 200, content_type: "text/html"
+      head :no_content, content_type: "text/html"
     end
   end
 
@@ -19,6 +19,6 @@ class TagsController < ApplicationController
     image.tags.delete(tag)
     image.save
 
-    render json: { status: :ok }
+    head :no_content
   end
 end
diff --git a/app/javascript/controllers/tag_controller.js b/app/javascript/controllers/tag_controller.js
index fb7d6e8..eecb056 100644
--- a/app/javascript/controllers/tag_controller.js
+++ b/app/javascript/controllers/tag_controller.js
@@ -5,7 +5,6 @@ export default class extends Controller {
   static targets = ["name"];
 
   delete(event) {
-    const imageId = this.element.dataset.imageId;
     const tag = this.nameTarget.innerText;
 
     event.preventDefault();
diff --git a/app/javascript/controllers/tags_controller.js b/app/javascript/controllers/tags_controller.js
index 197dfa0..ab67dc9 100644
--- a/app/javascript/controllers/tags_controller.js
+++ b/app/javascript/controllers/tags_controller.js
@@ -1,11 +1,20 @@
 import { Controller } from "stimulus";
+import ajaxService from "../services/ajax_service";
 
 export default class extends Controller {
   static targets = ["tag", "tagList"]
 
-  onPostSuccess(event) {
-    let [data, status, xhr] = event.detail;
-    this.tagListTarget.innerHTML += xhr.response;
-    this.tagTarget.value = "";
+  create(event) {
+    const tag = this.tagTarget.value;
+
+    event.preventDefault();
+
+    ajaxService.createTag(tag)
+      .then(response => {
+        if (response.status == 200) {
+          this.tagListTarget.innerHTML += response.data;
+        };
+        this.tagTarget.value = "";
+      })
   }
 }
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index 7c49ac0..a04b5aa 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -7,12 +7,9 @@
 // To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
 // layout file, like app/views/layouts/application.html.erb
 
-import Rails from "rails-ujs";
 import { Application } from "stimulus";
 import { definitionsFromContext } from "stimulus/webpack-helpers";
 
-Rails.start();
-
 const application = Application.start();
 const context = require.context("controllers", true, /.js$/);
 application.load(definitionsFromContext(context));
diff --git a/app/javascript/services/ajax_service.js b/app/javascript/services/ajax_service.js
index 2d7e395..2949f32 100644
--- a/app/javascript/services/ajax_service.js
+++ b/app/javascript/services/ajax_service.js
@@ -18,12 +18,15 @@ const config = () => ({
   headers: { "X-CSRF-Token": csrfToken() }
 });
 
-
 export default {
   createTag: (tag) => {
+    return axios.post(`/user/images/${imageId()}/tags`, { tag }, config());
   },
 
   deleteTag: (tag) => {
-    return axios.delete(`/user/images/${imageId()}/tags/${tag}.json`, config());
+    return axios.delete(
+      `/user/images/${imageId()}/tags/${encodeURIComponent(tag)}`,
+      config()
+    );
   }
 }
diff --git a/app/views/images/_info.html.erb b/app/views/images/_info.html.erb
index a12b376..9b4f24f 100644
--- a/app/views/images/_info.html.erb
+++ b/app/views/images/_info.html.erb
@@ -3,15 +3,9 @@
     <%= render "tags/tags", image: image, tags: image.tags %>
 
     <div class="new-tag-form">
-      <%= form_with url: user_image_tags_path(image),
+      <%= form_tag user_image_tags_path(image),
         method: :post,
-        html: {
-          data: {
-            remote: true,
-            type: "html",
-            action: "ajax:success->tags#onPostSuccess"
-          }
-        } do %>
+        data: { action: "tags#create" } do %>
         <%= text_field_tag :tag, nil, data: { target: "tags.tag" } %>
         <%= submit_tag "Add Tag" %>
       <% end %>
diff --git a/package.json b/package.json
index 40ae910..c972b21 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,6 @@
   "dependencies": {
     "@rails/webpacker": "3.5",
     "axios": "^0.18.0",
-    "rails-ujs": "^5.2.1",
     "stimulus": "^1.1.0"
   },
   "devDependencies": {
diff --git a/yarn.lock b/yarn.lock
index 2cbacb0..583ce7b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4563,10 +4563,6 @@ querystringify@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.0.0.tgz#fa3ed6e68eb15159457c89b37bc6472833195755"
 
-rails-ujs@^5.2.1:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/rails-ujs/-/rails-ujs-5.2.1.tgz#2869c6d54fdfefac3aaa257f4efe211d8f5a7169"
-
 randomatic@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.0.tgz#36f2ca708e9e567f5ed2ec01949026d50aa10116"