Use better og images

Author: RoyalIcing

apps/components_guide_web/lib/components_guide_web/controllers/accessibility_first_controller.ex

@@ -3,24 +3,43 @@ defmodule ComponentsGuideWeb.AccessibilityFirstController do
   require Logger
 
   def index(conn, _params) do
-    render(conn, "index.html", article: "intro")
+    conn
+    |> assign(:page_title, page_title(nil))
+    |> render("index.html", article: "intro")
   end
 
   def show(conn, %{"id" => "widgets-cheatsheet"}) do
-    render(conn, "widgets-cheatsheet.html")
+    conn
+    |> assign(:page_title, "Accessible Widgets Cheatsheet")
+    |> render("widgets-cheatsheet.html")
   end
 
   def show(conn, %{"id" => "properties-cheatsheet"}) do
-    render(conn, "properties-cheatsheet.html")
+    conn
+    |> assign(:page_title, "Accessible Properties Cheatsheet")
+    |> render("properties-cheatsheet.html")
   end
 
   @articles ["navigation", "landmarks", "roles", "accessible-name", "forms", "content"]
 
   def show(conn, %{"id" => article}) when article in @articles do
-    render(conn, "index.html", article: article)
+    conn
+    |> assign(:page_title, page_title(article))
+    |> render("index.html", article: article)
   end
 
   def show(conn, _params) do
     raise Phoenix.Router.NoRouteError, conn: conn, router: ComponentsGuideWeb.Router
   end
+
+  defp page_title("navigation"), do: "Accessibility-First Navigation"
+  defp page_title("landmarks"), do: "Accessibility-First Landmarks"
+  defp page_title("roles"), do: "Accessibility-First Roles"
+  defp page_title("forms"), do: "Accessibility-First Forms"
+  defp page_title("content"), do: "Accessibility-First Content"
+  defp page_title("accessible-name"), do: "Learning Accessible Names"
+
+  defp page_title(_) do
+    "Accessibility-First Development"
+  end
 end

apps/components_guide_web/lib/components_guide_web/templates/layout/root.html.leex

@@ -12,13 +12,13 @@
     <%
       stamp_query = case assigns[:page_title] do
         nil ->
-          "source=Components.Guide"
+          [primary: "Components.Guide", secondary: "Learn accessibility, web standards, testing React & more"]
 
         title ->
-          URI.encode_query(source: "Components.Guide", headline: title)
+          [primary: "Components.Guide", secondary: title]
       end
     %>
-    <meta property="og:image" content="https://stamp.vercel.app/api/poster?<%= stamp_query %>">
+    <meta property="og:image" content="https://postage-stamp.collected.workers.dev/1/poster?<%= URI.encode_query(stamp_query) %>">
 
     <script defer type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>