From 069859d583aa42b3f77ec3e9ed43ce7c111c267b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D9=83=D8=A7=D8=B1=D9=84=20=D9=85=D8=A8=D8=A7=D8=B1=D9=83?=
 <bonjour@moubarak.eu>
Date: Thu, 21 Oct 2021 13:03:53 +0200
Subject: [PATCH] topics are now correctly alphanumerically sorted with
 browsers localeCompre option "numeric: true"

---
 front/src/store/index.js | 45 +++++++++++++++++++++++++---------------
 1 file changed, 28 insertions(+), 17 deletions(-)

diff --git a/front/src/store/index.js b/front/src/store/index.js
index 13e19b4..be372ae 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -133,21 +133,21 @@ export default createStore({
   strict: process.env.NODE_ENV !== 'production',
 
   state: {
-    isMobile: false,
-    streams: [],
-    currentStream: {},
-    rules: [],
-    topics: [],
-    pubStr: 'pub-',
+    isMobile      : false,
+    streams       : [],
+    currentStream : {},
+    rules         : [],
+    topics        : [],
+    pubStr        : 'pub-',
   },
 
   mutations: {
 
-    setMobile: (state, mobile) => state.isMobile = mobile,
-    setStreams: (state, streams) => state.streams = streams,
-    setCurStream: (state, stream) => state.currentStream = stream,
-    setTopics: (state, topics) => state.topics = topics,
-    addMessage: (state, message) => {
+    setMobile    : (state, mobile)  => state.isMobile = mobile,
+    setStreams   : (state, streams) => state.streams = streams,
+    setCurStream : (state, stream)  => state.currentStream = stream,
+    setTopics    : (state, topics)  => state.topics = topics,
+    addMessage   : (state, message) => {
       if (message.content.startsWith('@_**')) {
         handleMDReply(message)
       } else if (
@@ -253,14 +253,25 @@ export default createStore({
   },
 
   getters: {
+
     rules: state => state.rules,
-    sortedTopics: state => (
+
+    filteredTopics: state => (
       [...state.topics]
-        .sort((a, b) => a.title.localeCompare(b.title))
-        .filter(t => (
-          t.messages.length > 0 &&
-          t.title != 'stream events'
-        ))
+      .filter(t => (
+        t.messages.length > 0 &&
+        t.title != 'stream events'
+      ))
+    ),
+
+    sortedTopics: (state, getters) => (
+      getters.filteredTopics
+      .sort((a,b) => 
+        a.title.localeCompare(b.title, undefined, { 
+          numeric     : true,
+          sensitivity : 'base'
+        })
+      )
     )
   }