chore: unread back

app/src/react/components/unread.jsx

@@ -0,0 +1,49 @@
+import {useDispatch, useSelector} from 'react-redux';
+
+import {useEffect} from 'react';
+
+import {
+  blurredSelector,
+  setBlurred,
+  unreadChannelSelector,
+  unreadUserSelector,
+} from '@reddichat/user/client';
+
+const Unread = () => {
+  const dispatch = useDispatch();
+  const blurred = useSelector(blurredSelector);
+  const unreadChannel = useSelector(unreadChannelSelector);
+  const unreadUser = useSelector(unreadUserSelector);
+  useEffect(() => {
+    window.addEventListener('blur', () => dispatch(setBlurred(true)));
+    window.addEventListener('focus', () => dispatch(setBlurred(false)));
+  }, [dispatch]);
+  useEffect(() => {
+    if (!blurred) {
+      return undefined;
+    }
+    if (unreadChannel + unreadUser > 0) {
+      const message = [
+        ['chat', unreadChannel],
+        ['pm', unreadUser],
+      ]
+        .filter(([, value]) => value > 0)
+        .map(([key, value]) => `${value} ${key}${value > 1 ? 's' : ''}`)
+        .join(' • ');
+      const previousTitle = window.document.title;
+      const title = `✧~✧ ${message.toUpperCase()} ✧~✧ | ${previousTitle}`;
+      window.document.title = title;
+      const handle = setInterval(() => {
+        window.document.title = window.document.title === title ? previousTitle : title;
+      }, 1000);
+      return () => {
+        window.document.title = previousTitle;
+        clearInterval(handle);
+      };
+    }
+    return undefined;
+  }, [blurred, unreadChannel, unreadUser]);
+  return null;
+};
+
+export default Unread;

app/src/react/index.jsx

@@ -7,6 +7,7 @@ import {Provider} from 'react-redux';
 
 import App from 'components/app';
 import Dispatcher from 'components/dispatcher';
+import Unread from 'components/unread';
 
 import {configureStore} from '@reddichat/state/client';
 
@@ -18,9 +19,9 @@ const Index = async (latus) => {
     <Provider store={store}>
       <ConnectedRouter history={history}>
         <App />
-          {/* <Unread /> */}
       </ConnectedRouter>
       <Dispatcher />
+      <Unread />
     </Provider>
   );
 };