Support new Github UI (#134)

homerchen19 · Nov 23, 2022 · 889086a · 889086a
1 parent be88cc5
commit 889086a
Showing 1 changed file with 40 additions and 20 deletions.
diff --git a/src/ts/content.ts b/src/ts/content.ts
@@ -165,6 +165,24 @@ const update = () => {
   }
 };
 
+const replaceGithubFileIcons = (
+  triggerSelector: string,
+  fileSelector: string,
+  iconSelector = '.octicon-file'
+) => {
+  observe(triggerSelector, {
+    add(element) {
+      const filenameDom = select(fileSelector, element);
+      if (filenameDom) {
+        const iconDom = select(iconSelector, element);
+        if (iconDom) {
+          replaceIcon({ iconDom, filenameDom });
+        }
+      }
+    },
+  });
+};
+
 const init = async () => {
   loadFonts();
 
@@ -175,26 +193,28 @@ const init = async () => {
       document.querySelector('html')?.getAttribute('data-color-mode') ===
       'dark';
 
-    const observeSelector = isGithubFilesPage()
-      ? 'ul.ActionList > li[id^=file-tree-item-diff-][role=treeitem]'
-      : '.js-navigation-container > .js-navigation-item';
-    observe(observeSelector, {
-      add(element) {
-        const fileSelector = isGithubFilesPage()
-          ? 'li[id^=file-tree-item-diff-][role=treeitem] > a > span:nth-child(2)'
-          : 'div[role="rowheader"] > span';
-        const filenameDom = select(fileSelector, element);
-
-        if (!filenameDom) {
-          return;
-        }
-
-        replaceIcon({
-          iconDom: select('.octicon-file', element) as HTMLElement,
-          filenameDom,
-        });
-      },
-    });
+    if (isGithubFilesPage()) {
+      replaceGithubFileIcons(
+        'ul.ActionList > li[id^=file-tree-item-diff-][role=treeitem]',
+        'a > span:nth-child(2)'
+      );
+    } else {
+      replaceGithubFileIcons(
+        '.js-navigation-container > .js-navigation-item',
+        'div[role="rowheader"] > span'
+      );
+
+      replaceGithubFileIcons(
+        'ul.ActionList > li.ActionList-item:not(.ActionList-item--hasSubitem)[role=treeitem]',
+        'a > span:nth-child(2)'
+      );
+
+      replaceGithubFileIcons(
+        '.react-directory-filename-column',
+        '.react-directory-truncate',
+        'svg:not(.icon-directory)'
+      );
+    }
   } else {
     update();
     document.addEventListener('pjax:end', update);