improve public pages

2023-07-09 20:01:03 +02:00 · 2023-07-09 20:01:03 +02:00 · ac410636a6
commit ac410636a6
parent ac1db473f9
9 changed files with 77 additions and 62 deletions
--- a/lib/chiya_web/components/layouts/root_public.html.heex
+++ b/lib/chiya_web/components/layouts/root_public.html.heex
@ -36,7 +36,7 @@
  </head>
  <body class="text-theme-base bg-theme-background | h-feed hfeed">
    <aside class="block">
-      <%= raw @settings.custom_html %>
+      <%= raw(@settings.custom_html) %>
    </aside>
    <header class="my-8 block px-3">
      <nav class="mx-auto max-w-2xl">
@ -116,12 +116,15 @@
    </footer>

    <%= if @profile do %>
-    <section class="hidden | hcard h-card">
-      <a href="/" rel="me" class="u-url"><%= @profile.name %></a>
-      <img class="u-photo" src={ChiyaWeb.Uploaders.UserImage.url({@profile.user_image, @profile}, :thumb)} />
-      <span class="p-nickname"><%= @profile.handle %></span>
-      <span class="p-note"><%= @profile.bio %></span>
-    </section>
+      <section class="hidden | hcard h-card">
+        <a href="/" rel="me" class="u-url"><%= @profile.name %></a>
+        <img
+          class="u-photo"
+          src={ChiyaWeb.Uploaders.UserImage.url({@profile.user_image, @profile}, :thumb)}
+        />
+        <span class="p-nickname"><%= @profile.handle %></span>
+        <span class="p-note"><%= @profile.bio %></span>
+      </section>
    <% end %>

    <section class="flex h-1 w-full flex-row">
--- a/lib/chiya_web/components/public_components.ex
+++ b/lib/chiya_web/components/public_components.ex
@ -87,16 +87,18 @@ defmodule ChiyaWeb.PublicComponents do
  attr :class_title, :string, default: nil
  attr :class_subtitle, :string, default: nil

-  slot :title, required: true
  slot :subtitle, required: false

  def header(assigns) do
    ~H"""
    <header class={["p-8 rounded bg-theme-background1", @class]}>
      <h1 class={["text-3xl leading-10 text-theme-base", @class_title]}>
-        <%= render_slot(@title) %>
+        <%= render_slot(@inner_block) %>
      </h1>
-      <p :if={@subtitle != []} class={["mt-4 leading-7 font-semibold text-theme-base/75", @class_subtitle]}>
+      <p
+        :if={@subtitle != []}
+        class={["mt-4 leading-7 font-semibold text-theme-base/75", @class_subtitle]}
+      >
        <%= render_slot(@subtitle) %>
      </p>
    </header>
@ -119,12 +121,16 @@ defmodule ChiyaWeb.PublicComponents do
    end
  end

+  attr :notes, :list, required: true
+
  def note_list_headers(assigns) do
    ~H"""
    <section class="note-list default | mt-6 sm:w-auto flex flex-col gap-3">
      <%= for note <- assigns.notes do %>
-        <a href={~p"/note/#{note.slug}"}
-          class="rounded-lg px-6 pt-4 pb-5 border border-theme-background1 hover:bg-theme-background1 transition">
+        <a
+          href={~p"/note/#{note.slug}"}
+          class="rounded-lg px-6 pt-4 pb-5 border border-theme-background1 hover:bg-theme-background1 transition"
+        >
          <header>
            <span class="text-theme-secondary text-lg font-semibold leading-8">
              <%= note.name %>
@ -134,7 +140,9 @@ defmodule ChiyaWeb.PublicComponents do
            </span>
          </header>

-          <p class="text-theme-base"><%= String.slice(note.content, 0..150) %></p>
+          <p class="text-theme-base">
+            <%= String.slice(note.content, 0..150) %>
+          </p>
        </a>
      <% end %>
    </section>
@ -158,8 +166,10 @@ defmodule ChiyaWeb.PublicComponents do
              <%= pretty_datetime(note.published_at) %>
            </time>
            <.dot />
-            <.tags note={note} />
-            <.dot />
+            <%= if not Enum.empty?(note.tags) do %>
+              <.tags note={note} />
+              <.dot />
+            <% end %>
            <a href={~p"/note/#{note.slug}"} class="text-theme-base/75">Permalink</a>
            <%= if not Enum.empty?(note.images) do %>
              <.dot />
--- a/lib/chiya_web/controllers/page_html/about.html.heex
+++ b/lib/chiya_web/controllers/page_html/about.html.heex
@ -1,21 +1,14 @@
 <section class="max-w-2xl mx-auto">
  <article class="h-card hcard">
-    <section class="p-10 bg-theme-background1 flex gap-3 items-start">
-      <div>
-        <img
-          class="rounded-lg w-28 | u-photo"
-          src={ChiyaWeb.Uploaders.UserImage.url({@user.user_image, @current_user}, :thumb)}
-        />
-      </div>
-      <div>
-        <h1 class="text-3xl font-extrabold leading-10 tracking-tight text-theme-primary | p-name">
-          <%= @user.name %>
-        </h1>
-        <section class="mx-auto mt-8 prose prose-gruvbox | p-note">
-          <%= Markdown.render(@user.bio) |> raw() %>
-        </section>
-      </div>
-    </section>
+    <img
+      class="rounded-lg block text-center w-28 | u-photo"
+      src={ChiyaWeb.Uploaders.UserImage.url({@user.user_image, @current_user}, :thumb)}
+    />
+
+    <.header class="mt-8">
+      <span class="p-name"><%= @user.name %></span>
+      <:subtitle><%= @user.bio %></:subtitle>
+    </.header>

    <%= if @note do %>
      <section class="mx-auto mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
