Merge pull request #119 from BuidlerDAO/fix-login&width

fix: fix onload resize & logout timing
BuidlerDAO · Apr 15, 2024 · abe79a1 · abe79a1
2 parents 3211263 + c05f3b8
commit abe79a1
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 24 deletions.
diff --git a/src/content/drawer/index.tsx b/src/content/drawer/index.tsx
@@ -98,10 +98,14 @@ export default function PersistentDrawerRight() {
 
     // 添加窗口大小变化时的事件监听器
     window.addEventListener('resize', handleResize);
+    window.addEventListener('load', handleResize);
+
+    handleResize();
 
     // 在组件卸载时移除事件监听器
     return () => {
       window.removeEventListener('resize', handleResize);
+      window.removeEventListener('load', handleResize);
     };
   }, []);
 
@@ -125,30 +129,63 @@ export default function PersistentDrawerRight() {
 
     // 检查xfans写入localStorage的twitterid跟twitter写在cookie里的twitterid是否匹配，不匹配则退出登录
     // 针对登出或者切换账号的情况
-    setInterval(() => {
-      // 当处于登陆状态中的时候，自动logout不触发。
-      if (
-        window.location.href.includes(XFANS_TOKEN) ||
-        window.location.href.includes(XFANS_CHECK_RETWEET) ||
-        window.location.href.includes(XFANS_TWITTER_HOMEPAGE)
-      ) {
-        return;
-      }
-      const userInfo = useGlobalStore.getState().userInfo;
-      if (userInfo && userInfo?.twitterId && userInfo?.twitterId?.length > 0) {
-        // 读取所有的 cookie
-        const cookies = document.cookie;
-        // 将获取的 cookie 字符串转换为对象形式
-        const cookieObj = Object.fromEntries(
-          cookies.split(';').map((cookie) => cookie.trim().split('='))
-        );
-        const cookieTwid = decodeURIComponent(cookieObj.twid)?.split('=')?.[1];
-        if (userInfo?.twitterId !== cookieTwid) {
+    // setInterval(() => {
+    //   // 当处于登陆状态中的时候，自动logout不触发。
+    //   if (
+    //     window.location.href.includes(XFANS_TOKEN) ||
+    //     window.location.href.includes(XFANS_CHECK_RETWEET) ||
+    //     window.location.href.includes(XFANS_TWITTER_HOMEPAGE)
+    //   ) {
+    //     return;
+    //   }
+    //   const userInfo = useGlobalStore.getState().userInfo;
+    //   if (userInfo && userInfo?.twitterId && userInfo?.twitterId?.length > 0) {
+    //     // 读取所有的 cookie
+    //     const cookies = document.cookie;
+    //     // 将获取的 cookie 字符串转换为对象形式
+    //     const cookieObj = Object.fromEntries(
+    //       cookies.split(';').map((cookie) => cookie.trim().split('='))
+    //     );
+    //     const cookieTwid = decodeURIComponent(cookieObj.twid)?.split('=')?.[1];
+    //     if (userInfo?.twitterId !== cookieTwid) {
+    //       logout();
+    //     }
+    //   }
+    // }, 1000);
+  }, []);
+
+  const initURLMonitor = () => {
+    // 定义您要监控的 URL
+    const switchUrl = 'https://api.twitter.com/1.1/account/multi/switch.json';
+    const logoutUrl = 'https://api.twitter.com/1.1/account/logout.json';
+    const taskUrl = 'https://api.twitter.com/1.1/account/task.json';
+
+    // 创建 PerformanceObserver
+    const observer = new PerformanceObserver((list) => {
+      // 获取所有资源性能条目
+      const entries = list.getEntriesByType('resource');
+
+      // 遍历每个性能条目
+      for (const entry of entries) {
+        // 检查资源的 URL 是否与您关心的 URL 匹配
+        if (
+          entry.name.includes(switchUrl) ||
+          entry.name.includes(logoutUrl) ||
+          entry.name.includes(taskUrl)
+        ) {
+          console.log('Detected request to switch account:', entry.name);
+          console.log('Timing information:', entry);
+          // 登出
           logout();
         }
       }
-    }, 1000);
-  }, []);
+    });
+
+    // 开始观察 performance 对象中的 resource 类型数据
+    observer.observe({ type: 'resource', buffered: true });
+  };
+
+  initURLMonitor();
 
   const checkProfileData = async () => {
     // https://test-xfans-api.d.buidlerdao.xyz/api/user/me

diff --git a/src/content/loginPage/congratulationPage.tsx b/src/content/loginPage/congratulationPage.tsx
@@ -85,7 +85,7 @@ const CongratulationPage: FC<CongratulationPageProps> = ({ goProfile }) => {
   }, []);
 
   return (
-    <div className="min-h-screen h-full w-full items-center justify-center text-center">
+    <div className="h-full min-h-screen w-full items-center justify-center text-center">
       <p className="mt-[81px] mb-[44px] text-center text-[32px] font-bold leading-[38px] text-[#0F1419]">
         Congratulations!
       </p>
@@ -186,8 +186,8 @@ const CongratulationPage: FC<CongratulationPageProps> = ({ goProfile }) => {
         disableElevation
         style={{
           color: '#fff',
-          backgroundColor: retweetStatus ? '#9A6CF9' : '#B08DF6',
-          borderColor: retweetStatus ? '#9A6CF9' : '#B08DF6',
+          backgroundColor: startStatus ? '#9A6CF9' : '#B08DF6',
+          borderColor: startStatus ? '#9A6CF9' : '#B08DF6',
         }}
         onClick={async () => {
           try {