feat: support for the new slack ui (#425)

- update selector for team menu to work with new and old slack ui
- bump slack recipe to v1.6.0

2 files changed, 15 insertions, 4 deletions

diff --git a/recipes/slack/package.json b/recipes/slack/package.json
index 99e3559..15138e6 100644
--- a/recipes/slack/package.json
+++ b/recipes/slack/package.json
@@ -1,7 +1,7 @@
 {
   "id": "slack",
   "name": "Slack",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "license": "MIT",
   "config": {
     "serviceURL": "https://{teamId}.slack.com",
diff --git a/recipes/slack/webview.js b/recipes/slack/webview.js
index bd28ba9..f6b5af3 100644
--- a/recipes/slack/webview.js
+++ b/recipes/slack/webview.js
@@ -38,12 +38,23 @@ module.exports = Ferdium => {
   const getTeamIcon = function getTeamIcon(count = 0) {
     let countTeamIconCheck = count;
     let bgUrl = null;
-    const teamMenu = document.querySelector(
+    // INFO: A new Slack UI was introduced in August 2023 and will be rolled out gradually,
+    // therefore we need to support both old and new UI for the time being
+    // See more: https://slack.com/blog/productivity/a-redesigned-slack-built-for-focus
+    const oldSlackUiTeamMenu = document.querySelector(
       '#team-menu-trigger, .p-ia__sidebar_header__team_name',
     );
+    const newSlackUiTeamMenu = document.querySelector(
+      '.p-ia4_home_header_menu__button',
+    );
+
+    if (oldSlackUiTeamMenu || newSlackUiTeamMenu) {
+      if (oldSlackUiTeamMenu) {
+        oldSlackUiTeamMenu.click();
+      } else if (newSlackUiTeamMenu) {
+        newSlackUiTeamMenu.click();
+      }
 
-    if (teamMenu) {
-      teamMenu.click();
       const icon = document.querySelector('.c-team_icon');
 
       if (icon) {