From 1b8137fe354630aaa5ecc3d34c239dade5417765 Mon Sep 17 00:00:00 2001 From: PhilReact Date: Tue, 5 Nov 2024 11:45:00 +0200 Subject: [PATCH] added sync indicator for q-apps --- src/App.tsx | 3 +++ src/background.ts | 25 +++++++++++++++++++++++- src/components/Apps/AppsDesktop.tsx | 7 +++++-- src/components/Apps/AppsDevMode.tsx | 6 ++++-- src/components/CoreSyncStatus.css | 2 +- src/components/CoreSyncStatus.tsx | 21 ++++++++++++-------- src/components/Desktop/DesktopFooter.tsx | 6 +++--- src/components/Save/Save.tsx | 3 ++- 8 files changed, 55 insertions(+), 18 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index c9df7fc..5987ae0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -651,6 +651,9 @@ function App() { if (message.action === "QORTAL_REQUEST_PERMISSION") { try { await showQortalRequestExtension(message?.payload); + if(message?.payload?.checkbox1){ + qortalRequestCheckbox1Ref.current = message?.payload?.checkbox1 + } if (qortalRequestCheckbox1Ref.current) { event.source.postMessage( { diff --git a/src/background.ts b/src/background.ts index 27826b4..7c609a7 100644 --- a/src/background.ts +++ b/src/background.ts @@ -111,7 +111,7 @@ export const groupApi = "https://ext-node.qortal.link"; export const groupApiSocket = "wss://ext-node.qortal.link"; export const groupApiLocal = "http://127.0.0.1:12391"; export const groupApiSocketLocal = "ws://127.0.0.1:12391"; -const timeDifferenceForNotificationChatsBackground = 600000; +const timeDifferenceForNotificationChatsBackground = 86400000; const requestQueueAnnouncements = new RequestQueueWithPromise(1); let isMobile = true; @@ -3212,4 +3212,27 @@ export const checkThreads = async (bringBack) => { // BackgroundFetch.finish(taskId); // }); +let notificationCheckInterval +const createNotificationCheck = () => { + // Check if an interval already exists before creating it + if (!notificationCheckInterval) { + notificationCheckInterval = setInterval(async () => { + try { + // This would replace the Chrome alarm callback + const wallet = await getSaveWallet(); + const address = wallet?.address0; + if (!address) return; + + checkActiveChatsForNotifications(); + checkNewMessages(); + checkThreads(); + } catch (error) { + console.error('Error checking notifications:', error); + } + }, 10 * 60 * 1000); // 10 minutes + } +}; + +// Call this function when initializing your app +createNotificationCheck(); \ No newline at end of file diff --git a/src/components/Apps/AppsDesktop.tsx b/src/components/Apps/AppsDesktop.tsx index 7065782..ec47eec 100644 --- a/src/components/Apps/AppsDesktop.tsx +++ b/src/components/Apps/AppsDesktop.tsx @@ -20,6 +20,7 @@ import { HomeIcon } from "../../assets/Icons/HomeIcon"; import { MessagingIcon } from "../../assets/Icons/MessagingIcon"; import { Save } from "../Save/Save"; import { HubsIcon } from "../../assets/Icons/HubsIcon"; +import { CoreSyncStatus } from "../CoreSyncStatus"; const uid = new ShortUniqueId({ length: 8 }); @@ -299,7 +300,7 @@ export const AppsDesktop = ({ mode, setMode, show , myName, goToHome, setDesktop height: '100vh', alignItems: 'center', display: 'flex', - gap: '30px' + gap: '25px' }}> - + + + {mode !== 'home' && ( diff --git a/src/components/Apps/AppsDevMode.tsx b/src/components/Apps/AppsDevMode.tsx index 4930d50..6e997d0 100644 --- a/src/components/Apps/AppsDevMode.tsx +++ b/src/components/Apps/AppsDevMode.tsx @@ -21,6 +21,7 @@ import { MessagingIcon } from "../../assets/Icons/MessagingIcon"; import { Save } from "../Save/Save"; import { HubsIcon } from "../../assets/Icons/HubsIcon"; import { AppsDevModeNavBar } from "./AppsDevModeNavBar"; +import { CoreSyncStatus } from "../CoreSyncStatus"; const uid = new ShortUniqueId({ length: 8 }); @@ -191,7 +192,7 @@ export const AppsDevMode = ({ mode, setMode, show , myName, goToHome, setDesktop height: '100vh', alignItems: 'center', display: 'flex', - gap: '30px' + gap: '25px' }}> - + + {mode !== 'home' && ( diff --git a/src/components/CoreSyncStatus.css b/src/components/CoreSyncStatus.css index 00b03e1..87bf9d7 100644 --- a/src/components/CoreSyncStatus.css +++ b/src/components/CoreSyncStatus.css @@ -9,7 +9,7 @@ } .tooltip .bottom { - min-width: 200px; + min-width: 225px; max-width: 250px; top: 35px; right: 0px; diff --git a/src/components/CoreSyncStatus.tsx b/src/components/CoreSyncStatus.tsx index 8de712e..1617a37 100644 --- a/src/components/CoreSyncStatus.tsx +++ b/src/components/CoreSyncStatus.tsx @@ -4,7 +4,7 @@ import syncedMintingImg from '../assets/syncStatus/synced.png' import syncingImg from '../assets/syncStatus/synced.png' import { getBaseApiReact } from '../App'; import './CoreSyncStatus.css' -export const CoreSyncStatus = () => { +export const CoreSyncStatus = ({imageSize, position}) => { const [nodeInfos, setNodeInfos] = useState({}); const [coreInfos, setCoreInfos] = useState({}); const [isUsingGateway, setIsUsingGateway] = useState(false); @@ -68,22 +68,27 @@ export const CoreSyncStatus = () => { imagePath = syncingImg } else if (isSynchronizing && !isMintingPossible && syncPercent === 100) { imagePath = syncingImg; - message = `Synchronized (Not Minting)` + message = `Synchronizing ${isUsingGateway ? '' :'(Not Minting)'}` } else if (!isSynchronizing && !isMintingPossible && syncPercent === 100) { imagePath = syncedImg - message = `Synchronized (Not Minting)` + message = `Synchronized ${isUsingGateway ? '' :'(Not Minting)'}` } else if (isSynchronizing && isMintingPossible && syncPercent === 100) { - imagePath = syncedMintingImg; - message = `Synchronized (Minting)` + imagePath = syncingImg; + message = `Synchronizing ${isUsingGateway ? '' :'(Minting)'}` } else if (!isSynchronizing && isMintingPossible && syncPercent === 100) { imagePath = syncedMintingImg; - message = `Synchronized (Minting)` + message = `Synchronized ${isUsingGateway ? '' :'(Minting)'}` } + + return (
- sync status -
+ sync status +

Core Information

Core Version: {buildVersion}

{message}

diff --git a/src/components/Desktop/DesktopFooter.tsx b/src/components/Desktop/DesktopFooter.tsx index 70b7e5b..29268fe 100644 --- a/src/components/Desktop/DesktopFooter.tsx +++ b/src/components/Desktop/DesktopFooter.tsx @@ -20,7 +20,7 @@ import { Save } from "../Save/Save"; import { useRecoilState } from "recoil"; import { enabledDevModeAtom } from "../../atoms/global"; -export const IconWrapper = ({ children, label, color, selected }) => { +export const IconWrapper = ({ children, label, color, selected, disableWidth }) => { return ( { alignItems: "center", gap: "5px", flexDirection: "column", - height: "89px", - width: "89px", + height: disableWidth ? 'auto' : "89px", + width: disableWidth ? 'auto' : "89px", borderRadius: "50%", backgroundColor: selected ? "rgba(28, 29, 32, 1)" : "transparent", }} diff --git a/src/components/Save/Save.tsx b/src/components/Save/Save.tsx index 1de00ba..5700eb9 100644 --- a/src/components/Save/Save.tsx +++ b/src/components/Save/Save.tsx @@ -16,7 +16,7 @@ import { getFee } from "../../background"; import { CustomizedSnackbars } from "../Snackbar/Snackbar"; import { SaveIcon } from "../../assets/svgs/SaveIcon"; import { IconWrapper } from "../Desktop/DesktopFooter"; -export const Save = ({ isDesktop }) => { +export const Save = ({ isDesktop, disableWidth }) => { const [pinnedApps, setPinnedApps] = useRecoilState(sortablePinnedAppsAtom); const [settingsQdnLastUpdated, setSettingsQdnLastUpdated] = useRecoilState( settingsQDNLastUpdatedAtom @@ -160,6 +160,7 @@ export const Save = ({ isDesktop }) => { > {isDesktop ? (