feat: replace rc-notification with sonner

package.json

@@ -17,14 +17,14 @@
     "commit": "git add -A & git-cz",
     "release": "node scripts/release.js",
     "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
-    "postinstall": "husky install",
     "lint": "npx eslint",
     "icon": "node scripts/icoFetcher.js",
-    "support": "node scripts/supported.js"
+    "support": "node scripts/supported.js",
+    "prepare": "husky"
   },
   "config": {
     "commitizen": {
-      "path": "node_modules/cz-conventional-changelog"
+      "path": "./node_modules/cz-conventional-changelog"
     }
   },
   "browserslist": [
@@ -55,7 +55,7 @@
     "all-contributors-cli": "^6.20.0",
     "chalk": "^4.1.0",
     "chokidar": "^3.5.1",
-    "commitizen": "^4.2.4",
+    "commitizen": "^4.3.1",
     "conventional-changelog-cli": "^2.2.2",
     "cz-conventional-changelog": "^3.3.0",
     "decode-ico": "^0.4.1",
@@ -66,6 +66,7 @@
     "eslint-plugin-n": "^17.10.3",
     "eslint-plugin-promise": "^7.1.0",
     "eslint-plugin-react": "^7.37.1",
+    "eslint-plugin-react-hooks": "^5.0.0",
     "execa": "^5.0.0",
     "globals": "^15.10.0",
     "got": "^12.0.1",
@@ -89,7 +90,7 @@
     "jquery": "^3.7.1",
     "path-browserify": "^1.0.1",
     "preact": "^10.24.1",
-    "rc-notification": "4.4.0"
+    "sonner": "^1.5.0"
   },
   "packageManager": "yarn@4.5.0"
 }

src/common.ts

@@ -7,7 +7,7 @@ import {
   TORRENT_INFO, DOUBAN_MOBILE_API,
 } from './const';
 import i18nConfig from './i18n.json';
