Update categories page (#1749)

frontend/src/components/SiteNav/SiteNavMenu.jsx

@@ -121,7 +121,7 @@ function SiteNavMenu({ isAnonymous, close, dropdown, overlay }) {
               )}
               style={{ "--label-color": category.color }}
             >
-              {category.shortName || category.name}
+              {category.short_name || category.name}
             </span>
           </a>
         </DropdownMenuItem>

frontend/src/style/flavor/categories-lists.less

@@ -4,32 +4,37 @@
 
 // Make category read status icon visually larger
 .category-main .media-left {
+  padding-right: 0;
+
   .read-status {
-    background: @category-read-color;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    height: 36px;
+    width: 36px;
+    margin-top: 2px;
+
+    background: @category-read-bg;
     border-radius: @border-radius-base;
-    padding: @padding-small-vertical (@padding-large-vertical - 2px);
   }
 
   .material-icon {
-    height: 14px;
-    width: 14px;
+    height: 28px;
+    width: 28px;
 
-    color: @gray;
-    font-size: 14px;
-    line-height: 14px;
+    color: @category-read-color;
+    font-size: 28px;
+    line-height: 28px;
   }
 
   .read-status.item-new {
-    background-color: @category-new-color;
+    background: @category-new-bg;
 
     .material-icon {
-      color: #fff;
+      color: @category-new-color;
     }
   }
-
-  @media screen and (min-width: @screen-sm-min) {
-    padding: @padding-small-vertical 0px;
-  }
 }
 
 // Fix category main alignment
@@ -80,12 +85,22 @@
   }
 }
 
+// Align last poster avatar with media content
+.category-last-thread .last-poster-avatar {
+  margin-top: 2px;
+}
+
 // Round last poster's up avatar
 .category-last-thread img {
   background-color: #fff;
   border-radius: @border-radius-base;
 }
 
+// Style last poster icon
+.category-last-thread .last-poster-icon {
+  color: @category-read-color;
+}
+
 // Last thread
 .category-last-thread .media-heading {
   margin-bottom: 2px;
@@ -130,10 +145,6 @@
 .category-thread-message {
   color: @gray-light;
 
-  .material-icon {
-    margin-right: @padding-base-vertical / 2;
-  }
-
   @media screen and (max-width: @screen-xs-max) {
     padding-top: @line-height-computed * 0.75;
 

frontend/src/style/flavor/variables.less

@@ -304,13 +304,6 @@
 
 @user-card-bg: #f4f5f7;
 
-//== Categories list
-//
-//##
-
-@category-read-color: @gray-lighter;
-@category-new-color: @brand-primary;
-
 //== Threads list
 //
 //##

frontend/src/style/misago/categories-lists.less

@@ -36,6 +36,16 @@
   }
 }
 
+.category-last-thread .last-poster-avatar {
+  display: block;
+}
+
+.category-last-thread .thread-title-muted {
+  color: @gray-light;
+  font-style: italic;
+  font-weight: normal;
+}
+
 // Last thread message
 .category-thread-message {
   display: flex;
@@ -47,6 +57,16 @@
     display: block;
   }
 
+  // Make icon equal in sizing with avatar
+  .last-poster-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    width: 36px;
+    height: 36px;
+  }
+
   .material-icon {
     width: 28px;
     height: 28px;

frontend/src/style/misago/variables.less

@@ -195,8 +195,13 @@
 
 //== Categories status
 //
-@category-read-color: @gray-light;
-@category-new-color: @brand-success;
+//##
+
+@category-read-bg: transparent;
+@category-read-color: #dfe1e6;
+
+@category-new-bg: transparent;
+@category-new-color: @brand-primary;
 
 //== Category label colors
 //

misago/admin/categories/forms.py

@@ -91,7 +91,7 @@ class CategoryForm(forms.ModelForm):
             "Controls if users can start new polls in this category.",
         ),
     )
