From d38fec65709e099c5202fbda1050d99b77156d97 Mon Sep 17 00:00:00 2001
From: Thomas Sileo <t@a4.io>
Date: Fri, 15 Jul 2022 20:01:55 +0200
Subject: [PATCH] Improve/tweak templates

---
 .gitignore                       |  2 +-
 app/ap_object.py                 | 13 ++++----
 app/main.py                      |  1 +
 app/scss/_theme.scss             |  1 +
 app/scss/main.scss               | 33 ++++++++++++-------
 app/templates/admin_new.html     |  5 +++
 app/templates/followers.html     |  5 +++
 app/templates/following.html     |  5 +++
 app/templates/index.html         |  1 +
 app/templates/lookup.html        |  5 +++
 app/templates/notifications.html |  5 +++
 app/templates/object.html        |  6 ++--
 app/templates/remote_follow.html |  5 +++
 app/templates/utils.html         | 54 ++++++++++++++++----------------
 tasks.py                         |  6 ++--
 15 files changed, 96 insertions(+), 51 deletions(-)
 create mode 120000 app/scss/_theme.scss

diff --git a/.gitignore b/.gitignore
index a655e4e..c040887 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,4 +4,4 @@ __pycache__/
 .pytest_cache/
 docs/dist/
 requirements.txt
-app/scss/vars.scss
+app/scss/_vars.scss
diff --git a/app/ap_object.py b/app/ap_object.py
index df3f698..5e226e5 100644
--- a/app/ap_object.py
+++ b/app/ap_object.py
@@ -1,5 +1,6 @@
 import hashlib
 from datetime import datetime
+from functools import cached_property
 from typing import Any
 
 import pydantic
@@ -26,7 +27,7 @@ class Object:
     def is_from_inbox(self) -> bool:
         return False
 
-    @property
+    @cached_property
     def ap_type(self) -> str:
         return self.ap_object["type"]
 
@@ -42,7 +43,7 @@ class Object:
     def ap_actor_id(self) -> str:
         return ap.get_actor_id(self.ap_object)
 
-    @property
+    @cached_property
     def ap_published_at(self) -> datetime | None:
         # TODO: default to None? or now()?
         if "published" in self.ap_object:
@@ -55,7 +56,7 @@ class Object:
     def actor(self) -> Actor:
         raise NotImplementedError()
 
-    @property
+    @cached_property
     def visibility(self) -> ap.VisibilityEnum:
         return ap.object_visibility(self.ap_object, self.actor)
 
@@ -71,7 +72,7 @@ class Object:
     def tags(self) -> list[ap.RawObject]:
         return ap.as_list(self.ap_object.get("tag", []))
 
-    @property
+    @cached_property
     def attachments(self) -> list["Attachment"]:
         attachments = []
         for obj in ap.as_list(self.ap_object.get("attachment", [])):
@@ -130,7 +131,7 @@ class Object:
 
         return None
 
-    @property
+    @cached_property
     def content(self) -> str | None:
         content = self.ap_object.get("content")
         if not content:
@@ -146,7 +147,7 @@ class Object:
     def summary(self) -> str | None:
         return self.ap_object.get("summary")
 
