Update application to use rich text for Location and Description (#56)

* Update application to use rich text for Location and Description

* Fix seeds

* Remove debug statement

Gemfile

@@ -44,7 +44,7 @@ gem 'tzinfo-data', platforms: %i[windows jruby]
 gem 'bootsnap', require: false
 
 # Use Active Storage variants [https://guides.rubyonrails.org/active_storage_overview.html#transforming-images]
-# gem "image_processing", "~> 1.2"
+gem "image_processing", "~> 1.2"
 
 # Internet calendaring, Ruby style
 gem 'icalendar', '~> 2.10'

Gemfile.lock

@@ -92,6 +92,9 @@ GEM
       reline (>= 0.3.8)
     drb (2.2.1)
     erubi (1.13.0)
+    ffi (1.17.0-arm64-darwin)
+    ffi (1.17.0-x86_64-darwin)
+    ffi (1.17.0-x86_64-linux-gnu)
     globalid (1.2.1)
       activesupport (>= 6.1)
     honeybadger (5.11.2)
@@ -100,6 +103,9 @@ GEM
     icalendar (2.10.2)
       ice_cube (~> 0.16)
     ice_cube (0.17.0)
+    image_processing (1.13.0)
+      mini_magick (>= 4.9.5, < 5)
+      ruby-vips (>= 2.0.17, < 3)
     io-console (0.7.2)
     irb (1.13.1)
       rdoc (>= 4.0.0)
@@ -109,6 +115,7 @@ GEM
       activesupport (>= 5.0.0)
     jsbundling-rails (1.3.0)
       railties (>= 6.0.0)
+    logger (1.6.1)
     loofah (2.22.0)
       crass (~> 1.0.2)
       nokogiri (>= 1.12.0)
@@ -118,6 +125,7 @@ GEM
       net-pop
       net-smtp
     marcel (1.0.4)
+    mini_magick (4.13.2)
     mini_mime (1.1.5)
     minitest (5.23.1)
     msgpack (1.7.2)
@@ -190,6 +198,9 @@ GEM
       connection_pool
     reline (0.5.9)
       io-console (~> 0.5)
+    ruby-vips (2.2.2)
+      ffi (~> 1.12)
+      logger
     sprockets (4.2.1)
       concurrent-ruby (~> 1.0)
       rack (>= 2.2.4, < 4)
@@ -230,6 +241,7 @@ DEPENDENCIES
   debug
   honeybadger (~> 5.6)
   icalendar (~> 2.10)
+  image_processing (~> 1.2)
   jbuilder
   jsbundling-rails
   pg

Procfile.dev

@@ -1,3 +1,2 @@
-web: env RUBY_DEBUG_OPEN=true bin/rails server
 js: yarn build --watch
 css: yarn build:css --watch

app/assets/config/manifest.js

@@ -1,2 +1,3 @@
+//= link actiontext.css
 //= link_tree ../images
 //= link_tree ../builds

app/assets/stylesheets/actiontext.css

@@ -0,0 +1,31 @@
+/*
+ * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
+ * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
+ * inclusion directly in any other asset bundle and remove this file.
+ *
+ *= require trix
+*/
+
+/*
+ * We need to override trix.css’s image gallery styles to accommodate the
+ * <action-text-attachment> element we wrap around attachments. Otherwise,
+ * images in galleries will be squished by the max-width: 33%; rule.
+*/
+.trix-content .attachment-gallery > action-text-attachment,
+.trix-content .attachment-gallery > .attachment {
+  flex: 1 0 33%;
+  padding: 0 0.5em;
+  max-width: 33%;
+}
+
+.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
+  flex-basis: 50%;
+  max-width: 50%;
+}
+
+.trix-content action-text-attachment .attachment {
+  padding: 0 !important;
+  max-width: 100% !important;
+}

app/assets/stylesheets/application.tailwind.css

@@ -13,3 +13,4 @@
     @apply text-lg font-medium;
   }
 }
+

app/controllers/admin/base_controller.rb

@@ -1,8 +1,8 @@
 module Admin
   class BaseController < ApplicationController
     http_basic_authenticate_with(
-      name: Rails.env.test? ? "admin" : Rails.application.credentials.auth.user,
-      password: Rails.env.test? ? "admin" : Rails.application.credentials.auth.password
+      name: Rails.env.production? ? Rails.application.credentials.auth.user : 'admin',
+      password: Rails.env.production? ? Rails.application.credentials.auth.password : 'admin'
     )
   end
 end

app/controllers/admin/events_controller.rb

@@ -68,7 +68,7 @@ def set_event
 
     # Only allow a list of trusted parameters through.
     def event_params
