Sort dms activily

Signed-off-by: Ajay Bura <ajbura@gmail.com>

src/app/organisms/navigation/Directs.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 
 import initMatrix from '../../../client/initMatrix';
 import cons from '../../../client/state/cons';
@@ -10,8 +10,29 @@ import RoomsCategory from './RoomsCategory';
 
 const drawerPostie = new Postie();
 function Directs() {
+  const mx = initMatrix.matrixClient;
   const { roomList, notifications } = initMatrix;
-  const directIds = [...roomList.directs].sort(roomIdByLastActive);
+  const [directIds, setDirectIds] = useState([]);
+
+  useEffect(() => setDirectIds([...roomList.directs].sort(roomIdByLastActive)), []);
+
+  useEffect(() => {
+    const handleTimeline = (event, room, toStartOfTimeline, removed, data) => {
+      if (!roomList.directs.has(room.roomId)) return;
+      if (!data.liveEvent) return;
+      if (directIds[0] === room.roomId) return;
+      const newDirectIds = [room.roomId];
+      directIds.forEach((id) => {
+        if (id === room.roomId) return;
+        newDirectIds.push(id);
+      });
+      setDirectIds(newDirectIds);
+    };
+    mx.on('Room.timeline', handleTimeline);
+    return () => {
+      mx.removeListener('Room.timeline', handleTimeline);
+    };
+  }, [directIds]);
 
   useEffect(() => {
     const selectorChanged = (selectedRoomId, prevSelectedRoomId) => {