[Issue-253, 157][Mythical TeleApp] Handle token visibility and update…

… the UI for delay time.
Koniverse · Jan 2, 2025 · e6a82ce · e6a82ce
1 parent 87f3c11
commit e6a82ce
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 20 deletions.
diff --git a/packages/extension-koni-ui/src/Popup/Home/LeaderboardTemp/index.tsx b/packages/extension-koni-ui/src/Popup/Home/LeaderboardTemp/index.tsx
@@ -119,7 +119,7 @@ const Component = ({ className }: Props): React.ReactElement => {
     return !!(leaderboard && 'title' in leaderboard && 'content' in leaderboard);
   }, [leaderboardInfo]);
 
-  const specialTimeRemaining = useMemo(() => {
+  const timeRemainingDateTime = useMemo(() => {
     if (!leaderboardInfo?.endTimeTs || !serverTime) {
       return undefined;
     }
@@ -145,7 +145,7 @@ const Component = ({ className }: Props): React.ReactElement => {
     return serverTime > delayStartTime && serverTime < delayEndTime;
   }, [leaderboardInfo?.endTimeTs, leaderboardInfo?.specialTimeDelayDuration, serverTime]);
 
-  const specialTimeTitle = useMemo(() => {
+  const timeRemainingTitle = useMemo(() => {
     if (!leaderboardInfo?.endTimeTs || !serverTime) {
       return undefined;
     }
@@ -175,10 +175,8 @@ const Component = ({ className }: Props): React.ReactElement => {
       {
         <div className='time-remaining-wrapper'>
           <TimeRemaining
-            endTime={leaderboardInfo?.endTimeTs ? new Date(leaderboardInfo?.endTimeTs).toString() : undefined}
-            serverTime={serverTime}
-            specialTimeRemaining={specialTimeRemaining}
-            specialTimeTitle={specialTimeTitle}
+            specialTimeRemaining={timeRemainingDateTime}
+            specialTimeTitle={timeRemainingTitle}
           />
         </div>}
 

diff --git a/packages/extension-koni-ui/src/Popup/Home/MissionTemp/index.tsx b/packages/extension-koni-ui/src/Popup/Home/MissionTemp/index.tsx
@@ -7,7 +7,7 @@ import { BookaSdk } from '@subwallet/extension-koni-ui/connector/booka/sdk';
 import { Achievement, Task, TaskCategory, TaskCategoryType } from '@subwallet/extension-koni-ui/connector/booka/types';
 import { LINK_NFL_APP_DOWNLOAD } from '@subwallet/extension-koni-ui/constants';
 import { HomeContext } from '@subwallet/extension-koni-ui/contexts/screen/HomeContext';
-import { useSetCurrentPage } from '@subwallet/extension-koni-ui/hooks';
+import { useServerTime, useSetCurrentPage } from '@subwallet/extension-koni-ui/hooks';
 import { ThemeProps } from '@subwallet/extension-koni-ui/types';
 import { openInNewTab } from '@subwallet/extension-koni-ui/utils';
 import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
@@ -32,8 +32,7 @@ const Component = ({ className }: Props): React.ReactElement => {
   const [achievements, setAchievements] = useState<Achievement[]>(apiSDK.achievementList);
   const [selectedFilterTab, setSelectedFilterTab] = useState<string>(TaskCategoryType.DAILY);
   const [metadata, setMetadata] = useState(apiSDK.getMetadata());
-  const [serverTime, setServerTime] = useState<number>(apiSDK.serverTime);
-
+  const { serverTime } = useServerTime();
   const filterTabItems = useMemo<FilterTabItemType[]>(() => {
     return [
       {
@@ -73,16 +72,6 @@ const Component = ({ className }: Props): React.ReactElement => {
     navigate('/invite');
   }, [navigate]);
 
-  useEffect(() => {
-    const timeSub = apiSDK.subscribeServerTime().subscribe((time) => {
-      setServerTime(time);
-    });
-
-    return () => {
-      timeSub.unsubscribe();
-    };
-  }, []);
-
   useEffect(() => {
     setBackgroundStyle('style-2');
 
@@ -151,7 +140,10 @@ const Component = ({ className }: Props): React.ReactElement => {
       />
 
       {endTime && <div className='time-remaining-wrapper'>
-        <TimeRemaining endTime={endTime} />
+        <TimeRemaining
+          endTime={endTime}
+          serverTime={serverTime}
+        />
       </div>}
 
       <MissionSectionListContainer