-    allow_list_access = YesNoSwitch(
+    delay_browse_check = YesNoSwitch(
         label=pgettext_lazy(
             "admin category form",
             'Allow users without the "browse contents" permission to access the threads list',
@@ -170,7 +170,7 @@ class Meta:
             "description",
             "css_class",
             "allow_polls",
-            "allow_list_access",
+            "delay_browse_check",
             "limit_threads_visibility",
             "is_closed",
             "require_threads_approval",

misago/admin/categories/views.py

@@ -6,12 +6,11 @@
 from ...admin.views import generic
 from ...cache.enums import CacheName
 from ...cache.versions import invalidate_cache
-from ...categories import THREADS_ROOT_NAME
+from ...categories.enums import CategoryTree
 from ...categories.models import Category, RoleCategoryACL
 from ...permissions.admin import get_admin_category_permissions
 from ...permissions.copy import copy_category_permissions
 from ...permissions.models import CategoryGroupPermission
-from ...threads.threadtypes import trees_map
 from ...users.models import Group
 from .forms import CategoryForm, DeleteCategoryForm
 
@@ -27,10 +26,8 @@ class CategoryAdmin(generic.AdminBaseMixin):
     def get_target(self, request, kwargs):
         target = super().get_target(request, kwargs)
 
-        threads_tree_id = trees_map.get_tree_id_for_root(THREADS_ROOT_NAME)
-
         target_is_special = bool(target.special_role)
-        target_not_in_categories_tree = target.tree_id != threads_tree_id
+        target_not_in_categories_tree = target.tree_id != CategoryTree.THREADS
 
         if target.pk and (target_is_special or target_not_in_categories_tree):
             raise Category.DoesNotExist()
@@ -70,13 +67,10 @@ def handle_form(self, form, request, target):
                     form.cleaned_data["new_parent"], position="last-child"
                 )
             form.instance.save()
-            if form.instance.parent_id != form.cleaned_data["new_parent"].pk:
-                Category.objects.clear_cache()
         else:
             form.instance.insert_at(
                 form.cleaned_data["new_parent"], position="last-child", save=True
             )
-            Category.objects.clear_cache()
 
         if form.cleaned_data.get("copy_permissions"):
             form.instance.category_role_set.all().delete()
@@ -100,7 +94,10 @@ def handle_form(self, form, request, target):
             )
 
         clear_acl_cache()
-        invalidate_cache(CacheName.PERMISSIONS)
+        invalidate_cache(
+            CacheName.CATEGORIES,
+            CacheName.PERMISSIONS,
+        )
 
         messages.success(request, self.message_submit % {"name": target.name})
 
@@ -209,7 +206,7 @@ def button_action(self, request, target):
 
         if other_target:
             Category.objects.move_node(target, other_target, "right")
-            Category.objects.clear_cache()
+            invalidate_cache(CacheName.CATEGORIES)
 
             message = pgettext_lazy(
                 "admin categories",
@@ -228,7 +225,7 @@ def button_action(self, request, target):
 
         if other_target:
             Category.objects.move_node(target, other_target, "left")
-            Category.objects.clear_cache()
+            invalidate_cache(CacheName.CATEGORIES)
 
             message = pgettext_lazy(
                 "admin categories",

misago/admin/templates/misago/admin/categories/form.html

@@ -68,7 +68,7 @@
 
     {% form_row form.copy_permissions %}
     {% form_row form.allow_polls %}
-    {% form_row form.allow_list_access %}
+    {% form_row form.delay_browse_check %}
     {% form_row form.limit_threads_visibility %}
     {% form_row form.is_closed %}
 

misago/cache/enums.py

@@ -2,6 +2,7 @@
 
 
 class CacheName(StrEnum):
+    CATEGORIES = "categories"
     GROUPS = "groups"
     MODERATORS = "moderators"
     PERMISSIONS = "permissions"

misago/cache/migrations/0003_categories.py

@@ -0,0 +1,16 @@
+# Generated by Django 4.2.10 on 2024-06-17 17:06
+
+from django.db import migrations
+
+from ..enums import CacheName
+from ..operations import StartCacheVersioning
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("misago_cache", "0002_new_permissions"),
+    ]
+
+    operations = [
+        StartCacheVersioning(CacheName.CATEGORIES),
+    ]

misago/cache/versions.py

@@ -2,18 +2,18 @@
 from .utils import generate_version_string
 
 
-def get_cache_versions():
+def get_cache_versions() -> dict[str, str]:
     queryset = CacheVersion.objects.all()
     return {i.cache: i.version for i in queryset}
 
 
-def invalidate_cache(*cache_name: str):
+def invalidate_cache(*cache_name: str) -> None:
     CacheVersion.objects.filter(cache__in=cache_name).update(
         version=generate_version_string()
     )
 
 
-def invalidate_all_caches():
+def invalidate_all_caches() -> None:
     for cache_name in get_cache_versions().keys():
         CacheVersion.objects.filter(cache=cache_name).update(
             version=generate_version_string()