setting up turbo-based comments

Gemfile

@@ -24,6 +24,10 @@ gem 'puma' #, '~> 5.0'
 gem 'webpacker' #, '~> 5.0'
 # Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
 gem 'turbolinks' #, '~> 5'
+
+# The new kid on the block:
+gem 'turbo-rails'
+
 # Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
 gem 'jbuilder' #, '~> 2.7'
 # Use Redis adapter to run Action Cable in production

Gemfile.lock

@@ -240,6 +240,9 @@ GEM
       activesupport (>= 4.0)
       sprockets (>= 3.0.0)
     thor (1.1.0)
+    turbo-rails (1.0.1)
+      actionpack (>= 6.0.0)
+      railties (>= 6.0.0)
     turbolinks (5.2.1)
       turbolinks-source (~> 5.2)
     turbolinks-source (5.2.0)
@@ -297,6 +300,7 @@ DEPENDENCIES
   selenium-webdriver
   sorcery
   spring
+  turbo-rails
   turbolinks
   tzinfo-data
   web-console (>= 4.1.0)

app/controllers/comments_controller.rb

+class CommentsController < ApplicationController
+  before_action :set_comment, only: %i[ show edit update destroy ]
+
+  # GET /comments or /comments.json
+  def index
+    @comments = Comment.all
+  end
+
+  # GET /comments/1 or /comments/1.json
+  def show
+  end
+
+  # GET /comments/new
+  def new
+    @comment = Comment.new
+  end
+
+  # GET /comments/1/edit
+  def edit
+  end
+
+  # POST /comments or /comments.json
+  def create
+    @comment = Comment.new(comment_params)
+
+    respond_to do |format|
+      if @comment.save
+        format.html { redirect_to @comment, notice: "Comment was successfully created." }
+        format.json { render :show, status: :created, location: @comment }
+      else
+        format.html { render :new, status: :unprocessable_entity }
+        format.json { render json: @comment.errors, status: :unprocessable_entity }
+      end
+    end
+  end
+
+  # PATCH/PUT /comments/1 or /comments/1.json
+  def update
+    respond_to do |format|
+      if @comment.update(comment_params)
+        format.html { redirect_to @comment, notice: "Comment was successfully updated." }
+        format.json { render :show, status: :ok, location: @comment }
+      else
+        format.html { render :edit, status: :unprocessable_entity }
+        format.json { render json: @comment.errors, status: :unprocessable_entity }
+      end
+    end
+  end
+
+  # DELETE /comments/1 or /comments/1.json
+  def destroy
+    @comment.destroy
+    respond_to do |format|
+      format.html { redirect_to comments_url, notice: "Comment was successfully destroyed." }
+      format.json { head :no_content }
+    end
+  end
+
+  private
+    # Use callbacks to share common setup or constraints between actions.
+    def set_comment
+      @comment = Comment.find(params[:id])
+    end
+
+    # Only allow a list of trusted parameters through.
+    def comment_params
+      params.require(:comment).permit(:text, :user_id, :commentable_id, :commentable_type)
+    end
+end

app/frontend/packs/application.js

@@ -4,10 +4,12 @@
 // that code so it'll be compiled.
 
 import Rails from "@rails/ujs"
-import Turbolinks from "turbolinks"
+//import Turbolinks from "turbolinks"
 import * as ActiveStorage from "@rails/activestorage"
 import "channels"
 
+import { Turbo } from "@hotwired/turbo-rails"
+
 // Fix default icons (see https://github.com/ghybs/leaflet-defaulticon-compatibility)
 // Alternatively we could also https://github.com/Leaflet/Leaflet/issues/4968
 import 'leaflet/dist/leaflet.css';
@@ -28,7 +30,7 @@ import "../src/imagemap-map"
 import "../src/datatable"
 
 Rails.start()
-Turbolinks.start()
+//Turbolinks.start()
 ActiveStorage.start()
 
 // Stimulus