-import Notification from './components/Notification';
+import { toast } from 'sonner';
 interface RequestOptions {
   method?: 'GET' | 'POST'
   responseType?: 'json' | 'blob' | 'arraybuffer' | undefined
@@ -23,9 +23,7 @@ const formatTorrentTitle = (title:string) => {
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const handleError = (error:any) => {
-  Notification.open({
-    description: error.message || error,
-  });
+  toast.error(error.message || error);
 };
 const getDoubanInfo = async (doubanUrl:string, isTV?: boolean) => {
   try {
@@ -1434,10 +1432,7 @@ const uploadToPtpImg = async (imgArray: Array<string | File>, isFiles = false) =
   try {
     const apiKey = getValue('easy-seed.ptp-img-api-key', false);
     if (!apiKey) {
-      Notification.open({
-        message: $t('ptpimg上传失败'),
-        description: $t('请到配置面板中填入ptpimg的api_key'),
-      });
+      toast.error(`${$t('ptpimg上传失败')} ${$t('请到配置面板中填入ptpimg的api_key')}`);
       return;
     }
 

src/components/Container.tsx

@@ -12,6 +12,7 @@ import UploadSiteList from '../components/UploadSiteList';
 import SettingPanel from './SettingPanel';
 import ConfigSvg from '../assets/setting.svg';
 import { getQuickSearchUrl } from './common';
+import { Toaster } from 'sonner';
 
 const Container = () => {
   const [settingPanelOpen, setSettingPanelOpen] = useState(false);
@@ -93,6 +94,7 @@ const Container = () => {
   };
   const quickSearchClosed = getValue('easy-seed.quick-search-closed', false) || '';
   return <>
+    <Toaster position="top-right" richColors />
     { (CURRENT_SITE_NAME === 'HH') && <>
       <div class="font-bold leading-6"><Title /></div>
       <div class="font-bold leading-6"><UploadSiteList /></div>

src/components/Douban.tsx

@@ -6,7 +6,7 @@ import {
   $t, getDoubanIdByIMDB, getDoubanInfo, getDoubanBookInfo,
   getSubTitle, getAreaCode, getPreciseCategory,
 } from '../common';
-import Notification from './Notification';
+import { toast } from 'sonner';
 
 const getTvSeasonData = async (data:Douban.Season) => {
   const { title: torrentTitle } = TORRENT_INFO;
@@ -75,17 +75,11 @@ const Douban = () => {
           const isTVCategory = !!TORRENT_INFO.category.match(/tv/);
           const movieData = await getDoubanInfo(doubanUrl, isTVCategory);
           if (movieData) {
-            Notification.open({
-              message: $t('成功'),
-              description: $t('获取成功'),
-            });
+            toast.success($t('获取成功'));
             updateTorrentInfo(movieData);
           }
         } else {
-          Notification.open({
-            message: $t('成功'),
-            description: $t('获取成功'),
-          });
+          toast.success($t('获取成功'));
         }
       }
     } catch (error) {
@@ -112,25 +106,16 @@ const Douban = () => {
           TORRENT_INFO.description = data.book_intro || '';
           TORRENT_INFO.doubanBookInfo = data || null;
         }
-        Notification.open({
-          message: $t('成功'),
-          description: $t('获取成功'),
-        });
+        toast.success($t('获取成功'));
       }).catch(error => {
         console.log(error);
-        Notification.open({
-          message: $t('错误'),
-          description: error.message,
-        });
+        toast.error(error.message);
       }).finally(() => {
         setBookBtnText('获取豆瓣读书简介');
         setBtnDisable(false);
       });
     } else {
-      Notification.open({
-        message: $t('错误'),
-        description: $t('缺少豆瓣链接'),
-      });
+      toast.error($t('缺少豆瓣链接'));
     }
   };
   return showSearch

src/components/SettingPanel.tsx

@@ -6,7 +6,7 @@ import {
   SORTED_SITE_KEYS,
 } from '../const';
 import { FeatureSwitchList, SiteListConfig } from './conf';
-import Notification from './Notification';
+import { toast } from 'sonner';
 interface Props {
   closePanel: JSX.MouseEventHandler<HTMLButtonElement>
 }
@@ -73,9 +73,7 @@ const SettingPanel = (props:Props) => {
       window.location.reload();
     } catch (error) {
       console.log(error);
-      Notification.open({
-        message: $t('错误'), description: $t('保存本地站点设置失败'),
-      });
+      toast.error($t('保存本地站点设置失败'));
     }
   };
   interface InfoKey {

src/components/Transfer.tsx

@@ -6,7 +6,7 @@ import {
 import {
   $t, fetch, transferImgs, uploadToPixhost, getValue, uploadToImgbox, uploadToHDB,
 } from '../common';
-import Notification from './Notification';
+import { toast } from 'sonner';
 
 const Transfer = () => {
   const [imgHost, setImgHost] = useState('imgbox');
@@ -97,16 +97,10 @@ const Transfer = () => {
           }
         });
         TORRENT_INFO.description = description;
-        Notification.open({
-          message: $t('成功'),
-          description: $t('转换成功！'),
-        });
+        toast.success($t('转换成功！'));
       }
     } catch (error) {
-      Notification.open({
-        message: $t('错误'),
-        description: (error as Error).message,
-      });
+      toast.error((error as Error).message);
     } finally {
       setBtnText('转缩略图');
       setBtnDisable(false);

src/components/UploadImg.tsx

@@ -5,7 +5,7 @@ import {
 import {
   $t, fetch, getOriginalImgUrl, saveScreenshotsToPtpimg, transferImgs,
 } from '../common';
-import Notification from './Notification';
+import { toast } from 'sonner';
 
 const UploadImg = () => {
   const [selectHost, setSelectHost] = useState('ptpimg');
@@ -46,10 +46,7 @@ const UploadImg = () => {
         }
       }
       if (imgData.length > 0) {
-        Notification.open({
-          message: $t('成功'),
-          description: '',
-        });
+        toast.success($t('成功'));
       }
       let { description, originalDescription } = TORRENT_INFO;
       TORRENT_INFO.screenshots = imgData;
@@ -72,10 +69,7 @@ const UploadImg = () => {
       TORRENT_INFO.originalDescription = `${originalDescription}\n${screenBBcodeArray.join('')}`;
       TORRENT_INFO.description = `${description}\n${screenBBcodeArray.join('')}`;
     } catch (error) {
-      Notification.open({
-        message: $t('错误'),
-        description: (error as Error).message,
-      });
+      toast.error((error as Error).message);
     } finally {
       setBtnText('转存截图');
       setBtnDisable(false);

src/components/UploadSiteList.tsx

@@ -4,8 +4,8 @@ import {
 import {
   $t, fetch, getIMDBIdByUrl, getValue,
 } from '../common';
-import Notification from './Notification';
 import { getTorrentFileData } from '../source/helper';
+import { toast } from 'sonner';
 
 const getPTPGroupId = async (imdbUrl:string|undefined) => {
   if (!imdbUrl) {
@@ -25,10 +25,7 @@ const getPTPGroupId = async (imdbUrl:string|undefined) => {
 const openBatchSeedTabs = () => {
   const batchSeedSetting = getValue('easy-seed.enabled-batch-seed-sites') || [];
   if (batchSeedSetting.length === 0) {
-    Notification.open({
-      message: $t('错误'),
-      description: $t('请先设置群转列表'),
-    });
+    toast.error($t('请先设置群转列表'));
     return false;
   }
   SORTED_SITE_KEYS.forEach(async (siteName) => {
@@ -48,10 +45,7 @@ const openBatchSeedTabs = () => {
       }
     }
   });
-  Notification.open({
-    message: $t('成功'),
-    description: $t('转种页面已打开，请前往对应页面操作'),
-  });
+  toast.success($t('转种页面已打开，请前往对应页面操作'));
 };
 const getGPWGroupId = async (imdbUrl:string|undefined) => {
   if (!imdbUrl) {
@@ -135,9 +129,7 @@ const UploadSiteList = () => {
       }
     }
     if (CURRENT_SITE_NAME === 'TTG' && !TORRENT_INFO.description) {
-      Notification.open({
-        description: $t('请等待页面加载完成'),
-      });
+      toast.warning($t('请等待页面加载完成'));
       return;
     }
     const timestamp = `${Date.now()}`;

src/site-dom/ptpimg.tsx

@@ -1,5 +1,5 @@
 import { render } from 'preact';
-import Notification from '../components/Notification';
+import { toast } from 'sonner';
 
 if (location.host === 'ptpimg.me') {
   const ptpImgApiKey = GM_getValue('easy-seed.ptp-img-api-key') || '';
@@ -9,10 +9,7 @@ if (location.host === 'ptpimg.me') {
       <button class="btn btn-info" onClick={() => {
         const apiKey = $('#api_key').val();
         GM_setValue('easy-seed.ptp-img-api-key', apiKey);
-        Notification.open({
-          message: 'Success!',
-          description: 'Saved to EasyUpload.',
-        });
+        toast.success('Success! Saved to EasyUpload.');
       }}>
         <i class="glyphicon glyphicon-floppy-saved" />
         <span>Save ApiKey</span>

src/source/helper.ts

@@ -2,7 +2,7 @@ import parseTorrent, { toTorrentFile } from 'parse-torrent';
 import { fetch, $t } from '../common';
 import { Buffer } from 'buffer/index.js';
 import { CURRENT_SITE_INFO } from '../const';
-import Notification from '../components/Notification';
+import { toast } from 'sonner';
 
 /**
  * 格式化视频类型
@@ -158,10 +158,7 @@ const getTorrentFileData = async (selector = '', torrentLink = '') => {
     const base64 = await blobToBase64(blob);
     return base64;
   } catch (error) {
-    Notification.open({
-      message: $t('种子文件下载失败'),
-      description: $t('请手动下载'),
-    });
+    toast.error(`${$t('种子文件下载失败')} ${$t('请手动下载')}`);
     console.log(error);
     return '';
   }