SSR a simple "static" page for social bots to consume to get media / content for social links

header-meta-render.cljs

(ns visx.socialite.content
  (:require-macros
   [hiccups.core :refer [html]])
  (:require
   [hiccups.runtime :as hiccupsrt]))


(defn render
  "These inputs were from our app fetched from appsync/dynamodb. 
  You could get the inputs you need using whatever backing store you have
  The functions here are also our app specific to form the proper urls, text, etc. 
  You would replace them with what you neeed.
  This would run in the origin-request lambda@edge for the times the request was made by a social crawler bot
  Otherwise just return the normal SPA html/javascript for non crawler requests"
  [{:keys [image url store display-name from-date from-date-utc timezone] :as visx-event}]
  (let [store-name             (:name store)
        retailer-id            (get-in store [:retailer :id])
        retailer-name          (get-in store [:retailer :name])
        event-name             display-name
        landing-page-image-url (gen-image-url url image)
        site-name              (make-site-name event-name retailer-name)
        description            (make-description from-date-utc timezone retailer-name)]
    (html
     [:html
      [:head
       [:meta {:charset "UTF-8"}]
       [:meta {:name "viewport"
               :content "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"}]
       [:title event-name]
       [:meta {:name    "description"
               :content description}]
       [:meta {:name    "image"
               :content landing-page-image-url}]

       ;; Facebook, Pineterest, Applebot, etc OpenGraph
       [:meta {:property "og:type"
               :content  "article"}]
       [:meta {:property "og:title"
               :content  event-name}]
       [:meta {:property "og:description"
               :content  description}]
       [:meta {:property "og:url"
               :content  url}]
       [:meta {:property "og:site_name"
               :content  event-name}]
       [:meta {:property "og:image"
               :content  landing-page-image-url}]

       ;; Twitter
       [:meta {:name "twitter:card"
               :content  "summary_large_image"}]
       [:meta {:name "twitter:url"
               :content  url}]
       [:meta {:name "twitter:title"
               :content  event-name}]
       [:meta {:name "twitter:description"
               :content  description}]
       [:meta {:name "twitter:image"
               :content  landing-page-image-url}]]

      [:body
       [:h1 event-name]
       [:h2 "Image data here..."]
       [:img {:itemprop "image" :src landing-page-image-url :round true}]]])))