app/helpers/comments_helper.rb

+module CommentsHelper
+end

app/models/comment.rb

+# == Schema Information
+#
+# Table name: comments
+#
+#  id               :bigint           not null, primary key
+#  commentable_type :string           not null
+#  text             :text
+#  created_at       :datetime         not null
+#  updated_at       :datetime         not null
+#  commentable_id   :bigint           not null
+#  user_id          :bigint           not null
+#
+# Indexes
+#
+#  index_comments_on_commentable  (commentable_type,commentable_id)
+#  index_comments_on_user_id      (user_id)
+#
+# Foreign Keys
+#
+#  fk_rails_...  (user_id => users.id)
+#
+class Comment < ApplicationRecord
+  belongs_to :user
+
+  # every commentable should have a method “name”
+  belongs_to :commentable, polymorphic: true
+  
+end

app/models/map.rb

@@ -45,6 +45,7 @@ class Map < ApplicationRecord
   has_many :image_maps, dependent: :destroy
   accepts_nested_attributes_for :image_maps, reject_if: :all_blank, allow_destroy: true
   has_and_belongs_to_many :categories
+  has_many :comments, as: :commentable # we also add a name alias below
 
   def dates
     itemdates.map { |itemdate|
@@ -60,5 +61,7 @@ class Map < ApplicationRecord
     title.blank? ? '– no title –' : title
   end
   
+  alias_method :name, :label # a commentable shall have a name
+  
   # ToDo: Images, Urls
 end

app/models/user.rb

@@ -21,4 +21,6 @@ class User < ApplicationRecord
   validates :password_confirmation, presence: true, if: -> { new_record? || changes[:crypted_password] }
 
   validates :username, presence: true, length: { maximum: 255 }, uniqueness: true
+
+  has_many :comments
 end

app/views/comments/_comment.json.jbuilder

+json.extract! comment, :id, :text, :user_id, :commentable_id, :commentable_type, :created_at, :updated_at
+json.url comment_url(comment, format: :json)

app/views/comments/_form.html.erb

+<%= turbo_frame_tag comment do %>
+	<%= form_with(model: comment) do |form| %>
+  <% if comment.errors.any? %>
+    <div id="error_explanation">
+      <h2><%= pluralize(comment.errors.count, "error") %> prohibited this comment from being saved:</h2>
+
+      <ul>
+        <% comment.errors.each do |error| %>
+          <li><%= error.full_message %></li>
+        <% end %>
+      </ul>
+    </div>
+  <% end %>
+
+  <div class="field">
+    <%= form.label :text %>
+    <%= form.text_area :text %>
+  </div>
+
+  <div class="field">
+    <%= form.label :user_id %>
+    <%= form.text_field :user_id %>
+  </div>
+
+  <div class="field">
+    <%= form.label :commentable_id %>
+    <%= form.text_field :commentable_id %>
+  </div>
+
+  <div class="actions">
+    <%= form.submit %>
+  </div>
+	<% end %>
+	<% end %>

app/views/comments/edit.html.erb

+<h1>Editing Comment</h1>
+
+<%= render 'form', comment: @comment %>
+
+<%= link_to 'Show', @comment %> |
+<%= link_to 'Back', comments_path %>

app/views/comments/index.html.erb

+<p id="notice"><%= notice %></p>
+
+<h1>Comments</h1>
+
+<table>
+  <thead>
+    <tr>
+      <th>Text</th>
+      <th>User</th>
+      <th>Commentable</th>
+      <th colspan="3"></th>
+    </tr>
+  </thead>
+
+  <tbody>
+    <% @comments.each do |comment| %>
+      <tr>
+        <td><%= comment.text %></td>
+        <td><%= comment.user_id %></td>
+        <td><%= comment.commentable_id %></td>
+        <td><%= link_to 'Show', comment %></td>
+        <td><%= link_to 'Edit', edit_comment_path(comment) %></td>
+        <td><%= link_to 'Destroy', comment, method: :delete, data: { confirm: 'Are you sure?' } %></td>
+      </tr>
+    <% end %>
+  </tbody>
+</table>
+
+<br>
+
+<%= link_to 'New Comment', new_comment_path %>

app/views/comments/index.json.jbuilder

+json.array! @comments, partial: "comments/comment", as: :comment

app/views/comments/new.html.erb

+<h1>New Comment</h1>
+
+<%= render 'form', comment: @comment %>
+
+<%= link_to 'Back', comments_path %>

app/views/comments/show.html.erb

+<p id="notice"><%= notice %></p>
+
+<p>
+  <strong>Text:</strong>
+  <%= @comment.text %>
+</p>
+
+<p>
+  <strong>User:</strong>
+  <%= @comment.user.username %>
+</p>
+
+<p>
+  <strong>For:</strong>
+  <%= link_to @comment.commentable.name, @comment.commentable %>
+</p>
+
+<%= link_to 'Edit', edit_comment_path(@comment) %> |
+<%= link_to 'Back', comments_path %>
+
+<h2>Test Turbo</h2>
+<p>
+	The following is for turbo testing purposes.
+	You shouldn't be here anyway
+</p>
+<hr>
+
+<%= turbo_frame_tag @comment do %>
+  <div>
+    <%= link_to @comment.text, edit_comment_path(@comment) %>
+  </div>
+<% end %>
+
+<%= turbo_frame_tag :new_comment do %>
+  <div>
+    <%= link_to "new comment", new_comment_path %>
+  </div>
+<% end %>

app/views/comments/show.json.jbuilder

+json.partial! "comments/comment", comment: @comment

config/routes.rb

@@ -25,4 +25,8 @@ Rails.application.routes.draw do
   end
   get 'examples/index'
   # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
+
+  # for debugging
+  resources :comments
+
 end

db/migrate/20220305093114_create_comments.rb

+class CreateComments < ActiveRecord::Migration[6.1]
+  def change
+    create_table :comments do |t|
+      t.text :text
+      t.references :user, null: false, foreign_key: true
+      t.references :commentable, polymorphic: true, null: false
+
+      t.timestamps
+    end
+  end
+end

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2022_03_02_192312) do
+ActiveRecord::Schema.define(version: 2022_03_05_093114) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "adminpack"
@@ -62,6 +62,17 @@ ActiveRecord::Schema.define(version: 2022_03_02_192312) do
     t.index ["map_id"], name: "index_categories_maps_on_map_id"
   end
 
