feat: support telegram count for both webk and webz (#751)

7 files changed, 58 insertions, 234 deletions

diff --git a/recipes/telegram-react/icon.svg b/recipes/telegram-react/icon.svg
deleted file mode 100644
index f8c7fe3..0000000
--- a/recipes/telegram-react/icon.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg height="80" width="80" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="a" d="M39.982.036C17.901.036 0 17.936 0 40.018S17.9 80 39.982 80s39.982-17.9 39.982-39.982S62.064.036 39.982.036z"/><mask id="b" fill="#fff"><use fill-rule="evenodd" xlink:href="#a"/></mask></defs><g fill="none" fill-rule="evenodd"><use fill="#08c" xlink:href="#a"/><g mask="url(#b)"><path d="M59.437 23.035 52.296 59.04s-.999 2.497-3.746 1.298L32.071 47.704l-5.992-2.896-10.088-3.396s-1.548-.55-1.698-1.748c-.15-1.198 1.748-1.848 1.748-1.848l40.1-15.73s3.296-1.448 3.296.949" fill="#fefefe"/><path d="M30.804 58.636s-.48-.045-1.08-1.943c-.6-1.898-3.645-11.885-3.645-11.885l24.22-15.381s1.397-.849 1.348 0c0 0 .25.15-.5.849-.749.7-19.026 17.128-19.026 17.128" fill="#d3e5f1"/><path d="m38.39 52.548-6.519 5.943s-.51.387-1.067.145l1.248-11.04" fill="#b6d0e4"/></g></g></svg>
\ No newline at end of file
diff --git a/recipes/telegram-react/index.js b/recipes/telegram-react/index.js
deleted file mode 100644
index 23607bd..0000000
--- a/recipes/telegram-react/index.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = Ferdi => Ferdi;
diff --git a/recipes/telegram-react/package.json b/recipes/telegram-react/package.json
deleted file mode 100644
index 11ae14f..0000000
--- a/recipes/telegram-react/package.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "id": "telegram-react",
-  "name": "Telegram React",
-  "version": "1.2.2",
-  "license": "MIT",
-  "config": {
-    "serviceURL": "https://webk.telegram.org",
-    "hasNotificationSound": true
-  }
-}
diff --git a/recipes/telegram-react/webview.js b/recipes/telegram-react/webview.js
deleted file mode 100644
index c17b200..0000000
--- a/recipes/telegram-react/webview.js
+++ /dev/null
@@ -1,21 +0,0 @@
-module.exports = Ferdi => {
-  const getMessages = () => {
-    let count = 0;
-    const elements = document.querySelectorAll('.chatlist > li:not(.is-muted)');
-    if (elements) {
-      for (const element of elements) {
-        if (
-          element.querySelector('.unread') &&
-          element.querySelector('.unread').textContent !== 0
-        ) {
-          count += Ferdi.safeParseInt(
-            element.querySelector('.unread').textContent,
-          );
-        }
-      }
-    }
-    Ferdi.setBadge(count);
-  };
-
-  Ferdi.loop(getMessages);
-};
diff --git a/recipes/telegram/darkmode.css b/recipes/telegram/darkmode.css
deleted file mode 100644
index 24f415f..0000000
--- a/recipes/telegram/darkmode.css
+++ /dev/null
@@ -1,190 +0,0 @@
-/* Copied from: https://github.com/ducfilan/Dark-mode-Franz-Ferdi */
-
-body,
-.modal-content {
-    color: #bbb !important;
-    background: rgb(40, 44, 52) !important;
-}
-
-a.tg_checkbox {
-    color: #bbb !important;
-}
-
-.im_page_wrap {
-    /*background color of contentwrapper under header*/
-    background-color: rgb(40, 44, 52) !important;
-    border-left: 1px solid rgb(40, 44, 52) !important;
-    border-right: 1px solid rgb(40, 44, 52) !important;
-    border-bottom: 1px solid rgb(40, 44, 52) !important;
-    box-shadow: none;
-}
-
-.im_message_body,
-.im_attach,
-.im_media_attach,
-.im_record,
-.im_record_bg,
-.im_record:hover,
-.im_message_document_thumbed,
-.composer_emoji_panel a.composer_emoji_btn {
-    background: inherit !important;
-}
-
-.im_dialog_peer {
-    /*peer nickname unselected*/
-    color: #bbb !important;
-}
-
-.contacts_modal_members_list a.contacts_modal_contact {
-    /*nicknames in contactlist via hamburger menu*/
-    color: #bbb;
-}
-
-.active a.im_dialog {
-    /*selected peer */
-    background-color: rgb(40, 44, 52) !important;
-}
-
-.tg_head_split,
-.md_modal_head {
-    /*page header block*/
-    background-color: rgb(40, 44, 52) !important;
-}
-
-.dropdown.open .tg_head_btn,
-.tg_head_btn:hover {
-    background: rgb(40, 44, 52) !important;
-}
-
-.form-control {
-    /*input field*/
-    background-color: #0e0e0e !important;
-    color: #bbb !important;
-}
-
-.composer_rich_textarea {
-    background: rgb(40, 44, 52) !important;
-    border-color: #bbb !important;
-}
-
-.im_dialogs_col_wrap {
-    /*contactlist right border*/
-    border-right: 2px solid rgb(40, 44, 52);
-}
-
-.im_dialogs_col .nano>.nano-pane>.nano-slider {
-    /*scrollbarbutton when hover*/
-    background-color: rgb(40, 44, 52) !important;
-}
-
-code,
-pre {
-    background-color: #bbb !important;
-    color: #0e0e0e;
-    border: none !important;
-}
-
-.tg_head_split {
-    background-color: #151515;
-}
-
-.im_submit {
-    color: rgb(40, 44, 52);
-}
-
-.im_message_mymention {
-    background: #1d1d1d;
-}
-
-.im_message_focus .im_message_outer_wrap {
-    background-color: rgb(40, 44, 52);
-}
-
-.im_message_selected .im_message_outer_wrap {
-    background: rgb(40, 44, 52);
-}
-
-a:hover {
-    background-color: #282828 !important;
-}
-
-.im_message_unread_split {
-    background: rgb(40, 44, 52);
-}
-
-@ keyframes im_message_focus_fade {
-    0% {
-        /*soft transaction*/
-
-        background-color: #2d2d2d;
-    }
-}
-
-.btn-primary {
-    background-color: rgb(40, 44, 52);
-}
-
-.im_history_select_active .im_message_outer_wrap:hover {
-    background: rgb(40, 44, 52);
-}
-
-.im_dialog_chat_from_wrap,
-.im_dialog_message_service {
-    color: #6ac;
-}
-
-.composer_rich_textarea,
-.composer_textarea {
-    box-shadow: 0px 3px 1px #ddd;
-}
-
-.composer_rich_textarea:focus {
-    box-shadow: 0px 3px 1px #ddd !important;
-}
-
-.tg_head_logo_dropdown .dropdown-menu>li>a,
-a.tg_radio {
-    color: #ddd;
-}
-
-.btn-primary.disabled,
-.btn-primary[disabled] {
-    background: rgb(40, 44, 52) none repeat scroll 0% 0%;
-}
-
-/*emoji*/
-
-.composer_emoji_tooltip,
-.icon-tooltip-tail,
-.dropdown-menu {
-    background-color: rgb(40, 44, 52) !important;
-    border-color: #5d5d5d;
-}
-
-.im_dialog_badge.badge {
-    background-color: #bfbfbf30 !important;
-}
-
-.im_message_selected .im_message_outer_wrap,
-.im_history_select_active .im_message_outer_wrap:hover {
-    background-color: rgb(40, 44, 52) !important;
-}
-
-.reply_markup_button {
-    color: #FFFFFF !important;
-    background-color: #666666 !important;
-}
-
-.reply_markup_button:focus,
-.reply_markup_button:hover {
-    color: #FFFFFF !important;
-    background-color: rgb(40, 44, 52) !important;
-}
-
-.tg_head_logo_dropdown .dropdown-menu>li>a,
-.dropdown-menu>li>a,
-.dropdown-menu>li>a,
-.dropdown-menu>li>a:focus,
-.dropdown-menu>li>a:hover {
-    color: #FFFFFF !important;
-}
diff --git a/recipes/telegram/package.json b/recipes/telegram/package.json
index beda3c3..e537a9c 100644
--- a/recipes/telegram/package.json
+++ b/recipes/telegram/package.json
@@ -1,7 +1,7 @@
 {
   "id": "telegram",
   "name": "Telegram",
-  "version": "3.2.3",
+  "version": "3.2.4",
   "license": "MIT",
   "config": {
     "serviceURL": "https://web.telegram.org",
diff --git a/recipes/telegram/webview.js b/recipes/telegram/webview.js
index 7d2c8e3..d63282e 100644
--- a/recipes/telegram/webview.js
+++ b/recipes/telegram/webview.js
@@ -1,5 +1,3 @@
-// Code copied from: https://gitlab.com/gortega4/ferdi_recipes
-
 const _path = _interopRequireDefault(require('path'));
 
 function _interopRequireDefault(obj) {
@@ -7,27 +5,76 @@ function _interopRequireDefault(obj) {
 }
 
 module.exports = Ferdi => {
-  const getMessages = () => {
-    let direct = 0;
-    let indirect = 0;
-    const elements = document.querySelectorAll('.rp');
+  const telegramVersion = document
+    .querySelector('meta[name="application-name"]')
+    ?.getAttribute('content');
+
+  const isWebZ = telegramVersion?.includes('WebZ');
+  const isWebK = telegramVersion?.includes('WebK');
+
+  // There are two different Telegram versions for internal competition
+  // Read more: https://bugs.telegram.org/c/4002/public
+  const webZCount = () => {
+    let directCount = 0;
+    let groupCount = 0;
+
+    const directCountSelector = document.querySelectorAll(
+      '.chat-list .ListItem.private .Badge.unread:not(.muted)',
+    );
+    const groupCountSelector = document.querySelectorAll(
+      '.chat-list .ListItem.group .Badge.unread:not(.muted)',
+    );
+
+    for (const badge of directCountSelector) {
+      directCount += Ferdi.safeParseInt(badge.textContent);
+    }
+
+    for (const badge of groupCountSelector) {
+      groupCount += Ferdi.safeParseInt(badge.textContent);
+    }
+
+    Ferdi.setBadge(directCount, groupCount);
+  };
+
+  const webKCount = () => {
+    let directCount = 0;
+    let groupCount = 0;
+
+    const elements = document.querySelectorAll('.rp:not(.is-muted)');
+
     for (const element of elements) {
       const subtitleBadge = element.querySelector('.dialog-subtitle-badge');
+
       if (subtitleBadge) {
         const parsedValue = Ferdi.safeParseInt(subtitleBadge.textContent);
+
         if (element.dataset.peerId > 0) {
-          direct += parsedValue;
+          directCount += parsedValue;
         } else {
-          indirect += parsedValue;
+          groupCount += parsedValue;
         }
       }
     }
 
-    Ferdi.setBadge(direct, indirect);
+    Ferdi.setBadge(directCount, groupCount);
+  };
+
+  const getMessages = () => {
+    if (isWebZ) {
+      webZCount();
+    } else if (isWebK) {
+      webKCount();
+    }
   };
 
   const getActiveDialogTitle = () => {
-    const element = document.querySelector('.top .peer-title');
+    let element;
+
+    if (isWebZ) {
+      element = document.querySelector('.chat-list .ListItem .title > h3');
+    } else if (isWebK) {
+      element = document.querySelector('.top .peer-title');
+    }
 
     Ferdi.setDialogTitle(element ? element.textContent : '');
   };