-      params.require(:event).permit(:name, :rsvp_link, :location, :presentation, :presenter, :sponsor, :sponsor_link,
+      params.require(:event).permit(:name, :rsvp_link, :location, :description, :sponsor, :sponsor_link,
                                     :sponsor_logo, :start_at, :status)
     end
 

app/javascript/application.js

@@ -1,3 +1,6 @@
 // Entry point for the build script in your package.json
 import "@hotwired/turbo-rails"
 import "./controllers"
+
+import "trix"
+import "@rails/actiontext"

app/models/calendar.rb

@@ -1,4 +1,4 @@
-require "icalendar"
+require 'icalendar'
 
 class Calendar
   include Rails.application.routes.url_helpers
@@ -17,7 +17,7 @@ def publish
     @events.each do |event|
       calendar.event do |e|
         e.dtstart     = ical_time(event.start_at)
-        e.dtend       = ical_time(event.start_at + 2.hours)
+        e.dtend       = ical_time(event.start_at + 3.hours)
         e.summary     = "Toronto Ruby - #{event.name}"
         e.location    = event.city
         e.url         = event.rsvp_link || event_url(event)
@@ -34,15 +34,10 @@ def publish
 
         e.description = <<~DESCRIPTION
           Toronto Ruby - #{event.name}
+          #{event.description.to_plain_text}
 
           Location:
-          #{event.location}
-
-          Presenter:
-          #{event.presenter}
-
-          Presentation:
-          #{event.presentation}
+          #{event.location.to_plain_text}
 
           Event-Site:
           #{event_url(event)}
@@ -63,7 +58,7 @@ def to_ical
   private
 
   def timezone_identifier
-    "America/Toronto"
+    'America/Toronto'
   end
 
   def timezone

app/models/event.rb

@@ -1,11 +1,14 @@
 class Event < ApplicationRecord
-  validates :start_at, :name, :location, :presentation, presence: true
+  validates :start_at, :name, :location, :description, presence: true
 
   enum :status, { draft: 0, published: 1 }, default: :draft
 
   scope :upcoming, -> { published.where(start_at: Time.zone.now...).order(start_at: :asc) }
   scope :past, -> { published.where(start_at: ...Time.zone.now).order(start_at: :desc) }
 
+  has_rich_text :description
+  has_rich_text :location
+
   def start_time
     start_at.in_time_zone('Eastern Time (US & Canada)').to_fs(:long_at)
   end

app/views/active_storage/blobs/_blob.html.erb

@@ -0,0 +1,14 @@
+<figure class="attachment attachment--<%= blob.representable? ? "preview" : "file" %> attachment--<%= blob.filename.extension %>">
+  <% if blob.representable? %>
+    <%= image_tag blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [ 800, 600 ] : [ 1024, 768 ]) %>
+  <% end %>
+
+  <figcaption class="attachment__caption">
+    <% if caption = blob.try(:caption) %>
+      <%= caption %>
+    <% else %>
+      <span class="attachment__name"><%= blob.filename %></span>
+      <span class="attachment__size"><%= number_to_human_size blob.byte_size %></span>
+    <% end %>
+  </figcaption>
+</figure>

app/views/admin/events/_form.html.erb

@@ -15,16 +15,12 @@
     <%= form.label :name %>
     <%= form.text_field :name, required: true %>
     <%= form.label :location %>
-    <%= form.text_area :location, required: true %>
+    <%= form.rich_text_area :location, required: true %>
     <%= form.label :rsvp_link %>
     <%= form.text_field :rsvp_link, required: true %>
-    <%= form.label :presentation %>
-    <%= form.text_area :presentation %>
-    <%= form.label :presenter %>
-    <%= form.text_area :presenter %>
+    <%= form.label :description %>
+    <%= form.rich_text_area :description %>
     <%= form.label :sponsor %>
-    <%= form.text_field :sponsor %>
-    <%= form.label :sponsor_link %>
     <%= form.text_field :sponsor_link %>
     <%= form.label :sponsor_logo %>
     <%= form.text_field :sponsor_logo %>

app/views/events/_event.html.erb

@@ -5,8 +5,8 @@
       <h2 class="mb-2"><%= link_to event.name, event %></h2>
       <div class="flex flex-col gap-3">
         <p class="mb-2"><%= event.start_time %></p>
-        <%= simple_format(event.location) %>
-        <p>Pizza and drinks provided by our sponsor.</p>
+        <%= event.location %>
+        <p>Food and drinks provided by our sponsor.</p>
       </div>
     </div>
 
@@ -21,9 +21,7 @@
       <p class="mb-0"><em>7pm</em></p>
       <div class="ml-4">
         <div class="w-4/5 mt-2">
-          <p>Presentation:</p>
-          <p class="mb-0"><strong><%= event.presentation %></strong></p>
-          <p>by <%= event.presenter&.html_safe %></p>
+          <%= event.description %>
         </div>
       </div>
 

app/views/layouts/_event_layout.html.erb

@@ -2,7 +2,7 @@
   <div class="flex flex-col gap-6">
     <div class="text-center">
       <h1>
-        Monthly meetups for Toronto's Ruby community
+        Meetups for Toronto's Ruby community
       </h1>
 
       <p>We're a group of Ruby developers who meet up to talk about programming, the industry, and life. We're working to strengthen the local Ruby community and provide a positive space for everyone to connect.</p>

