Rendering html combined with unsafe data with Phoenix.HTML

show.html.heex

<h1>Show Post</h1>

<%= if @live_action in [:edit] do %>
  <%= live_modal Lms01Web.PostLive.FormComponent,
    id: @post.id,
    title: @page_title,
    action: @live_action,
    post: @post,
    return_to: Routes.post_show_path(@socket, :show, @post) %>
<% end %>

<ul>
  <li>
    <strong>Title:</strong>
    <%= @post.title %>
  </li>
 

 <%# THIS LINE IS THE PROBLEM %>
 
  <li phx-hook="PostList" data-post={"postbody-#{@post.id}"}>
    <strong>Body:</strong>
    <%= @post.body %>
  </li>

  <li>
    <strong>Published:</strong>
    <%= @post.published %>
  </li>

  <li>
    <strong>Author:</strong>
    <%= @post.author %>
  </li>

  <li>
    <strong>Keywords:</strong>
    <%= @post.keywords %>
  </li>

</ul>

<span><%= live_patch "Edit", to: Routes.post_show_path(@socket, :edit, @post), class: "button" %></span> |
<span><%= live_redirect "Back", to: Routes.post_index_path(@socket, :index) %></span>

@post.body renders the html raw.

How do I get liveview to interpret html and make headings as they should be.

this is how body looks.

Body: is not rendered properly.