feat(portfolio): add email contact

.gitignore

@@ -10,6 +10,7 @@ devenv.local.yaml
 
 *.sqlite3
 
+.ruff_cache
 *.pyc
 __pycache__/
 local_settings.py

README.md

@@ -0,0 +1,6 @@
+# patrickcanal.it
+
+## Required variables
+### Portfolio
+- MAILER_HOST
+- EMAIL_CONTACT

devenv.lock

@@ -3,11 +3,11 @@
     "devenv": {
       "locked": {
         "dir": "src/modules",
-        "lastModified": 1786975632,
+        "lastModified": 1789304775,
-        "narHash": "sha256-3N/pfn4/ADlkTzHJWgClmKD1mTLyVJNFxLbDMMHl/xw=",
+        "narHash": "sha256-WPuZ7LbqlQ8n+kocw8oo4sNvHy//LXBTAHOqRDp5I5c=",
         "owner": "cachix",
         "repo": "devenv",
-        "rev": "c972cb46d511e690c942e6ee3309a7e8b9a20475",
+        "rev": "e6f5e1e6cda3a75bad3e0a4af97eb9e70bc9e127",
         "type": "github"
       },
       "original": {
@@ -55,11 +55,11 @@
         "nixpkgs": "nixpkgs"
       },
       "locked": {
-        "lastModified": 1784288435,
+        "lastModified": 1788267358,
-        "narHash": "sha256-ReRHaLgr/uVqdD8afFSn+myXIfpHeOhP0yYe0TJqAA8=",
+        "narHash": "sha256-nt+lUqYVpc9Y6JeMd2WmXzCDojasdadKo0mWcluvY2Y=",
         "owner": "cachix",
         "repo": "git-hooks.nix",
-        "rev": "43b3c1ab9d40fb1dbb008f451988a91e375825e9",
+        "rev": "27555e2624241fb116b49095df4caaee85a25691",
         "type": "github"
       },
       "original": {
@@ -70,11 +70,11 @@
     },
     "nixpkgs": {
       "locked": {
-        "lastModified": 1782918843,
+        "lastModified": 1787631388,
-        "narHash": "sha256-ETYnV9U7Sr+A45dohzZdfCZKOss4qrTkO+wgNZNvEc0=",
+        "narHash": "sha256-vMiXptXarfSdJb1Gkc+FYVOAibuBRj7qxGa8z68q1Uw=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "e8273b29fe1390ec8d4603f2477357555291432e",
+        "rev": "ac6b2166e7a9375683b8e98f860f273222337b16",
         "type": "github"
       },
       "original": {
@@ -108,11 +108,11 @@
     "nixpkgs-src": {
       "flake": false,
       "locked": {
-        "lastModified": 1786098110,
+        "lastModified": 1787394516,
-        "narHash": "sha256-shi1tjDhCGGd0kIgVPNY03V8NBWSTzhMSFDb7IqSoec=",
+        "narHash": "sha256-pRGOQSClnXNI2iLUG6DYpsGvYcuw0drOutVZFTJNw90=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "afb4584a80bbf779ce0f691509ff902d188c2b3d",
+        "rev": "c8f90650c15282fa8656a041bfbbd2403997a9a7",
         "type": "github"
       },
       "original": {
@@ -127,11 +127,11 @@
         "nixpkgs-src": "nixpkgs-src"
       },
       "locked": {
-        "lastModified": 1786472144,
+        "lastModified": 1787753358,
-        "narHash": "sha256-W1wLGKZKGtnTWGRFgjbsVQleuO6jgMweaSAbFltLkN0=",
+        "narHash": "sha256-Tl77VbWyAKrOfRNQhL6JbQtb/MLzbYa/1RG1gWWfICk=",
         "owner": "cachix",
         "repo": "devenv-nixpkgs",
-        "rev": "ea21d30f66a051c7cd750692a2af8d56e0ec4bfb",
+        "rev": "256551e45f6303e142ab4a98be1bf243feb77dc0",
         "type": "github"
       },
       "original": {

devenv.nix

@@ -1,5 +1,4 @@
 {
-  pkgs,
   ...
 }:
 
@@ -11,6 +10,5 @@
       enable = true;
       requirements = ./requirements.txt;
     };
-
   };
 }

patrickcanal_it/settings.py

@@ -37,6 +37,7 @@ INSTALLED_APPS = [
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
+    'post_office',
     'portfolio'
 ]
 
@@ -114,6 +115,7 @@ USE_I18N = True
 
 USE_TZ = True
 
+from patrickcanal_it.local_settings import *
 
 # Static files (CSS, JavaScript, Images)
 # https://docs.djangoproject.com/en/6.1/howto/static-files/
@@ -126,9 +128,16 @@ STATICFILES_DIRS = [
 
 # Email
 # https://docs.djangoproject.com/en/6.1/topics/email/#topic-email-configuration
+EMAIL_BACKEND = 'post_office.EmailBackend'
+# TODO: Replace old mail backend with new once post_office supports it 
+# MAILERS = {
+#     'default': {
+#         'BACKEND': 'post_office.EmailBackend',
+#     },
+#     'smtp': {
+#         'BACKEND': 'django.core.mail.backends.smtp.EmailBackend',
+#         'OPTIONS': {'host': MAILER_HOST, 'port': 587},
+#     },
+# }
+# POST_OFFICE = {'DEFAULT_MAILER': 'smtp'}
 
-MAILERS = {
-    'default': {
-        'BACKEND': 'django.core.mail.backends.console.EmailBackend',
-    },
-}

patrickcanal_it/templates/base.html

@@ -11,6 +11,7 @@
         <link rel="stylesheet" href="{% static 'fontawesome-7/css/all.min.css' %}">
         <script src="{% static 'tabler/tabler.min.js' %}"></script>
         <script src="{% static 'tailwindcss/tailwindcss.min.js' %}"></script>
+        <script src="{% static 'htmx/htmx.min.js' %}"></script>
     </head>
     <body class="d-flex flex-column">
         <header class="navbar navbar-expand-md d-print-none">

portfolio/forms.py

@@ -0,0 +1,54 @@
+from django import forms
+from django.utils.translation import gettext as _
+
+
+class TablerEmailInput(forms.EmailInput):
+    def __init__(self, *args, **kwargs):
+        attrs = kwargs.setdefault("attrs", {})
+        attrs.update(
+            {
+                "class": "form-control",
+                "placeholder": "example@mail.com",
+                "autocomplete": "off",
+                "minlength": "4",
+            }
+        )
+        super().__init__(*args, **kwargs)
+
+
+class TablerTextInput(forms.TextInput):
+    def __init__(self, placeholder=None, *args, **kwargs):
+        attrs = kwargs.setdefault("attrs", {})
+        attrs.update(
+            {
+                "class": "form-control",
+                "placeholder": placeholder,
+                "autocomplete": "off",
+                "minlength": "4",
+            }
+        )
+        super().__init__(*args, **kwargs)
+
+
+class TablerTextArea(forms.Textarea):
+    def __init__(self, placeholder=None, *args, **kwargs):
+        attrs = kwargs.setdefault("attrs", {})
+        attrs.update(
+            {
+                "class": "form-control",
+                "placeholder": placeholder,
+                "autocomplete": "off",
+                "minlength": "4",
+            }
+        )
+        super().__init__(*args, **kwargs)
+
+
+class ContactForm(forms.Form):
+    email = forms.EmailField(max_length=50, min_length=4, widget=TablerEmailInput())
+    subject = forms.CharField(
+        max_length=200,
+        min_length=4,
+        widget=TablerTextInput(placeholder=_("Your message")),
+    )
+    message = forms.CharField(max_length=5000, min_length=10, widget=TablerTextArea())

portfolio/templates/contact_thanks.html

@@ -0,0 +1,8 @@
+{% extends "base.html" %}
+{% load i18n static %}
+{% block content %}
+    <div class="container mt-4 fs-2">
+        <div>{% trans "Thanks for contacting me!" %}</div>
+        <a href="{% url 'index' %}" class="btn btn-primary mt-4">{% trans "Go back" %}</a>
+    </div>
+{% endblock %}

portfolio/templates/index.html

@@ -30,7 +30,7 @@
                 </div>
                 <div class="text-center">
                     <a href="{% url 'projects' %}" class="btn btn-primary btn-lg me-2">My projects</a>
-                    <a href="" class="btn btn-outline-secondary btn-lg">Contact me</a>
+                    <a href="#contact-me" class="btn btn-outline-secondary btn-lg">Contact me</a>
                 </div>
             </div>
         </div>
@@ -111,5 +111,35 @@
                 {% endfor %}
             </ul>
         </div>
+        <div class="hr"></div>
+        <div class="row d-flex justify-content-center mb-4">
+            <div class="card col-md-6" id="contact-me">
+                <div class="card-body">
+                    <h3 class="card-title fs-2">
+                        <b>
+                            <i class="fa-solid fa-envelope"></i>
+                            {% trans "Contact me" %}
+                        </b>
+                    </h3>
+                    <form action="{% url 'contact' %}" method="post" id="contact-form">
+                        {% csrf_token %}
+                        {% for field in contact_form %}
+                            <div class="form-floating mb-2">
+                                {{ field }}
+                                <label for="{{ field.id }}">{{ field.label }}</label>
+                            </div>
+                        {% endfor %}
+                        <div class="d-flex justify-content-end">
+                            <button class="btn btn-primary" type="submit">{% trans "Send" %}</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
     </div>
+    <style>
+        textarea {
+            height: 10rem !important;
+        }
+    </style>
 {% endblock %}

portfolio/urls.py

@@ -5,4 +5,5 @@ from portfolio import views
 urlpatterns = [
     path("", views.PortfolioView.as_view(), name="portfolio"),
     path("projects/", views.ProjectList.as_view(), name="projects"),
+    path("contact/", views.ContactSend.as_view(), name="contact"),
 ]

portfolio/views.py

@@ -1,17 +1,43 @@
+from django.conf import settings
+from django.http.response import HttpResponseBadRequest
+from django.utils.translation import gettext as _
 from django.views.generic import ListView, TemplateView
+from post_office import mail
 
-from portfolio import models
+from portfolio import forms, models
 
 
 class PortfolioView(TemplateView):
     template_name = "index.html"
 
     def get_context_data(self, **kwargs):
+        contact_form = forms.ContactForm()
         return {
-            "job_experiences": models.JobExperience.objects.all().order_by("-start")
+            "job_experiences": models.JobExperience.objects.all().order_by("-start"),
+            "contact_form": contact_form,
         }
 
 
 class ProjectList(ListView):
     template_name = "project_list.html"
     model = models.Project
+
+
+class ContactSend(TemplateView):
+    template_name = "contact_thanks.html"
+
+    def post(self, request, *args, **kwargs):
+        form = forms.ContactForm(request.POST)
+
+        if not form.is_valid():
+            return HttpResponseBadRequest(_("Invalid request"))
+
+        mail.send(
+            subject=form.cleaned_data["subject"],
+            message=form.cleaned_data["message"],
+            sender=settings.EMAIL_HOST_USER,
+            cc=form.cleaned_data["email"],
+            recipients=[settings.EMAIL_CONTACT],
+        )
+
+        return super().get(request, *args, **kwargs)

requirements.txt

@@ -1,2 +1,3 @@
 django
 djlint
+django-post_office