BTHLABS-81: OG Properties on Share Association page

Co-authored-by: Tomek Wójcik <labs@tomekwojcik.pl>
Co-committed-by: Tomek Wójcik <labs@tomekwojcik.pl>

services/backend/hotpocket_backend/apps/ui/templates/ui/associations/view.html

@@ -2,10 +2,24 @@
 
 {% load i18n static ui %}
 
-{% block title %}{{ association.title }}{% endblock %}
+{% block title %}{% if association.title %}{{ association.title }}{% else %}{{ association.target.url }}{% endif %}{% endblock %}
 
 {% block button_bar_class %}d-none{% endblock %}
 
+{% block page_head %}
+  {{ block.super}}
+<meta property="og:title" content="{% if association.title %}{{ association.title }}{% else %}{{ association.target.url }}{% endif %}">
+{% if association.description %}
+<meta property="og:description" content="{{ association.description|truncatechars:125 }}">
+{% endif %}
+<meta property="og:image" content="{{ og_card_url }}">
+<meta property="og:image:width" content="1200">
+<meta property="og:image:height" content="630">
+<meta property="og:url" content="{{ share_url }}">
+<meta property="og:type" content="website">
+<meta property="og:site_name" content="{{ SITE_TITLE }}">
+{% endblock %}
+
 {% block page_body %}
   <div id="ViewAssociationView" class="container pb-3">
     <p class="display-3 mt-3 mb-0 text-center">

services/backend/hotpocket_backend/apps/ui/views/associations.py

@@ -8,6 +8,7 @@ from django.contrib import messages
 import django.db
 from django.http import HttpRequest, HttpResponse, JsonResponse
 from django.shortcuts import redirect, render
+from django.templatetags.static import static
 from django.urls import reverse
 from django.utils.translation import gettext_lazy as _
 from django.views.generic import FormView, View
@@ -198,12 +199,18 @@ def view(request: HttpRequest, pk: uuid.UUID) -> HttpResponse:
         if is_share is True:
             show_controls = show_controls and False
 
-    share_url = reverse(
+    share_url = request.build_absolute_uri(
+        reverse(
             'ui.associations.view',
             args=(association.pk,),
             query=[
                 ('share', 'true'),
             ],
+        ),
+    )
+
+    og_card_url = request.build_absolute_uri(
+        static('ui/img/og-card.png'),
     )
 
     return render(
@@ -213,6 +220,12 @@ def view(request: HttpRequest, pk: uuid.UUID) -> HttpResponse:
             'association': association,
             'show_controls': show_controls,
             'share_url': share_url,
+            'is_share': is_share,
+            'og_card_url': (
+                og_card_url
+                if is_share is True
+                else None
+            ),
         },
     )
 

services/backend/tests/ui/views/associations/test_view.py

@@ -28,13 +28,15 @@ def test_authenticated_ok(authenticated_client: Client,
     assert result.context['association'].target.pk == association_out.target.pk
     assert result.context['show_controls'] is True
     assert 'share_url' in result.context
+    assert result.context['is_share'] is False
+    assert result.context['og_card_url'] is None
 
     expected_share_url = reverse(
         'ui.associations.view',
         args=(association_out.pk,),
         query=[('share', 'true')],
     )
-    assert result.context['share_url'] == expected_share_url
+    assert result.context['share_url'].endswith(expected_share_url)
 
 
 @pytest.mark.django_db
@@ -126,6 +128,16 @@ def test_authenticated_share_ok(authenticated_client: Client,
     assert hasattr(result.context['association'], 'target') is True
     assert result.context['association'].target.pk == other_account_association_out.target.pk
     assert result.context['show_controls'] is False
+    assert 'share_url' in result.context
+    assert result.context['is_share'] is True
+    assert result.context['og_card_url'] is not None
+
+    expected_share_url = reverse(
+        'ui.associations.view',
+        args=(other_account_association_out.pk,),
+        query=[('share', 'true')],
+    )
+    assert result.context['share_url'].endswith(expected_share_url)
 
 
 @pytest.mark.django_db