Merge pull request #3370 from amitsingh-007/f-improvements

apps/extension/package.json

@@ -40,6 +40,8 @@
   },
   "devDependencies": {
     "@playwright/test": "1.49.1",
+    "@prefresh/core": "1.5.3",
+    "@prefresh/webpack": "4.0.1",
     "@types/archiver": "6.0.3",
     "@types/chrome": "0.0.287",
     "@types/firefox-webext-browser": "120.0.4",
@@ -68,7 +70,6 @@
     "postcss-preset-mantine": "1.17.0",
     "postcss-simple-vars": "7.0.1",
     "react-refresh": "0.16.0",
-    "react-refresh-typescript": "2.0.9",
     "terser-webpack-plugin": "5.3.11",
     "style-loader": "4.0.0",
     "ts-loader": "9.5.1",

apps/extension/src/BackgroundScript/index.ts

@@ -1,16 +1,9 @@
 import { EExtensionState } from '@/constants';
-import Logging from '@/logging';
 import { getIsExtensionActive, setExtStateInStorage } from '@/utils/common';
 import { getExtensionState } from '@helpers/fetchFromStorage';
-import { bypass } from './bypass';
 import turnOffInputSuggestions from './misc/turnOffInputSuggestions';
-import { redirect } from './redirect';
-import {
-  checkForUpdates,
-  isValidTabUrl,
-  isValidUrl,
-  setExtensionIcon,
-} from './utils';
+import { redirect } from './redirections';
+import { isValidTabUrl, isValidUrl, setExtensionIcon } from './utils';
 import { receiveRuntimeMessage } from './utils/receiveRuntimeMessage';
 import { RuntimeInput } from '@/utils/sendRuntimeMessage';
 import hearbeatFirefoxBackgroundPage from './utils/keepAliveSW';
@@ -19,10 +12,6 @@ if (!IS_CHROME) {
   hearbeatFirefoxBackgroundPage();
 }
 
-Logging.init();
-
-const red = '#FF6B6B';
-
 // First time extension install
 chrome.runtime.onInstalled.addListener(() => {
   setExtStateInStorage(EExtensionState.ACTIVE);
@@ -39,15 +28,6 @@ chrome.runtime.onStartup.addListener(() => {
         hasPendingPersons,
       });
     });
-  checkForUpdates().then((isUsingLatest) => {
-    if (!isUsingLatest) {
-      chrome.action.setBadgeText({ text: '!' });
-      chrome.action.setBadgeBackgroundColor({ color: red });
-      chrome.action.setTitle({
-        title: 'You are using older version of Bypass Links',
-      });
-    }
-  });
 });
 
 const onPageLoad = async (tabId: number, url: string) => {
@@ -66,9 +46,6 @@ const onPageLoad = async (tabId: number, url: string) => {
   if (await isValidTabUrl(tabId)) {
     turnOffInputSuggestions(tabId);
   }
-  if (await isValidTabUrl(tabId)) {
-    bypass(tabId, new URL(url));
-  }
 };
 
 // Listen tab url change

apps/extension/src/BackgroundScript/misc/forumPageLinks.ts

@@ -1,6 +1,7 @@
+import { getWebistes } from '@/helpers/fetchFromStorage';
 import scripting from '@/utils/scripting';
 
-const getForumPageLinksFunc = () => {
+const getForum_1_2_LinksFunc = () => {
   const unreadRows = document.querySelectorAll(
     '.block-row.block-row--separated:not(.block-row--alt).is-unread'
   );
@@ -10,7 +11,7 @@ const getForumPageLinksFunc = () => {
   );
 };
 
-const getForumWatchedThreadsLinksFunc = () => {
+const getForum_1_2_WatchedThreadsLinksFunc = () => {
   const unreadRows = document.querySelectorAll(
     '.structItemContainer > .structItem.is-unread > .structItem-cell--main'
   );
@@ -28,20 +29,46 @@ const getForumWatchedThreadsLinksFunc = () => {
   });
 };
 
+const getForum_3_LinksFunc = () => {
+  const recentPostsNode = [
+    ...document.querySelectorAll<HTMLUListElement>('.recent-posts'),
+  ].at(-1);
+  const recentPostLinks =
+    recentPostsNode?.querySelectorAll<HTMLAnchorElement>('.post-thumb > a');
+  return [...(recentPostLinks || [])].map((link) => link.href);
+};
+
 export const getForumPageLinks = async (
-  tabId?: number,
-  url?: string
+  tabId: number,
+  url: string
 ): Promise<string[]> => {
-  if (!tabId || !url) {
-    throw new Error('No tabId/url found in getForumPageLinks()');
+  const websites = await getWebistes();
+  let executor: () => (string | undefined)[];
+
+  switch (true) {
+    case url.includes(websites.FORUM_1):
+    case url.includes(websites.FORUM_2): {
+      const { pathname } = new URL(url);
+      const isWatchThreadsPage = pathname === '/watched/threads';
+      executor = isWatchThreadsPage
+        ? getForum_1_2_WatchedThreadsLinksFunc
+        : getForum_1_2_LinksFunc;
+      break;
+    }
+
+    case url.includes(websites.FORUM_3): {
+      executor = getForum_3_LinksFunc;
+      break;
+    }
+
+    default: {
+      throw new Error('Not a forum page');
+    }
   }
-  const { pathname } = new URL(url);
-  const isWatchThreadsPage = pathname === '/watched/threads';
+
   const [{ result }] = await scripting.executeScript({
     target: { tabId },
-    func: isWatchThreadsPage
-      ? getForumWatchedThreadsLinksFunc
-      : getForumPageLinksFunc,
+    func: executor,
   });
   return result?.filter(Boolean) ?? [];
 };

apps/extension/src/BackgroundScript/redirect/index.ts → apps/extension/src/BackgroundScript/redirections/index.ts

@@ -2,7 +2,7 @@ import { trpcApi } from '@/apis/trpcApi';
 import { startHistoryWatch } from '@/utils/history';
 import { STORAGE_KEYS } from '@bypass/shared';
 import { getMappedRedirections } from '@helpers/fetchFromStorage';
-import { mapRedirections } from '../mapper/redirection';
+import { mapRedirections } from './mapper';
 
 export const redirect = async (tabId: number, url: URL) => {
   // Firefox sometimes changes protocol to https

apps/extension/src/BackgroundScript/utils/index.ts

@@ -1,6 +1,5 @@
 import { EExtensionState } from '@/constants';
 import { getExtensionState } from '@helpers/fetchFromStorage';
-import { trpcApi } from '../../apis/trpcApi';
 import { getIsExtensionActive } from '../../utils/common';
 
 const restrictedProtocols = new Set([
@@ -28,14 +27,6 @@ const restrictedHosts = new Set([
   'addons.mozilla.org', // Firefox addon store
 ]);
 
-export const isValidUrl = (_url?: string): boolean => {
-  if (!_url) return false;
-  const url = new URL(_url);
-  return (
-    !restrictedHosts.has(url.hostname) && !restrictedProtocols.has(url.protocol)
-  );
-};
-
 export const setExtensionIcon = async ({
   extState,
   hasPendingBookmarks,
@@ -57,12 +48,12 @@ export const setExtensionIcon = async ({
   await chrome.action.setIcon({ path: icon });
 };
 
-export const checkForUpdates = async () => {
-  const { chrome: chromeData, firefox } =
-    await trpcApi.extension.latest.query();
-  const latestVersion = IS_CHROME ? chromeData.version : firefox.version;
-  const { version: currentVersion } = chrome.runtime.getManifest();
-  return latestVersion === currentVersion;
+export const isValidUrl = (_url?: string): boolean => {
+  if (!_url) return false;
+  const url = new URL(_url);
+  return (
+    !restrictedHosts.has(url.hostname) && !restrictedProtocols.has(url.protocol)
+  );
 };
 
 export const isValidTabUrl = async (tabId: number) => {

apps/extension/src/BackgroundScript/utils/receiveRuntimeMessage.ts

@@ -12,9 +12,9 @@ export const receiveRuntimeMessage = (
   sendMessage: <T extends RuntimeKeys>(data: RuntimeOutput[T]) => void
 ) => {
   switch (message.key) {
-    case 'forumPageLinks': {
+    case 'openWebsiteLinks': {
       getForumPageLinks(message.tabId, message.url).then((forumPageLinks) => {
-        sendMessage<'forumPageLinks'>({ forumPageLinks });
+        sendMessage<'openWebsiteLinks'>({ forumPageLinks });
       });
       break;
     }

apps/extension/src/BackgroundScript/websites/index.ts

@@ -0,0 +1,6 @@
+import { getWebistes } from '@/helpers/fetchFromStorage';
+
+export const isForumPage = async (hostname: string) => {
+  const websites = await getWebistes();
+  return Object.values(websites).some((website) => hostname.includes(website));
+};

apps/extension/src/BackgroundScript/websites/storageSync.ts

@@ -0,0 +1,21 @@
+import { trpcApi } from '@/apis/trpcApi';
+import { IWebsites, STORAGE_KEYS } from '@bypass/shared';
+
+const getDecodedWebsites = (encodedWebsites: IWebsites) => {
+  return Object.entries(encodedWebsites).reduce((acc, [key, value]) => {
+    return {
+      ...acc,
+      [key]: decodeURIComponent(atob(value)),
+    };
+  }, {});
+};
+
+export const syncWebsitesToStorage = async () => {
+  const response = await trpcApi.firebaseData.websitesGet.query();
+  const websitesData = getDecodedWebsites(response);
+  await chrome.storage.local.set({ [STORAGE_KEYS.websites]: websitesData });
+};
+
+export const resetWebsites = async () => {
+  await chrome.storage.local.remove(STORAGE_KEYS.websites);
+};

apps/extension/src/BookmarksPanel/components/BookmarkAddEditDialog.tsx

@@ -9,7 +9,7 @@ import {
 } from '@bypass/shared';
 import { Button, Modal, Select, Stack, TextInput } from '@mantine/core';
 import { useForm } from '@mantine/form';
-import { memo, useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useLocation } from 'wouter';
 import { useShallow } from 'zustand/react/shallow';
 import useBookmarkStore from '../store/useBookmarkStore';
@@ -37,7 +37,7 @@ interface IForm {
 
 const validateHandler = (value: string) => (value?.trim() ? null : 'Required');
 
-const BookmarkAddEditDialog = memo<Props>(({ curFolder, handleScroll }) => {
+const BookmarkAddEditDialog = ({ curFolder, handleScroll }: Props) => {
   const [, navigate] = useLocation();
   const { bookmarkOperation, resetBookmarkOperation } = useBookmarkRouteStore(
     useShallow((state) => ({
@@ -217,7 +217,6 @@ const BookmarkAddEditDialog = memo<Props>(({ curFolder, handleScroll }) => {
       </form>
     </Modal>
   );
-});
-BookmarkAddEditDialog.displayName = 'BookmarkAddEditDialog';
+};
 
 export default BookmarkAddEditDialog;

apps/extension/src/BookmarksPanel/components/BookmarkContextMenu.tsx

@@ -165,6 +165,5 @@ const BookmarkContextMenu = memo<Props>(
     );
   }
 );
-BookmarkContextMenu.displayName = 'BookmarkContextMenu';
 
 export default BookmarkContextMenu;

apps/extension/src/BookmarksPanel/components/BookmarkRow.tsx

@@ -14,6 +14,5 @@ const BookmarkRow = memo<Omit<BookmarkProps, 'onOpenLink'>>((props) => {
 
   return <Bookmark {...props} onOpenLink={onOpenLink} />;
 });
-BookmarkRow.displayName = 'BookmarkRow';
 
 export default BookmarkRow;

apps/extension/src/BookmarksPanel/components/BookmarksHeader.tsx

@@ -119,6 +119,5 @@ const BookmarksHeader = memo<Props>(({ onSearchChange, folderContext }) => {
     </>
   );
 });
-BookmarksHeader.displayName = 'BookmarksHeader';
 
 export default BookmarksHeader;