#17 Add Kramdown for events description

Gemfile

@@ -9,8 +9,8 @@ ruby "3.0.1"
 gem "rails", "~> 6.1.3", ">= 6.1.3.2"
 
 gem "devise" # Use to authenticate user
-# Use postgresql as the database for Active Record
-gem "pg", "~> 1.1"
+gem "kramdown", "~> 2.3", ">= 2.3.1"
+gem "pg", "~> 1.1" # Use postgresql as the database for Active Record
 gem "puma", "~> 5.0" # Use Puma as the app server
 gem "pundit" # use pundit to control app premissions and policies
 gem "sass-rails", ">= 6" # Use SCSS for stylesheets

Gemfile.lock

@@ -101,6 +101,8 @@ GEM
  concurrent-ruby (~> 1.0)
  jbuilder (2.11.2)
  activesupport (>= 5.0.0)
+ kramdown (2.3.1)
+ rexml
  listen (3.5.1)
  rb-fsevent (~> 0.10, >= 0.10.3)
  rb-inotify (~> 0.9, >= 0.9.10)
@@ -273,6 +275,7 @@ DEPENDENCIES
  factory_bot
  factory_bot_rails
  jbuilder (~> 2.7)
+ kramdown (~> 2.3, >= 2.3.1)
  listen (~> 3.3)
  pg (~> 1.1)
  pry

app/helpers/application_helper.rb

@@ -38,4 +38,14 @@ def alert_color
  return "is-success" if notice
  "is-primary"
  end
+
+ # Helper method to convert Markwodn to HTML in the views
+ def kramdown(text)
+ sanitize Kramdown::Document.new(text).to_html
+ end
+
+ # Converts to html and then that removes all html tags in order to get pure text
+ def kramdown_pure_text(text)
+ sanitize kramdown(text), { tags: [] }
+ end
 end

app/views/events/_list.html.erb

@@ -11,7 +11,7 @@
  <% events.each do |event| %>
  <tr>
  <td><%= link_to event, event %></td>
- <td><%= event.description %></td>
+ <td><%= kramdown_pure_text(event.description) %></td>
  <td><%= date_range(event) %></td>
  <td><%= buttons(event) %></td>
  </tr>

app/views/events/show.html.erb

@@ -4,10 +4,12 @@
  <h1 class="title"><%= @event.name %></h1>
  <p role="doc-subtitle" class="subtitle"><%= date_range(@event) %></p>
  <p>
- <%= @event.description %>
+ <%= kramdown(@event.description) %>
  </p>
 
- <%= buttons(@event, include_nav: true) %>
+ <p>
+ <%= buttons(@event, include_nav: true) %>
+ </p>
  </div>
 
  <div class="column is-one-quarter">
@@ -16,7 +18,7 @@
  <%= button_to "Not Attending",
  { controller: :event_attendees,
  action: :destroy,
- id: current_user&.profile&.event_attendee(@event)&.first&.id }, 
+ id: current_user&.profile&.event_attendee(@event)&.first&.id },
  method: :delete,
  class: "button is-danger" %>
  <% elsif current_user %>

spec/factories/events.rb

@@ -3,7 +3,7 @@
 FactoryBot.define do
  factory :event do
  name { "RubyConf" }
- description { "[RubyConf 2020](https://rubyconf.org/) will be held in Denver." }
+ description { "[RubyConf 2020](https://rubyconf.org/) will be held in `Denver`." }
  start_at { "2021-11-08 00:00:00" }
  end_at { "2021-11-10 00:00:00" }
 

spec/helpers/application_helper_spec.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+require "rails_helper"
+
+RSpec.describe ApplicationHelper do
+ context "when kramdown is used to convert markdown to html" do
+ it "if the inline code markdown code is passed" do
+ markdown_source = "`inline code`"
+ expect(kramdown(markdown_source)).to eq "<p><code>inline code</code></p>\n"
+ end
+
+ it "if the multiline code markdown code is passed" do
+ markdown_source = "* list"
+ expect(kramdown(markdown_source)).to eq "<ul>\n <li>list</li>\n</ul>\n"
+ end
+ end
+
+ context "when kramdown_pure_text is used to remove any markdown code" do
+ it "if the inline code markdown code is passed" do
+ markdown_source = "`inline code`"
+ expect(kramdown_pure_text(markdown_source)).to eq "inline code\n"
+ end
+ end
+end

spec/requests/events_spec.rb

@@ -24,6 +24,14 @@
  let(:event) { create :event }
  let(:format) { :html }
 
+ context "when description has markdown" do
+ it "converts markdown to html" do
+ get event_url(event)
+ expected_str = '<a href="https://rubyconf.org/">RubyConf 2020</a> will be held in <code>Denver</code>.'
+ expect(response.body).to include(expected_str)
+ end
+ end
+
  context "when format is html" do
  let(:format) { :html }