-    @property
+    @cached_property
     def permalink_id(self) -> str:
         return (
             "permalink-"
diff --git a/app/main.py b/app/main.py
index b3b2fb2..5157ed7 100644
--- a/app/main.py
+++ b/app/main.py
@@ -75,6 +75,7 @@ _RESIZED_CACHE: MutableMapping[tuple[str, int], tuple[bytes, str, Any]] = LFUCac
 #
 # Next:
 # - fix stream (only content from follows + mention, and dedup shares)
+# - custom emoji in data/
 # - handle remove activity
 # - retries httpx?
 # - DB models for webmentions
diff --git a/app/scss/_theme.scss b/app/scss/_theme.scss
new file mode 120000
index 0000000..4036f4c
--- /dev/null
+++ b/app/scss/_theme.scss
@@ -0,0 +1 @@
+../../data/_theme.scss
\ No newline at end of file
diff --git a/app/scss/main.scss b/app/scss/main.scss
index fb2e359..ec2096e 100644
--- a/app/scss/main.scss
+++ b/app/scss/main.scss
@@ -10,7 +10,7 @@ $form-text-color: #333;
 $muted-color: #555; // solarized comment text
 
 // Load custom theme
-// @import "vars.scss";
+// @import "theme.scss";
 
 
 .light-background {
@@ -142,22 +142,31 @@ footer {
     }
 }
 
+@mixin admin-button() {
+    font-size: 20px;
+    line-height: 32px;
+    font-family: $font-stack;
+    background: $form-background-color;
+    color: $form-text-color;
+    border: 1px solid $background;
+    padding: 8px 10px 5px 10px;
+    cursor: pointer;
+    &:hover {
+        border: 1px solid $form-text-color;
+    }
+}
+
+.show-sensitive-btn, .show-more-btn {
+    @include admin-button;
+    margin: 20px 0;
+}
+
 nav {
     form {
         margin: 15px 0;
     }
     input[type=submit], button {
-        font-size: 20px;
-        line-height: 32px;
-        font-family: $font-stack;
-        background: $form-background-color;
-        color: $form-text-color;
-        border: 1px solid $background;
-        padding: 8px 10px 5px 10px;
-        cursor: pointer;
-        &:hover {
-            border: 1px solid $form-text-color;
-        }
+        @include admin-button;
     }
 }
 
diff --git a/app/templates/admin_new.html b/app/templates/admin_new.html
index a3bded1..af0c8b5 100644
--- a/app/templates/admin_new.html
+++ b/app/templates/admin_new.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>{{ local_actor.display_name }} - New</title>
+{% endblock %}
+
 {% block content %}
 
 {% if in_reply_to_object %}
diff --git a/app/templates/followers.html b/app/templates/followers.html
index 7002968..fba76a4 100644
--- a/app/templates/followers.html
+++ b/app/templates/followers.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>{{ local_actor.display_name }}'s followers</title>
+{% endblock %}
+
 {% block content %}
 {% include "header.html" %}
 <div id="followers">
diff --git a/app/templates/following.html b/app/templates/following.html
index d1bdfb9..5ff7831 100644
--- a/app/templates/following.html
+++ b/app/templates/following.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>{{ local_actor.display_name }}'s follows</title>
+{% endblock %}
+
 {% block content %}
 {% include "header.html" %}
 <div id="following">
diff --git a/app/templates/index.html b/app/templates/index.html
index bcbdb31..23e2bc0 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -2,6 +2,7 @@
 {% extends "layout.html" %}
 
 {% block head %}
+<title>{{ local_actor.display_name }}'s microblog</title>
 <link rel="indieauth-metadata" href="{{ url_for("well_known_authorization_server") }}">
 <link rel="authorization_endpoint" href="{{ url_for("indieauth_authorization_endpoint") }}">
 <link rel="token_endpoint" href="{{ url_for("indieauth_token_endpoint") }}">
diff --git a/app/templates/lookup.html b/app/templates/lookup.html
index bd596b2..9526c35 100644
--- a/app/templates/lookup.html
+++ b/app/templates/lookup.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>{{ local_actor.display_name }} - Lookup</title>
+{% endblock %}
+
 {% block content %}
 
     <div class="box">
diff --git a/app/templates/notifications.html b/app/templates/notifications.html
index 7857a30..02ac007 100644
--- a/app/templates/notifications.html
+++ b/app/templates/notifications.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>{{ local_actor.display_name }} - Notifications</title>
+{% endblock %}
+
 {% block content %}
     <div class="box">
     <h2>Notifications</h2>
diff --git a/app/templates/object.html b/app/templates/object.html
index 3ff87ac..64adfa4 100644
--- a/app/templates/object.html
+++ b/app/templates/object.html
@@ -3,14 +3,16 @@
 
 {% block head %}
 {% if outbox_object %}
+{% set excerpt = outbox_object.content | html2text | trim | truncate(50) %}
+<title>{{ local_actor.display_name }}: "{{ excerpt }}"</title>
 <link rel="webmention" href="{{ url_for("webmention_endpoint") }}">
 <link rel="alternate" href="{{ request.url }}" type="application/activity+json">
-<meta name="description" content="{{ outbox_object.content | html2text | trim | truncate(50) }}">
+<meta name="description" content="{{ excerpt }}">
 <meta content="article" property="og:type" />
 <meta content="{{ outbox_object.url }}" property="og:url" />
 <meta content="{{ local_actor.display_name }}'s microblog" property="og:site_name" />
 <meta content="Note" property="og:title" />
-<meta content="{{ outbox_object.content | html2text | trim | truncate(50) }}" property="og:description" />
+<meta content="{{ excerpt }}" property="og:description" />
 <meta content="{{ local_actor.icon_url }}" property="og:image" />
 <meta content="summary" property="twitter:card" />
 {% endif %}
diff --git a/app/templates/remote_follow.html b/app/templates/remote_follow.html
index afcb820..b91c10e 100644
--- a/app/templates/remote_follow.html
+++ b/app/templates/remote_follow.html
@@ -1,5 +1,10 @@
 {%- import "utils.html" as utils with context -%}
 {% extends "layout.html" %}
+
+{% block head %}
+<title>Remote follow {{ local_actor.display_name }}</title>
+{% endblock %}
+
 {% block content %}
 {% include "header.html" %}
 
diff --git a/app/templates/utils.html b/app/templates/utils.html
index b17d855..cd9cd73 100644
--- a/app/templates/utils.html
+++ b/app/templates/utils.html
@@ -2,8 +2,8 @@
 <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
 {% endmacro %}
 
-{% macro embed_redirect_url() %}
-<input type="hidden" name="redirect_url" value="{{ request.url }}">
+{% macro embed_redirect_url(permalink_id=None) %}
+<input type="hidden" name="redirect_url" value="{{ request.url }}{% if permalink_id %}#{{ permalink_id }}{% endif %}">
 {% endmacro %}
 
 {% macro admin_follow_button(actor) %}
@@ -15,46 +15,46 @@
 </form>
 {% endmacro %}
 
-{% macro admin_like_button(ap_object_id) %}
+{% macro admin_like_button(ap_object_id, permalink_id) %}
 <form action="{{ request.url_for("admin_actions_like") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="like">
 </form>
 {% endmacro %}
 
-{% macro admin_bookmark_button(ap_object_id) %}
+{% macro admin_bookmark_button(ap_object_id, permalink_id) %}
 <form action="{{ request.url_for("admin_actions_bookmark") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="bookmark">
 </form>
 {% endmacro %}
 
-{% macro admin_unbookmark_button(ap_object_id) %}
+{% macro admin_unbookmark_button(ap_object_id, permalink_id) %}
 <form action="{{ request.url_for("admin_actions_unbookmark") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="unbookmark">
 </form>
 {% endmacro %}
 
-{% macro admin_pin_button(ap_object_id) %}
+{% macro admin_pin_button(ap_object_id, permalink_id) %}
 <form action="{{ request.url_for("admin_actions_pin") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="pin">
 </form>
 {% endmacro %}
 
-{% macro admin_unpin_button(ap_object_id) %}
+{% macro admin_unpin_button(ap_object_id, permalink_id) %}
 <form action="{{ request.url_for("admin_actions_unpin") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="unpin">
 </form>
@@ -69,41 +69,41 @@
 </form>
 {% endmacro %}
 
-{% macro admin_announce_button(ap_object_id, disabled=False) %}
+{% macro admin_announce_button(ap_object_id, disabled=False, permalink_id=None) %}
 <form action="{{ request.url_for("admin_actions_announce") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="share" {% if disabled %}title="Cannot share non-public content" disabled{% endif %}>
 </form>
 {% endmacro %}
 
-{% macro admin_undo_button(ap_object_id, action="Undo") %}
+{% macro admin_undo_button(ap_object_id, action="undo", permalink_id=None) %}
 <form action="{{ request.url_for("admin_actions_undo") }}" method="POST">
     {{ embed_csrf_token() }}
-    {{ embed_redirect_url() }}
+    {{ embed_redirect_url(permalink_id) }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
     <input type="submit" value="{{ action }}">
 </form>
 {% endmacro %}
 
 {% macro sensitive_button(permalink_id) %}
-<form action=""  method="GET">
+<form action="{{ request.url }}#{{ permalink_id }}"  method="GET">
 <input type="hidden" name="show_sensitive" value="{{ permalink_id }}">
 {% for k, v in request.query_params.items() %}
 <input type="hidden" name="{{k}}" value="{{v}}">
 {% endfor %}
-<button type="submit">display sensitive content</button>
+<button type="submit" class="show-sensitive-btn">display sensitive content</button>
 </form> 
 {% endmacro %}
 
 {% macro show_more_button(permalink_id) %}
-<form action=""  method="GET">
+<form action="{{ request.url }}#{{ permalink_id }}"  method="GET">
 <input type="hidden" name="show_more" value="{{ permalink_id }}">
 {% for k, v in request.query_params.items() %}
 <input type="hidden" name="{{k}}" value="{{v}}">
 {% endfor %}
-<button type="submit">show more</button>
+<button type="submit" class="show-more-btn">show more</button>
 </form> 
 {% endmacro %}
 
@@ -320,9 +320,9 @@
 
             <li>
                 {% if object.is_pinned %}
-                    {{ admin_unpin_button(object.ap_id) }}
+                    {{ admin_unpin_button(object.ap_id, object.permalink_id) }}
                 {% else %}
-                    {{ admin_pin_button(object.ap_id) }}
+                    {{ admin_pin_button(object.ap_id, object.permalink) }}
                 {% endif %}
             </li>
         {% endif %}
@@ -333,17 +333,17 @@
 
         <li>
             {% if object.liked_via_outbox_object_ap_id %}
-                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "unlike") }}
+                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "unlike", object.permalink_id) }}
             {% else %}
