tracked content table

apps/api/urls.py

@@ -12,7 +12,9 @@ from .views import (
     Subscription_DetailView,
     Subscription_SubChannelView,
     SavedGuild_ListView,
-    SavedGuild_DetailView
+    SavedGuild_DetailView,
+    TrackedContent_DetailView,
+    TrackedContent_ListView
 )
 
 urlpatterns = [
@@ -41,4 +43,9 @@ urlpatterns = [
         path("", SavedGuild_ListView.as_view(), name="saved-guilds"),
         path("<int:pk>/", SavedGuild_DetailView.as_view(), name="saved-guilds-detail")
     ])),
+
+    path("tracked-content/", include([
+        path("", TrackedContent_ListView.as_view(), name="tracked-content"),
+        path("<str:pk>/", TrackedContent_DetailView.as_view(), name="tracked-content-detail")
+    ])),
 ]

apps/api/views.py

@@ -421,5 +421,5 @@ class TrackedContent_DetailView(generics.RetrieveUpdateDestroyAPIView):
     parser_classes = [MultiPartParser, FormParser]
 
     serializer_class = TrackedContentSerializer
-    queryset = TrackedContent.objects.all().order_by("id")
+    queryset = TrackedContent.objects.all().order_by("guid")
     

apps/static/js/home/content.js

@@ -0,0 +1,47 @@
+var contentTable;
+
+function initContentTable() {
+    contentTable = $("#contentTable").DataTable({
+        info: false,
+        paging: false,
+        searching: false,
+        autoWidth: false,
+        order: [],
+        select: {
+            style: "multi+shift",
+            selector: 'th:first-child input[type="checkbox"]'
+        },
+        columnDefs: [
+            { orderable: false, targets: "no-sort" },
+            {
+                targets: 0,
+                checkboxes: { selectRow: true }
+            }
+        ],
+        columns: [
+            {
+                // Select row checkbox column
+                title: '<input type="checkbox" class="form-check-input table-select-all" />',
+                data: null,
+                orderable: false,
+                className: "text-center col-1",
+                render: function() {
+                    return '<input type="checkbox" class="form-check-input table-select-row" />'
+                }
+            },
+            { title: "GUID", data: "guid", visible: false },
+            {
+                title: "Name",
+                data: "title",
+                render: function(data, type, row) {
+                    return `<a href="#" onclick="showEditFilterModal(${row.id})" class="text-decoration-none">${data}</a>`
+                }
+            },
+            {
+                title: "Created", data: "creation_datetime"
+            },
+        ]
+    });
+}
+
+async function loadContent(guildId) {}

apps/static/js/home/filters.js

@@ -1,6 +1,6 @@
 var filtersTable;
 
-// Create subscription table
+// Create filters table
 function initFiltersTable() {
     filtersTable = $("#filtersTable").DataTable({
         info: false,

apps/static/js/home/index.js

@@ -1,6 +1,7 @@
 $(document).ready(async function() {
     initSubscriptionTable();
     initFiltersTable();
+    initContentTable();
 
     $("#subscriptionsTab").click();