refactor: Refactor contact info block into a component

- Remove DjangoSnippetsEmailVerificationSentView (no longer needed for overriding)
- Use the contact info component on the Email Verification page as well

Author: Antoliny0919

base/components/components.py

@@ -1,7 +1,7 @@
 from typing import Literal
 
 from django_components import Component, register
-from pydantic import BaseModel
+from pydantic import BaseModel, EmailStr
 
 from base.main import TAB_VAR, ObjectList
 from base.pagination import PAGE_VAR, Pagination
@@ -107,3 +107,25 @@ def get_template_data(self, args, kwargs, slots, context):
             "tabs": self.create_all_tabs(object_list),
             "object_list": object_list,
         }
+
+
+@register("contact_information_button")
+class ContactInformationButton(Component):
+    MAINTAINER_EMAILS = [
+        "antoliny0919@gmail.com",
+        "wedgemail@gmail.com",
+    ]
+    template_file = "contact_information_button.html"
+
+    class Kwargs(BaseModel):
+        button_text: str
+        description: str
+        contact_emails: list[EmailStr] | None = None
+
+    def get_template_data(self, args, kwargs, slots, context):
+        contact_emails = kwargs.contact_emails or self.MAINTAINER_EMAILS
+        return {
+            "button_text": kwargs.button_text,
+            "description": kwargs.description,
+            "contact_emails": contact_emails,
+        }

base/components/contact_information_button.html

@@ -0,0 +1,20 @@
+{% if contact_emails %}
+<div class="flex flex-col justify-center items-center" x-data="{ show: false }">
+    <button
+    class="p-0 m-0 text-base-white border-2 px-4 py-2 rounded-lg font-text"
+    :class="show ? 'bg-base-green-400' : 'bg-base-green-600 hover:bg-base-green-400'"
+    @click="show = !show"
+    :aria-expanded="show"
+    >
+    {{ button_text }}
+    </button>
+    <div x-show="show" class="text-center my-4 text-base" x-transition>
+        <span>{{ description }}</span>
+        <div class="flex justify-center gap-4 mt-2">
+            {% for email in contact_emails %}
+            <a class="underline" href="mailto:{{ email }}">{{ email }}</a>
+            {% endfor %}
+        </div>
+    </div>
+</div>
+{% endif %}

base/views.py

@@ -1,16 +1,18 @@
 {% extends "account/base.html" %}
 
-{% load i18n %}
-{% load account %}
+{% load static widget_tweaks %}
 
-{% block head_title %}{% trans "Password Reset" %}{% endblock %}
+{% block head_title %}Verify Your E-mail Address{% endblock %}
 
-{% block content_header %}{% trans "Password Reset" %}{% endblock %}
+{% block header%}{% endblock %}
 
 {% block content %}
-    {% if user.is_authenticated %}
-    {% include "account/snippets/already_logged_in.html" %}
-    {% endif %}
-
-    <p>{% blocktrans %}We have sent you an e-mail. Please contact us if you do not receive it within a few minutes.{% endblocktrans %}</p>
+<div class="w-[40rem] flex flex-col items-center justify-center mx-auto p-8 font-common shadow-sign-content rounded-lg">
+    <h3>Password Reset</h3>
+    <img src="{% static 'img/verification_sent.png' %}">
+    <p class="my-4 text-xl font-common">We have sent an e-mail to you for verification 🚀</p>
+    <p class="text-center">Follow the link provided to finalize the password reset process. If you do not see the verification email in your main inbox, check your spam folder.</p>
+    {% component 'contact_information_button' button_text="Didn't receive the email ?" description="If you didn't receive the verification email, please contact us at:" / %}
+</div>
 {% endblock %}
+{% block footer %}{% endblock %}

djangosnippets/templates/account/password_reset_done.html

@@ -12,25 +12,7 @@ <h3>Email Verification</h3>
     <img src="{% static 'img/verification_sent.png' %}">
     <p class="my-4 text-xl font-common">We have sent an e-mail to you for verification 🚀</p>
     <p class="text-center">Follow the link provided to finalize the signup process. If you do not see the verification email in your main inbox, check your spam folder.</p>
-    {% if maintainer_emails %}
-    <div class="flex flex-col justify-center items-center" x-data="{ show: false }">
-        <button
-        class="p-0 m-0 text-base-white border-2 px-4 py-2 rounded-lg font-text"
-        :class="show ? 'bg-base-green-400' : 'bg-base-green-600 hover:bg-base-green-400'"
-        @click="show = !show"
-        >
-        Didn't receive the email ?
-        </button>
-        <div x-show="show" class="text-center my-4 text-base" x-transition>
-            <span>If you didn't receive the verification email, please contact us at:</span>
-            <div class="flex justify-center gap-4 mt-2">
-                {% for email in maintainer_emails %}
-                <a class="underline" href="mailto:{{ email }}">{{ email }}</a>
-                {% endfor %}
-            </div>
-        </div>
-    </div>
-    {% endif %}
+    {% component 'contact_information_button' button_text="Didn't receive the email ?" description="If you didn't receive the verification email, please contact us at:" / %}
 </div>
 {% endblock %}
 {% block footer %}{% endblock %}

djangosnippets/templates/account/verification_sent.html

@@ -2,8 +2,6 @@
 from django.shortcuts import render
 from django.urls import include, path
 
-from base.views import DjangoSnippetsEmailVerificationSentView
-
 admin.autodiscover()
 
 
@@ -13,7 +11,6 @@ def trigger_sentry_error(request):
 
 urlpatterns = [
     path("sentry-debug/", trigger_sentry_error),
-    path("accounts/confirm-email/", DjangoSnippetsEmailVerificationSentView.as_view(), name="account_email_verification_sent"),
     path("accounts/", include("allauth.urls")),
     path("manage/", admin.site.urls),
     path("components/", include("django_components.urls")),

djangosnippets/urls.py

@@ -20,7 +20,7 @@ dependencies = [
   "markdown",
   "pillow",
   "psycopg2-binary",
-  "pydantic",
+  "pydantic[email]",
   "pygments",
   "python-akismet",
   "python-dotenv",