feat(course_page.html): add messages if user not logged in or doesn't have access to course

home/templates/home/course_page.html

@@ -1,6 +1,5 @@
 {% extends "base.html" %}
-{% load static %}
-{% load wagtailcore_tags %}
+{% load static i18n wagtailcore_tags %}
 
 {% block title %}{{ page.title }}{% endblock %}
 
@@ -13,7 +12,34 @@
 {% block content_class %}prose{% endblock content_class %}
 
 {% block content %}
+  <h1 class="not-prose text-3xl mb-4 text-gray-700 font-bold">
+    {{ page.title }}
+  </h1>
 
-    {{ page.body|richtext }}
+  {{ page.body|richtext }}
 
+  {% if user_has_access %}
+    <h2 class="not-prose text-2xl mt-8 mb-4 text-gray-700 font-semibold">{% trans "Modules" %}</h2>
+    <ul class="list-disc list-inside">
+      {% for module in page.get_children.specific %}
+        <li>
+          <a href="{{ module.url }}" class="text-blue-600 hover:underline">{{ module.title }}</a>
+        </li>
+      {% empty %}
+        <li>{% trans "No modules yet." %}</li>
+      {% endfor %}
+    </ul>
+  {% elif not user.is_authenticated %}
+    {# If the user is not authenticated, we can prompt them to log in or sign up. #}
+    <div class="not-prose mt-8 p-4 bg-blue-100 border-l-4 border-blue-500 text-blue-700">
+      <p>{% trans "You need to be logged in to access this course. Please log in or sign up to view the modules." %}</p>
+      <a href="{% url 'account_login' %}" class="mt-4 inline-block bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition">{% trans "Login" %}</a>
+      <a href="{% url 'account_signup' %}" class="mt-4 inline-block bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700 transition">{% trans "Sign Up" %}</a>
+    </div>
+  {% else %}
+    <div class="not-prose mt-8 p-4 bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700">
+      <p>{% trans "You don't have access to this course. Please purchase it to view the modules." %}</p>
+      <a href="" class="mt-4 inline-block bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition">{% trans "Purchase Course" %}</a>
+    </div>
+  {% endif %}
 {% endblock content %}