zoeys.computer/lib/zoeyscomputer_web/live/gist_live/show.html.heex

<.header>
  <%= @gist.title || "Gist: #{@gist.id}" %>
  <:subtitle>This is a gist record from your database.</:subtitle>
  <:actions>
    <.link patch={~p"/gists/#{@gist}/show/edit"} phx-click={JS.push_focus()}>
      <.button>Edit gist</.button>
    </.link>
  </:actions>
</.header>

<meta property="og:title" content={@gist.title || "Gist: #{@gist.id}"} />
<meta property="og:description" content={@gist.desc} />
<meta property="og:image" content={url(~p"/gists/#{@gist.id}/preview")} />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />

<.code_block
  class="mt-4"
  code={@gist.code}
  language={@gist.lang}
  title={@gist.title}
  line_numbers={true}
  highlighted_lines={[118, 119, 120]}
/>

<.back navigate={~p"/gists"}>Back to gists</.back>

<.modal :if={@live_action == :edit} id="gist-modal" show on_cancel={JS.patch(~p"/gists/#{@gist}")}>
  <.live_component
    module={ZoeyscomputerWeb.GistLive.FormComponent}
    id={@gist.id}
    title={@page_title}
    action={@live_action}
    gist={@gist}
    patch={~p"/gists/#{@gist}"}
  />
</.modal>