--- a/lib/chiya_web/controllers/page_html/channel.html.heex
+++ b/lib/chiya_web/controllers/page_html/channel.html.heex
@ -1,10 +1,10 @@
 <section class="max-w-2xl mx-auto">
  <.header>
-    <:title><%= @channel.name %></:title>
+    <%= @channel.name %>
    <:subtitle><%= @channel.content %></:subtitle>
  </.header>

  <div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
    <.note_list notes={@channel.notes} layout={@channel.layout} />
  </div>
-</section>
+</section>
--- a/lib/chiya_web/controllers/page_html/home.html.heex
+++ b/lib/chiya_web/controllers/page_html/home.html.heex
@ -1,6 +1,6 @@
 <section class="max-w-2xl mx-auto">
  <.header class_title="text-theme-primary p-name" class_subtitle="p-summary">
-    <:title><%= @settings.title %></:title>
+    <%= @settings.title %>
    <:subtitle><%= @settings.subtitle %></:subtitle>
  </.header>

@ -32,4 +32,4 @@
      <.note_list notes={@channel.notes} layout={@channel.layout} />
    </section>
  <% end %>
-</section>
+</section>
--- a/lib/chiya_web/controllers/page_html/note.html.heex
+++ b/lib/chiya_web/controllers/page_html/note.html.heex
@ -1,6 +1,6 @@
 <article class="h-entry hentry">
  <.header class="max-w-2xl mx-auto" class_title="p-name">
-    <:title><%= @note.name %></:title>
+    <%= @note.name %>
  </.header>

  <section class="mt-8 mx-auto prose prose-gruvbox md:prose-lg lg:prose-xl  | p-summary e-content">
@ -55,4 +55,3 @@
    <% end %>
  </section>
 </article>
-
--- a/lib/chiya_web/controllers/page_html/tag.html.heex
+++ b/lib/chiya_web/controllers/page_html/tag.html.heex
@ -1,10 +1,10 @@
 <section class="max-w-2xl mx-auto">
  <.header>
-    <:title>Tagged with &ldquo;<%= @tag.name %>&rdquo;</:title>
+    Tagged with &ldquo;<%= @tag.name %>&rdquo;
    <:subtitle><%= @tag.content %></:subtitle>
  </.header>

  <div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
    <.note_list notes={@tag.notes} />
  </div>
-</section>
+</section>
--- a/lib/chiya_web/controllers/page_html/wiki.html.heex
+++ b/lib/chiya_web/controllers/page_html/wiki.html.heex
@ -1,25 +1,35 @@
-<section class="mx-auto max-w-2xl">
-  <.header>
-    <:title><%= @channel.name %></:title>
-  </.header>
-
-  <section class="prose prose-gruvbox mt-6">
-    <%= Markdown.render(@channel.content) |> raw %>
-  </section>
-</section>
-
 <%= if @channel do %>
-<section class="flex flex-col md:flex-row gap-3 mt-6 w-full px-3">
-  <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
-    <h2 class="text-xl text-theme-base">Recently Updated</h2>
+  <section class="mx-auto max-w-2xl">
+    <.header>
+      <%= @channel.name %>
+    </.header>

-    <.note_list notes={@notes_updated} layout={@channel.layout} />
-  </div>
+    <section class="prose prose-gruvbox mt-6">
+      <%= Markdown.render(@channel.content) |> raw %>
+    </section>
+  </section>

-  <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
-    <h2 class="text-xl text-theme-base">Recently Published</h2>
+  <section class="flex flex-col md:flex-row gap-3 mt-6 w-full sm:px-3">
+    <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
+      <h2 class="text-xl text-theme-base">Recently Updated</h2>

-    <.note_list notes={@notes_published} layout={@channel.layout} />
-  </div>
-</section>
-<% end %>
+      <.note_list notes={@notes_updated} layout={@channel.layout} />
+    </div>
+
+    <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
+      <h2 class="text-xl text-theme-base">Recently Published</h2>
+
+      <.note_list notes={@notes_published} layout={@channel.layout} />
+    </div>
+  </section>
+<% else %>
+  <section class="mx-auto max-w-2xl">
+    <.header>
+      Wiki
+    </.header>
+
+    <section class="prose prose-gruvbox mt-6">
+      Wiki is not set up.
+    </section>
+  </section>
+<% end %>
--- a/test/chiya_web/controllers/error_html_test.exs
+++ b/test/chiya_web/controllers/error_html_test.exs
@ -5,10 +5,10 @@ defmodule ChiyaWeb.ErrorHTMLTest do
  import Phoenix.Template

  test "renders 404.html" do
-    assert render_to_string(ChiyaWeb.ErrorHTML, "404", "html", []) == "Not Found"
+    assert render_to_string(ChiyaWeb.ErrorHTML, "404", "html", []) =~ "Not Found"
  end

  test "renders 500.html" do
-    assert render_to_string(ChiyaWeb.ErrorHTML, "500", "html", []) == "Internal Server Error"
+    assert render_to_string(ChiyaWeb.ErrorHTML, "500", "html", []) =~ "Internal Server Error"
  end
 end