app/views/layouts/action_text/contents/_content.html.erb

@@ -0,0 +1,3 @@
+<div class="trix-content">
+  <%= yield -%>
+</div>

app/views/layouts/application.html.erb

@@ -8,7 +8,7 @@
 
     <%= render "layouts/common/opengraph" %>
 
-    <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
+    <%= stylesheet_link_tag "application", "actiontext", "data-turbo-track": "reload" %>
     <%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
   </head>
 

db/migrate/20241012002909_create_active_storage_tables.active_storage.rb

@@ -0,0 +1,57 @@
+# This migration comes from active_storage (originally 20170806125915)
+class CreateActiveStorageTables < ActiveRecord::Migration[7.0]
+  def change
+    # Use Active Record's configured type for primary and foreign keys
+    primary_key_type, foreign_key_type = primary_and_foreign_key_types
+
+    create_table :active_storage_blobs, id: primary_key_type do |t|
+      t.string   :key,          null: false
+      t.string   :filename,     null: false
+      t.string   :content_type
+      t.text     :metadata
+      t.string   :service_name, null: false
+      t.bigint   :byte_size,    null: false
+      t.string   :checksum
+
+      if connection.supports_datetime_with_precision?
+        t.datetime :created_at, precision: 6, null: false
+      else
+        t.datetime :created_at, null: false
+      end
+
+      t.index [ :key ], unique: true
+    end
+
+    create_table :active_storage_attachments, id: primary_key_type do |t|
+      t.string     :name,     null: false
+      t.references :record,   null: false, polymorphic: true, index: false, type: foreign_key_type
+      t.references :blob,     null: false, type: foreign_key_type
+
+      if connection.supports_datetime_with_precision?
+        t.datetime :created_at, precision: 6, null: false
+      else
+        t.datetime :created_at, null: false
+      end
+
+      t.index [ :record_type, :record_id, :name, :blob_id ], name: :index_active_storage_attachments_uniqueness, unique: true
+      t.foreign_key :active_storage_blobs, column: :blob_id
+    end
+
+    create_table :active_storage_variant_records, id: primary_key_type do |t|
+      t.belongs_to :blob, null: false, index: false, type: foreign_key_type
+      t.string :variation_digest, null: false
+
+      t.index [ :blob_id, :variation_digest ], name: :index_active_storage_variant_records_uniqueness, unique: true
+      t.foreign_key :active_storage_blobs, column: :blob_id
+    end
+  end
+
+  private
+    def primary_and_foreign_key_types
+      config = Rails.configuration.generators
+      setting = config.options[config.orm][:primary_key_type]
+      primary_key_type = setting || :primary_key
+      foreign_key_type = setting || :bigint
+      [primary_key_type, foreign_key_type]
+    end
+end

db/migrate/20241012002910_create_action_text_tables.action_text.rb

@@ -0,0 +1,26 @@
+# This migration comes from action_text (originally 20180528164100)
+class CreateActionTextTables < ActiveRecord::Migration[6.0]
+  def change
+    # Use Active Record's configured type for primary and foreign keys
+    primary_key_type, foreign_key_type = primary_and_foreign_key_types
+
+    create_table :action_text_rich_texts, id: primary_key_type do |t|
+      t.string     :name, null: false
+      t.text       :body, size: :long
+      t.references :record, null: false, polymorphic: true, index: false, type: foreign_key_type
+
+      t.timestamps
+
+      t.index [ :record_type, :record_id, :name ], name: "index_action_text_rich_texts_uniqueness", unique: true
+    end
+  end
+
+  private
+    def primary_and_foreign_key_types
+      config = Rails.configuration.generators
+      setting = config.options[config.orm][:primary_key_type]
+      primary_key_type = setting || :primary_key
+      foreign_key_type = setting || :bigint
+      [primary_key_type, foreign_key_type]
+    end
+end

db/migrate/20241012003354_migrate_event_content_to_action_text.rb

@@ -0,0 +1,27 @@
+class MigrateEventContentToActionText < ActiveRecord::Migration[7.1]
+  include ActionView::Helpers::TextHelper
+
+  def up
+    rename_column :events, :location, :location_plain
+    Event.find_each do |event|
+      event.update_attribute(:location, simple_format(event.location_plain))
+      event.update_attribute(:description, "#{event.presentation} by #{event.presenter}")
+    end
+    remove_column :events, :location_plain
+    remove_column :events, :presenter
+    remove_column :events, :presentation
+  end
+
+  def down
+    puts 'WARNING, YOU MUST MANUALLY UPDATE INFORMATION THAT IS PRINTED BELOW.'
+    add_column :events, :location_plain, :text
+    add_column :events, :presenter, :text
+    add_column :events, :presentation, :text
+    Event.find_each do |event|
+      event.update_attribute(:location_plain, event.location.body.to_plain_text)
+      puts "Event #{event.id} Description"
+      puts event.description.body.to_plain_text
+    end
+    rename_column :events, :location_plain, :location
+  end
+end