+  create_table "comments", force: :cascade do |t|
+    t.text "text"
+    t.bigint "user_id", null: false
+    t.string "commentable_type", null: false
+    t.bigint "commentable_id", null: false
+    t.datetime "created_at", precision: 6, null: false
+    t.datetime "updated_at", precision: 6, null: false
+    t.index ["commentable_type", "commentable_id"], name: "index_comments_on_commentable"
+    t.index ["user_id"], name: "index_comments_on_user_id"
+  end
+
   create_table "dfg_maps", force: :cascade do |t|
     t.string "placename"
     t.string "signature"
@@ -226,6 +237,7 @@ ActiveRecord::Schema.define(version: 2022_03_02_192312) do
   add_foreign_key "active_storage_variant_records", "active_storage_blobs", column: "blob_id"
   add_foreign_key "categories_maps", "categories"
   add_foreign_key "categories_maps", "maps"
+  add_foreign_key "comments", "users"
   add_foreign_key "dfg_maps", "maps"
   add_foreign_key "image_maps", "maps"
   add_foreign_key "localized_names", "places"

package.json

@@ -2,6 +2,7 @@
   "name": "mapmymaps-p1",
   "private": true,
   "dependencies": {
+    "@hotwired/turbo-rails": "^7.1.1",
     "@rails/actioncable": "^6.0.0",
     "@rails/activestorage": "^6.0.0",
     "@rails/ujs": "^6.0.0",