feat(snippets): confirm before discussing (#721)

* refactor(snippets): js:ReactionController -> SnippetsController

* feat(snippets): add handleDiscuss to js:SnippetsController

* feat(snippets): require slack_linked? to discuss

* refactor(snippets): move JS:ShowMoreController to JS:SnippetsController

* fix: linter

* refactor(js): externalise expandable logic from JS:snippetsController

* refactore(js): externalise confirm ogic from js:SnippetsController

* refactor(js): rename js:SnippetsController -> ReactionsController

* refactor: undo useless changes

app/components/snippets/box_component.html.erb

@@ -1,6 +1,7 @@
 <div id="<%= @snippet.id %>"
      class="w-full p-4 flex flex-col self-center gap-y-4 bg-aoc-gray-darkest border border-aoc-gray-dark group"
-     data-controller="show-more">
+     data-controller="confirm show-more"
+     data-confirm-message-value="<%= @discuss_confirm_message %>">
 
   <div class="flex items-center justify-between text-xs">
     <div class="flex gap-x-3">
@@ -12,7 +13,7 @@
     </div>
 
     <% if @user_can_discuss_snippet %>
-      <%= button_to discuss_snippet_path(@snippet), method: :patch, form: { target: "_blank" } do %>
+      <%= button_to discuss_snippet_path(@snippet), method: :patch, data: { action: "confirm#handleSubmit" } do %>
         <span class="link-explicit link-slack">discuss on Slack</span>
       <% end %>
     <% end %>

app/components/snippets/box_component.rb

@@ -11,8 +11,10 @@ def initialize(snippet:, user:)
       @snippet = snippet
 
       @user_can_edit_snippet = @snippet.user == @user
-      @user_can_discuss_snippet = @snippet.user != @user && @snippet.user.slack_linked?
+      @user_can_discuss_snippet = @snippet.user != @user && @snippet.user.slack_linked? && @user.slack_linked?
       @user_reaction_vote_value = @snippet.reactions.find { _1.user_id == @user.id }
+
+      @discuss_confirm_message = "By clicking this button, you will create a new Slack thread on #aoc and notify the author of the solution. Do you want to proceed?" if @snippet.slack_url.nil?
     end
   end
 end

app/javascript/controllers/confirm_controller.js

@@ -0,0 +1,18 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static values = {
+    message: String,
+  }
+
+  handleSubmit(event) {
+    event.preventDefault()
+    if (this.messageValue && !confirm(this.messageValue)) { return }
+
+    const newTab = window.open("", "_blank")
+    const form = event.currentTarget.parentElement.cloneNode(true)
+    form.style.display = "none"
+    newTab.document.body.appendChild(form)
+    form.submit()
+  }
+}