Login

accounts/forms.py

@@ -1,4 +1,5 @@
 from django import forms
+from django.contrib.auth.forms import AuthenticationForm
 
 
 class CreateAccountForm(forms.Form):
@@ -32,3 +33,26 @@ class CreateAccountForm(forms.Form):
     def clean(self):
         cleaned_data = super().clean()
         return cleaned_data
+
+
+class EmailAuthenticationForm(AuthenticationForm):
+    username = forms.EmailField(
+        label="Email",
+        widget=forms.EmailInput(
+            attrs={
+                "id": "email",
+                "class": "form-control",
+            }
+        ),
+    )
+
+    password = forms.CharField(
+        label="Password",
+        strip=False,
+        widget=forms.PasswordInput(
+            attrs={
+                "id": "password",
+                "class": "form-control",
+            }
+        ),
+    )

accounts/templates/login.html

@@ -0,0 +1,56 @@
+{% extends 'base.html' %}
+{% load static %}
+
+{% block title %}Login - Fables{% endblock %}
+
+{% block content %}
+<h1>Login</h1>
+
+<div class="mt-3">
+    <form method="post" novalidate>
+        {% csrf_token %}
+        <div class="mb-3">
+            <label for="{{ form.username.id_for_label }}" class="form-label">
+                {{ form.username.label }} <span style="color: red">*</span>
+            </label>
+            {{ form.username }}
+            {% if form.username.errors %}
+            <div class="error-messages">
+                {% for error in form.username.errors %}
+                <div class="error text-danger">{{ error }}</div>
+                {% endfor %}
+            </div>
+            {% endif %}
+        </div>
+        <div class="mb-3">
+            <label for="{{ form.password.id_for_label }}" class="form-label">
+                {{ form.password.label }} <span style="color: red">*</span>
+            </label>
+            {{ form.password }}
+            {% if form.password.errors %}
+            <div class="error-messages">
+                {% for error in form.password.errors %}
+                <div class="error text-danger">{{ error }}</div>
+                {% endfor %}
+            </div>
+            {% endif %}
+        </div>
+
+        {% if form.non_field_errors %}
+        <div class="error-messages mb-3">
+            {% for error in form.non_field_errors %}
+            <div class="error text-danger">{{ error }}</div>
+            {% endfor %}
+        </div>
+        {% endif %}
+
+        <div>
+            <button type="submit" id="login-btn" class="btn btn-primary">
+                Login
+            </button>
+        </div>
+    </form>
+    <div class="mt-3"> <a href="{% url 'create_account' %}">Create a new account</a></div>
+
+</div>
+{% endblock %}

accounts/urls.py

@@ -1,10 +1,10 @@
 from django.urls import path
 
-from home import views as home_views
-
 from . import views
+from .views import CustomLoginView, CustomLogoutView
 
 urlpatterns = [
-    path("", home_views.home, name="home"),
     path("create/", views.create_account, name="create_account"),
+    path("login/", CustomLoginView.as_view(), name="login"),
+    path("logout/", CustomLogoutView.as_view(), name="logout"),
 ]

accounts/views.py

@@ -1,9 +1,10 @@
 import logging
 
 from django.contrib import messages
+from django.contrib.auth.views import LoginView, LogoutView
 from django.shortcuts import redirect, render
 
-from .forms import CreateAccountForm
+from .forms import CreateAccountForm, EmailAuthenticationForm
 from .models import Account
 
 logger = logging.getLogger(__name__)
@@ -43,3 +44,13 @@ def create_account(request):
         logger.debug("Rendering create account form (GET request)")
 
     return render(request, "create_account.html", {"form": form})
+
+
+class CustomLoginView(LoginView):
+    template_name = "login.html"
+    authentication_form = EmailAuthenticationForm
+    redirect_authenticated_user = True
+
+
+class CustomLogoutView(LogoutView):
+    next_page = "/"

fables/settings.py

@@ -92,6 +92,9 @@
 
 # User Model
 AUTH_USER_MODEL = "accounts.Account"
+LOGIN_REDIRECT_URL = "/"
+LOGOUT_REDIRECT_URL = "/"
+LOGIN_URL = "/accounts/login"
 
 # Password validation
 # https://docs.djangoproject.com/en/5.2/ref/settings/#auth-password-validators

home/templates/base.html

@@ -15,6 +15,7 @@
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-3">
     <div class="container-fluid">
       <a class="navbar-brand me-5" href="{% url 'home' %}">Fables</a>
+      {% if user.is_authenticated %}
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
         aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
@@ -27,15 +28,32 @@
               aria-current="{% if request.resolver_match.url_name == 'home' %}page{% endif %}"
               href="{% url 'home' %}">Home</a></li>
           <li class="nav-item dropdown"> <a
-              class="nav-link{% if request.resolver_match.url_name == 'campaigns' %} active{% endif %} dropdown-toggle"
-              aria-current="{% if request.resolver_match.url_name == 'campaigns' %}page{% endif %}"
-              href="{% url 'campaigns' %}" role="button" data-bs-toggle="dropdown" aria-expanded="false">Campaigns</a>
+              class="nav-link dropdown-toggle {% if request.resolver_match.url_name == 'campaigns' %} active{% endif %}"
+              id="navbarDropdownMenuLink"
+              aria-current="{% if request.resolver_match.url_name == 'campaigns' %}page{% endif %}" href="#"
+              role="button" data-bs-toggle="dropdown" aria-expanded="false">Campaigns</a>
             <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
               <li><a class="dropdown-item" href="{% url 'create_campaign' %}">Create New Campaign</a></li>
               <li><a class="dropdown-item" href="{% url 'campaigns' %}">View Campaigns</a></li>
             </ul>
           </li>
         </ul>
+        <ul class="navbar-nav ms-auto">
+          <li class="nav-item">
+            <span class="navbar-text text-warning me-3">
+              {{ user.username }}
+            </span>
+          </li>
+          <li class="nav-item">
+            <form method="post" action="{% url 'logout' %}" style="display:inline;">
+              {% csrf_token %}
+              <button type="submit" class="btn btn-link nav-link p-0 border-0 bg-transparent">
+                Logout
+              </button>
+            </form>
+          </li>
+          {% endif %}
+        </ul>
       </div>
     </div>
   </nav>

home/views.py

@@ -1,5 +1,7 @@
+from django.contrib.auth.decorators import login_required
 from django.shortcuts import render
 
 
+@login_required
 def home(request):
     return render(request, "home.html")