Action text rhino (#570)

* install action_text

* install rhino-editor

* add rhino editor to resource

* add rhino view helper

* add table extension

* try rendering content withouth trix styles and rely on prose

* update allowed attributes

* add youtube embed to rhino

* only display table buttons when active

* add source editor

* fix

* add text alignment option

* style links in editor

* add editor helper

* fix helper name

* add show_test page

* revert

* clean up

* change rhino text test route

* add table tags to sanitizer

* add src and brackets to image not found

Author: jmilljr24

app/controllers/resources_controller.rb

@@ -35,6 +35,12 @@ def show
     render :show
   end
 
+  def rhino_text
+    @resource = Resource.find(resource_id_param).decorate
+    load_forms
+    render :show_test
+  end
+
   def create
     @resource = current_user.resources.build(resource_params)
     if @resource.save
@@ -118,12 +124,12 @@ def resource_id_param
 
   def resource_params
     params.require(:resource).permit(
-      :text, :kind, :male, :female, :title, :featured, :inactive, :url,
+      :text, :rhino_text, :kind, :male, :female, :title, :featured, :inactive, :url,
       :agency, :author, :filemaker_code, :windows_type_id, :ordering,
       main_image_attributes: [:id, :file, :_destroy],
       gallery_images_attributes: [:id, :file, :_destroy],
       categorizable_items_attributes: [:id, :category_id, :_destroy], category_ids: [],
-      sectorable_items_attributes: [:id, :sector_id, :is_leader, :_destroy], sector_ids: [],
+      sectorable_items_attributes: [:id, :sector_id, :is_leader, :_destroy], sector_ids: []
     )
   end
 

app/frontend/javascript/application.js

@@ -1,3 +1,7 @@
 import "@hotwired/turbo-rails";
+import "@rails/actiontext";
+import "rhino-editor";
+import "rhino-editor/exports/styles/trix.css";
 
 import "./controllers";
+import "./rhino/extend-editor.js";

app/frontend/javascript/controllers/index.js

@@ -29,3 +29,6 @@ application.register("tabs", TabsController)
 
 import TimeframeController from "./timeframe_controller"
 application.register("timeframe", TimeframeController)
+
+import RhinoSourceController from "./rhino_source_controller"
+application.register("rhino-source", RhinoSourceController)

app/frontend/javascript/controllers/rhino_source_controller.js

@@ -0,0 +1,35 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="rhino-source"
+
+export default class extends Controller {
+  static targets = ["modal", "textarea"]
+
+  connect() {
+    this.modalTarget.classList.add("hidden")
+    this._editor = null
+  }
+
+  registerEditor(editor) {
+    this._editor = editor
+  }
+
+  show(event) {
+    event?.preventDefault()
+    if (!this._editor) return
+    this.textareaTarget.value = this._editor.getHTML()
+    this.modalTarget.classList.remove("hidden")
+  }
+
+  hide(event) {
+    event?.preventDefault()
+    this.modalTarget.classList.add("hidden")
+  }
+
+  save(event) {
+    event.preventDefault()
+    if (!this._editor) return
+    this._editor.chain().focus().setContent(this.textareaTarget.value).run()
+    this.hide()
+  }
+}