feat: add django templates for tagging app UI #4547
Conversation
| class CourseVerticalForm(forms.ModelForm): | ||
| class Meta: | ||
| model = CourseVertical | ||
| fields = ['vertical', 'sub_vertical'] |
There was a problem hiding this comment.
Why is the course field not available in this form? Or is it used for editing purposes only?
| <title>{% block title %}Tagging App{% endblock %}</title> | ||
| <link | ||
| href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" | ||
| rel="stylesheet" |
There was a problem hiding this comment.
Have you verified bootstrap added here is working correctly?
AfaqShuaib09
force-pushed
the
aakbar/PROD-4281
branch
from
91b6f81 to
0968aaf
Compare
Ali-D-Akbar
force-pushed
the
aakbar/PROD-4281
branch
from
9c5f50f to
810c89b
Compare
Ali-D-Akbar
force-pushed
the
aakbar/PROD-4281
branch
from
810c89b to
77319f5
Compare
| <th> | ||
| <a href="?sort=key&direction={% if current_sort == 'key' and current_direction == 'asc' %}desc{% else %}asc{% endif %}"> | ||
| Course Key | ||
| {% if current_sort == 'key' %} | ||
| <span>{% if current_direction == 'asc' %}▲{% else %}▼{% endif %}</span> | ||
| {% endif %} | ||
| </a> | ||
| </th> | ||
| <th> | ||
| <a href="?sort=title&direction={% if current_sort == 'title' and current_direction == 'asc' %}desc{% else %}asc{% endif %}"> | ||
| Course Title | ||
| {% if current_sort == 'title' %} | ||
| <span>{% if current_direction == 'asc' %}▲{% else %}▼{% endif %}</span> | ||
| {% endif %} | ||
| </a> | ||
| </th> | ||
| <th> | ||
| <a href="?sort=vertical&direction={% if current_sort == 'vertical' and current_direction == 'asc' %}desc{% else %}asc{% endif %}"> | ||
| Vertical | ||
| {% if current_sort == 'vertical' %} | ||
| <span>{% if current_direction == 'asc' %}▲{% else %}▼{% endif %}</span> | ||
| {% endif %} | ||
| </a> | ||
| </th> | ||
| <th> | ||
| <a href="?sort=sub_vertical&direction={% if current_sort == 'sub_vertical' and current_direction == 'asc' %}desc{% else %}asc{% endif %}"> | ||
| Sub-Vertical | ||
| {% if current_sort == 'sub_vertical' %} | ||
| <span>{% if current_direction == 'asc' %}▲{% else %}▼{% endif %}</span> | ||
| {% endif %} | ||
| </a> |
There was a problem hiding this comment.
there is a lot of repeated code here. I think you can define a list and loop over it instead of having to write the same thing with only field name changes. Eager to see what others have to say. As an opposing arg, the table headers are "fixed", so the loop/general mechanism might not "give" much.
There was a problem hiding this comment.
I thought the same. Adding loop will make the code look a little hard to understand.
| </td> | ||
| <td> | ||
| {% if course.vertical and course.vertical.sub_vertical %} | ||
| <a href="{% url 'tagging:sub_vertical_detail' slug=course.vertical.sub_vertical.slug %}"> |
There was a problem hiding this comment.
since subvertical is also linked in CourseVertical, you can use course.subvertical.slug instead of getting it from vertical.
There was a problem hiding this comment.
That's the related name for CourseVertical :D
There was a problem hiding this comment.
Maybe update the name to product_vertical?
There was a problem hiding this comment.
Yes, product_vertical or something along these lines would be better.
| <option value="">-- Select Vertical --</option> | ||
| {% for vertical in verticals %} | ||
| <option value="{{ vertical.slug }}" | ||
| {% if course.vertical and course.vertical.vertical.slug == vertical.slug %}selected{% endif %}> |
There was a problem hiding this comment.
course.vertical.vertical?
There was a problem hiding this comment.
| response = self.client.get(self.url) | ||
| self.assertEqual(response.status_code, 200) | ||
| self.assertTemplateUsed(response, 'tagging/course_list.html') | ||
| self.assertIn('courses', response.context) |
There was a problem hiding this comment.
this should also check for course keys or titles
| self.assertNotContains(response, 'Advanced Python') | ||
|
|
||
| def test_sort_courses(self): | ||
| """Tests sorting courses by title in descending order.""" |
There was a problem hiding this comment.
This test can be a ddt to check for both directions.
|
|
||
| def course_detail(request, uuid): | ||
| """ | ||
| Display details of a specific course. |
There was a problem hiding this comment.
It is only meant for tagging, it does not display anything else.
| }) | ||
|
|
||
|
|
||
| def load_sub_verticals(request): |
There was a problem hiding this comment.
Left a comment about this in urls.py.
| page_number = request.GET.get('page') | ||
| page_obj = paginator.get_page(page_number) | ||
|
|
||
| if request.headers.get('HX-Request'): |
There was a problem hiding this comment.
To handle htmx-based request to only update table component inside the course_list.html. If the headers have HX-Request, this means the request is dispatched when the search button is pressed towards hx-get="{% url 'tagging:course_list' %}"
There was a problem hiding this comment.
So when we return HttpResponse(html)
hx-target="#course-table" indicates where this html should be set.
| }) | ||
|
|
||
|
|
||
| def vertical_list(request): |
There was a problem hiding this comment.
nit: the views are typically verbs/actions, so we can rename them like list_Verticals, list_subverticals, etc.
Plus, it would be good to use Django's list or detail view where needed.
| @@ -0,0 +1,159 @@ | |||
| from django.core.paginator import Paginator | |||
There was a problem hiding this comment.
The views are missing authentication and permissions.
Ali-D-Akbar
force-pushed
the
aakbar/PROD-4281
branch
from
77319f5 to
30f3ec1
Compare
PROD-4288
Adds UI the following pages.
Be sure to install requirements and visit http://localhost:18381/tagging/courses/ to test the behaviors locally.