Add OpenGraph metadata on user profiles and answers

app/helpers/application_helper.rb

@@ -169,4 +169,62 @@ module ApplicationHelper
   def list_title(list)
     generate_title list.name
   end
+
+  # Creates <meta> tags for OpenGraph properties from a hash
+  # @param values [Hash]
+  def opengraph_meta_tags(values)
+    values.map { |name, content| tag(:meta, property: name, content: content) }.join("\n").html_safe
+  end
+
+  # Creates <meta> tags from a hash
+  # @param values [Hash]
+  def meta_tags(values)
+    values.map { |name, content| tag(:meta, name: name, content: content) }.join("\n").html_safe
+  end
+
+  # @param user [User]
+  def user_opengraph(user)
+    opengraph_meta_tags({
+      'og:title': user.display_name,
+      'og:type': 'profile',
+      'og:image': full_profile_picture_url(user),
+      'og:url': show_user_profile_url(user.screen_name),
+      'og:description': user.bio,
+      'og:site_name': APP_CONFIG['site_name'],
+      'profile:username': user.screen_name
+    })
+  end
+
+  # @param user [User]
+  def user_twitter_card(user)
+    meta_tags({
+      'twitter:card': 'summary',
+      'twitter:site': '@retrospring',
+      'twitter:title': user.motivation_header.presence || "Ask me anything!",
+      'twitter:description': "Ask #{user.display_name} anything on Retrospring",
+      'twitter:image': full_profile_picture_url(user)
+    })
+  end
+
+  # @param answer [Answer]
+  def answer_opengraph(answer)
+    opengraph_meta_tags({
+      'og:title': answer.question.content,
+      'og:type': 'article',
+      'og:image': full_profile_picture_url(answer.user),
+      'og:url': show_user_answer_url(answer.user.screen_name, answer.id),
+      'og:description': answer.content,
+      'og:site_name': APP_CONFIG['site_name']
+    })
+  end
+
+  def full_profile_picture_url(user)
+    # @type [String]
+    profile_picture_url = user.profile_picture.url(:large)
+    if profile_picture_url.start_with? '/'
+      "#{root_url}#{profile_picture_url[1..-1]}"
+    else
+      profile_picture_url
+    end
+  end
 end

app/views/answer/show.haml

@@ -1,3 +1,4 @@
 - provide(:title, answer_title(@answer))
+- provide(:og, answer_opengraph(@answer))
 .container.container--main
   = render 'answerbox', a: @answer, display_all: @display_all

app/views/layouts/base.haml

@@ -1,5 +1,5 @@
 !!! 5
-%html{ lang: 'en' }
+%html{ lang: 'en', prefix: 'og: https://ogp.me/ns#' }
   %head
     %meta{ charset: 'utf-8' }
     %meta{ 'http-equiv': 'X-UA-Compatible', content: 'IE=edge' }
@@ -17,6 +17,8 @@
     - if user_signed_in? && current_user.mod?
       = javascript_pack_tag 'legacy-moderation', data: { 'turbolinks-track': 'reload' }
     = csrf_meta_tags
+    = yield(:og)
+    = yield(:meta)
   %body
     - if user_signed_in?
       = render 'navigation/main'

app/views/user/show.haml

@@ -11,4 +11,6 @@
       = t 'views.actions.load'
 
 - provide(:title, user_title(@user))
+- provide(:og, user_opengraph(@user))
+- provide(:meta, user_twitter_card(@user))
 - parent_layout 'user/profile'