From 04fc954dc268873bb2bc0d074b289b0e321ef4de Mon Sep 17 00:00:00 2001
From: Louis Ramos <75388869+wJoenn@users.noreply.github.com>
Date: Wed, 11 Dec 2024 22:06:21 +0100
Subject: [PATCH] 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 |  5 +++--
 app/components/snippets/box_component.rb       |  4 +++-
 .../controllers/confirm_controller.js          | 18 ++++++++++++++++++
 3 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 app/javascript/controllers/confirm_controller.js

diff --git a/app/components/snippets/box_component.html.erb b/app/components/snippets/box_component.html.erb
index aa6e620e..fda68aec 100644
--- a/app/components/snippets/box_component.html.erb
+++ b/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 %>
diff --git a/app/components/snippets/box_component.rb b/app/components/snippets/box_component.rb
index 201fd353..b2a34295 100644
--- a/app/components/snippets/box_component.rb
+++ b/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
diff --git a/app/javascript/controllers/confirm_controller.js b/app/javascript/controllers/confirm_controller.js
new file mode 100644
index 00000000..db24d09f
--- /dev/null
+++ b/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()
+  }
+}