-                {{ admin_like_button(object.ap_id) }}
+                {{ admin_like_button(object.ap_id, object.permalink_id) }}
             {% endif %}
         </li>
 
         <li>
             {% if object.is_bookmarked %}
-                {{ admin_unbookmark_button(object.ap_id) }}
+                {{ admin_unbookmark_button(object.ap_id, object.permalink_id) }}
             {% else %}
-                {{ admin_bookmark_button(object.ap_id) }}
+                {{ admin_bookmark_button(object.ap_id, object.permalink_id) }}
             {% endif %}
         </li>
 
@@ -351,7 +351,7 @@
             {% if object.announced_via_outbox_object_ap_id %}
                 {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "unshare") }}
             {% else %}
-                {{ admin_announce_button(object.ap_id, disabled=object.visibility not in [visibility_enum.PUBLIC, visibility_enum.UNLISTED]) }}
+                {{ admin_announce_button(object.ap_id, disabled=object.visibility not in [visibility_enum.PUBLIC, visibility_enum.UNLISTED], permalink_id=object.permalink_id) }}
             {% endif %}
         </li>
 
diff --git a/tasks.py b/tasks.py
index bad9ca7..f96106a 100644
--- a/tasks.py
+++ b/tasks.py
@@ -41,9 +41,9 @@ def lint(ctx):
 @task
 def compile_scss(ctx, watch=False):
     # type: (Context, bool) -> None
-    vars_file = Path("app/scss/vars.scss")
-    if not vars_file.exists():
-        vars_file.write_text("")
+    theme_file = Path("data/_theme.scss")
+    if not theme_file.exists():
+        theme_file.write_text("// override vars for theming here")
 
     if watch:
         run("poetry run boussole watch", echo=True)