changed qortalrequest messaging

This commit is contained in:
PhilReact 2024-10-30 09:37:23 +02:00
parent 4f91924947
commit eb8049c12d
11 changed files with 674 additions and 652 deletions

9
package-lock.json generated
View File

@ -9,6 +9,7 @@
"version": "0.0.0",
"dependencies": {
"@capacitor/android": "^6.1.2",
"@capacitor/browser": "^6.0.3",
"@capacitor/cli": "^6.1.2",
"@capacitor/core": "^6.1.2",
"@chatscope/chat-ui-kit-react": "^2.0.3",
@ -398,6 +399,14 @@
"@capacitor/core": "^6.1.0"
}
},
"node_modules/@capacitor/browser": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/@capacitor/browser/-/browser-6.0.3.tgz",
"integrity": "sha512-V5/ViE+fy3rW+6w0L2du4747/hivBcI/5OGOKi01U9YdFvOWbiiGL+qetq1QdkANEqvYd4yoCeXZL2GyGySn5g==",
"peerDependencies": {
"@capacitor/core": "^6.0.0"
}
},
"node_modules/@capacitor/cli": {
"version": "6.1.2",
"resolved": "https://registry.npmjs.org/@capacitor/cli/-/cli-6.1.2.tgz",

View File

@ -13,6 +13,7 @@
},
"dependencies": {
"@capacitor/android": "^6.1.2",
"@capacitor/browser": "^6.0.3",
"@capacitor/cli": "^6.1.2",
"@capacitor/core": "^6.1.2",
"@chatscope/chat-ui-kit-react": "^2.0.3",

View File

@ -6,7 +6,7 @@ import {
useRef,
useState,
} from "react";
import { Browser } from "@capacitor/browser";
import "./App.css";
import { useDropzone } from "react-dropzone";
import {
@ -102,9 +102,20 @@ import { MainAvatar } from "./components/MainAvatar";
import { useRetrieveDataLocalStorage } from "./useRetrieveDataLocalStorage";
import { useQortalGetSaveSettings } from "./useQortalGetSaveSettings";
import { useRecoilState, useResetRecoilState, useSetRecoilState } from "recoil";
import { canSaveSettingToQdnAtom, fullScreenAtom, hasSettingsChangedAtom, oldPinnedAppsAtom, settingsLocalLastUpdatedAtom, settingsQDNLastUpdatedAtom, sortablePinnedAppsAtom } from "./atoms/global";
import {
canSaveSettingToQdnAtom,
fullScreenAtom,
hasSettingsChangedAtom,
oldPinnedAppsAtom,
settingsLocalLastUpdatedAtom,
settingsQDNLastUpdatedAtom,
sortablePinnedAppsAtom,
} from "./atoms/global";
import { useAppFullScreen } from "./useAppFullscreen";
import { NotAuthenticated } from "./ExtStates/NotAuthenticated";
import { openIndexedDB, showSaveFilePicker } from "./components/Apps/useQortalMessageListener";
import { fileToBase64 } from "./utils/fileReading";
import { handleGetFileFromIndexedDB } from "./utils/indexedDB";
type extStates =
@ -205,18 +216,21 @@ export const clearAllQueues = () => {
export const pauseAllQueues = () => {
controlAllQueues("pause");
window.sendMessage("pauseAllQueues", {})
.catch((error) => {
console.error("Failed to pause all queues:", error.message || "An error occurred");
window.sendMessage("pauseAllQueues", {}).catch((error) => {
console.error(
"Failed to pause all queues:",
error.message || "An error occurred"
);
});
};
export const resumeAllQueues = () => {
controlAllQueues("resume");
window.sendMessage("resumeAllQueues", {}).catch((error) => {
console.error("Failed to resume all queues:", error.message || "An error occurred");
console.error(
"Failed to resume all queues:",
error.message || "An error occurred"
);
});
};
export const MyContext = createContext<MyContextInterface>(defaultValues);
@ -255,15 +269,17 @@ export const getBaseApiReactSocket = (customApi?: string) => {
}
if (globalApiKey) {
return `${getProtocol(globalApiKey?.url) === 'http' ? 'ws://': 'wss://'}${cleanUrl(globalApiKey?.url)}`
return `${
getProtocol(globalApiKey?.url) === "http" ? "ws://" : "wss://"
}${cleanUrl(globalApiKey?.url)}`;
} else {
return groupApiSocket;
}
};
export const isMainWindow = true
export const isMainWindow = true;
function App() {
const [extState, setExtstate] = useState<extStates>("not-authenticated");
const [desktopViewMode, setDesktopViewMode] = useState('home')
const [desktopViewMode, setDesktopViewMode] = useState("home");
const [backupjson, setBackupjson] = useState<any>(null);
const [rawWallet, setRawWallet] = useState<any>(null);
@ -286,9 +302,7 @@ function App() {
const [walletToBeDownloaded, setWalletToBeDownloaded] = useState<any>(null);
const [walletToBeDownloadedPassword, setWalletToBeDownloadedPassword] =
useState<string>("");
const [isMain, setIsMain] = useState<boolean>(
true
);
const [isMain, setIsMain] = useState<boolean>(true);
const isMainRef = useRef(false);
const [authenticatePassword, setAuthenticatePassword] = useState<string>("");
const [sendqortState, setSendqortState] = useState<any>(null);
@ -304,11 +318,19 @@ function App() {
const [txList, setTxList] = useState([]);
const [memberGroups, setMemberGroups] = useState([]);
const [isFocused, setIsFocused] = useState(true);
const [hasSettingsChanged, setHasSettingsChanged] = useRecoilState(hasSettingsChangedAtom)
const [hasSettingsChanged, setHasSettingsChanged] = useRecoilState(
hasSettingsChangedAtom
);
const holdRefExtState = useRef<extStates>("not-authenticated");
const isFocusedRef = useRef<boolean>(true);
const { isShow, onCancel, onOk, show, message } = useModal();
const { isShow: isShowUnsavedChanges, onCancel: onCancelUnsavedChanges, onOk: onOkUnsavedChanges, show: showUnsavedChanges, message: messageUnsavedChanges } = useModal();
const {
isShow: isShowUnsavedChanges,
onCancel: onCancelUnsavedChanges,
onOk: onOkUnsavedChanges,
show: showUnsavedChanges,
message: messageUnsavedChanges,
} = useModal();
const {
onCancel: onCancelQortalRequest,
@ -339,15 +361,12 @@ function App() {
const [rootHeight, setRootHeight] = useState("100%");
const [isSettingsOpen, setIsSettingsOpen] = useState(false);
const qortalRequestCheckbox1Ref = useRef(null);
useRetrieveDataLocalStorage()
useQortalGetSaveSettings(userInfo?.name)
useRetrieveDataLocalStorage();
useQortalGetSaveSettings(userInfo?.name);
const [fullScreen, setFullScreen] = useRecoilState(fullScreenAtom);
const { toggleFullScreen } = useAppFullScreen(setFullScreen);
useEffect(() => {
// Attach a global event listener for double-click
const handleDoubleClick = () => {
@ -355,18 +374,29 @@ function App() {
};
// Add the event listener to the root HTML document
document.documentElement.addEventListener('dblclick', handleDoubleClick);
document.documentElement.addEventListener("dblclick", handleDoubleClick);
// Clean up the event listener on unmount
return () => {
document.documentElement.removeEventListener('dblclick', handleDoubleClick);
document.documentElement.removeEventListener(
"dblclick",
handleDoubleClick
);
};
}, [toggleFullScreen]);
//resets for recoil
const resetAtomSortablePinnedAppsAtom = useResetRecoilState(sortablePinnedAppsAtom);
const resetAtomCanSaveSettingToQdnAtom = useResetRecoilState(canSaveSettingToQdnAtom);
const resetAtomSettingsQDNLastUpdatedAtom = useResetRecoilState(settingsQDNLastUpdatedAtom);
const resetAtomSettingsLocalLastUpdatedAtom = useResetRecoilState(settingsLocalLastUpdatedAtom);
const resetAtomSortablePinnedAppsAtom = useResetRecoilState(
sortablePinnedAppsAtom
);
const resetAtomCanSaveSettingToQdnAtom = useResetRecoilState(
canSaveSettingToQdnAtom
);
const resetAtomSettingsQDNLastUpdatedAtom = useResetRecoilState(
settingsQDNLastUpdatedAtom
);
const resetAtomSettingsLocalLastUpdatedAtom = useResetRecoilState(
settingsLocalLastUpdatedAtom
);
const resetAtomOldPinnedAppsAtom = useResetRecoilState(oldPinnedAppsAtom);
const resetAllRecoil = () => {
@ -403,9 +433,10 @@ function App() {
}, []);
const handleSetGlobalApikey = (key) => {
globalApiKey = key;
}
};
useEffect(() => {
window.sendMessage("getApiKey")
window
.sendMessage("getApiKey")
.then((response) => {
if (response) {
handleSetGlobalApikey(response);
@ -413,9 +444,11 @@ function App() {
}
})
.catch((error) => {
console.error("Failed to get API key:", error?.message || "An error occurred");
console.error(
"Failed to get API key:",
error?.message || "An error occurred"
);
});
}, []);
useEffect(() => {
if (extState) {
@ -427,8 +460,6 @@ function App() {
isFocusedRef.current = isFocused;
}, [isFocused]);
// const checkIfUserHasLocalNode = useCallback(async () => {
// try {
// const url = `http://127.0.0.1:12391/admin/status`;
@ -528,11 +559,10 @@ function App() {
};
};
const getBalanceFunc = () => {
setQortBalanceLoading(true);
window.sendMessage("balance")
window
.sendMessage("balance")
.then((response) => {
if (!response?.error && !isNaN(+response)) {
setBalance(response);
@ -543,11 +573,11 @@ function App() {
console.error("Failed to get balance:", error);
setQortBalanceLoading(false);
});
};
const getLtcBalanceFunc = () => {
setLtcBalanceLoading(true);
window.sendMessage("ltcBalance")
window
.sendMessage("ltcBalance")
.then((response) => {
if (!response?.error && !isNaN(+response)) {
setLtcBalance(response);
@ -558,7 +588,6 @@ function App() {
console.error("Failed to get LTC balance:", error);
setLtcBalanceLoading(false);
});
};
const sendCoinFunc = () => {
setSendPaymentError("");
@ -576,7 +605,8 @@ function App() {
return;
}
setIsLoading(true);
window.sendMessage("sendCoin", {
window
.sendMessage("sendCoin", {
amount: Number(paymentAmount),
receiver: paymentTo.trim(),
password: paymentPassword,
@ -594,7 +624,6 @@ function App() {
console.error("Failed to send coin:", error);
setIsLoading(false);
});
};
const clearAllStates = () => {
@ -602,44 +631,47 @@ function App() {
setRequestAuthentication(null);
};
const qortalRequestPermisson = async (message, sender, sendResponse) => {
if (message.action === "QORTAL_REQUEST_PERMISSION" && !isMainWindow) {
const qortalRequestPermissonFromExtension = async (message, event) => {
if (message.action === "QORTAL_REQUEST_PERMISSION") {
try {
await showQortalRequest(message?.payload);
if (qortalRequestCheckbox1Ref.current) {
sendResponse({
accepted: true,
checkbox1: qortalRequestCheckbox1Ref.current,
});
return;
}
sendResponse({ accepted: true });
} catch (error) {
sendResponse({ accepted: false });
} finally {
window.close();
}
}
};
const qortalRequestPermissonFromExtension = async (message, sender, sendResponse) => {
if (message.action === "QORTAL_REQUEST_PERMISSION" && isMainWindow) {
try {
console.log("QORTAL_REQUEST_PERMISSION2", event, message);
await showQortalRequestExtension(message?.payload);
console.log("event100", event);
if (qortalRequestCheckbox1Ref.current) {
sendResponse({
event.source.postMessage(
{
action: "QORTAL_REQUEST_PERMISSION_RESPONSE",
requestId: message?.requestId,
result: {
accepted: true,
checkbox1: qortalRequestCheckbox1Ref.current,
});
},
},
event.origin
);
return;
}
sendResponse({ accepted: true });
event.source.postMessage(
{
action: "QORTAL_REQUEST_PERMISSION_RESPONSE",
requestId: message?.requestId,
result: {
accepted: true,
},
},
event.origin
);
} catch (error) {
sendResponse({ accepted: false });
event.source.postMessage(
{
action: "QORTAL_REQUEST_PERMISSION_RESPONSE",
requestId: message?.requestId,
result: {
accepted: false,
},
},
event.origin
);
}
}
};
@ -647,15 +679,15 @@ function App() {
useEffect(() => {
// Handler function for incoming messages
const messageHandler = (event) => {
console.log("messageHandler", event);
const message = event.data;
if (message?.action === "CHECK_FOCUS") {
event.source.postMessage({ action: "CHECK_FOCUS_RESPONSE", isFocused: isFocusedRef.current }, event.origin);
} else if (
message.action === "NOTIFICATION_OPEN_DIRECT"
) {
event.source.postMessage(
{ action: "CHECK_FOCUS_RESPONSE", isFocused: isFocusedRef.current },
event.origin
);
} else if (message.action === "NOTIFICATION_OPEN_DIRECT") {
executeEvent("openDirectMessage", {
from: message.payload.from,
});
@ -677,9 +709,17 @@ function App() {
executeEvent("openThreadNewPost", {
data: message.payload.data,
});
} else if (
message.action === "QORTAL_REQUEST_PERMISSION" &&
message?.isFromExtension
) {
qortalRequestPermissonFromExtension(message, event);
} else if(message?.action === 'SHOW_SAVE_FILE_PICKER'){
showSaveFilePicker(message?.payload)
} else if(message?.action === 'getFileFromIndexedDB'){
handleGetFileFromIndexedDB(event);
}
};
// Attach the event listener
@ -691,8 +731,6 @@ function App() {
};
}, []);
//param = isDecline
const confirmPayment = (isDecline: boolean) => {
// REMOVED FOR MOBILE APP
@ -700,7 +738,6 @@ function App() {
const confirmBuyOrder = (isDecline: boolean) => {
// REMOVED FOR MOBILE APP
};
const responseToConnectionRequest = (
isOkay: boolean,
@ -710,14 +747,14 @@ function App() {
// REMOVED FOR MOBILE APP
};
useEffect(() => {
try {
setIsLoading(true);
window.sendMessage("getWalletInfo")
window
.sendMessage("getWalletInfo")
.then((response) => {
console.log('getwalll', response)
console.log("getwalll", response);
if (response && response?.walletInfo) {
setRawWallet(response?.walletInfo);
if (
@ -748,7 +785,8 @@ function App() {
}, 10000);
});
}
window.sendMessage("userInfo")
window
.sendMessage("userInfo")
.then((response) => {
if (response && !response.error) {
setUserInfo(response);
@ -844,7 +882,8 @@ function App() {
crypto.kdfThreads,
() => {}
);
window.sendMessage("decryptWallet", {
window
.sendMessage("decryptWallet", {
password: walletToBeDownloadedPassword,
wallet,
})
@ -856,7 +895,8 @@ function App() {
qortAddress: wallet.address0,
});
window.sendMessage("userInfo")
window
.sendMessage("userInfo")
.then((response2) => {
setIsLoading(false);
if (response2 && !response2.error) {
@ -878,7 +918,6 @@ function App() {
setIsLoading(false);
console.error("Failed to decrypt wallet:", error);
});
} catch (error: any) {
setWalletToBeDownloadedError(error?.message);
setIsLoading(false);
@ -888,9 +927,13 @@ function App() {
const logoutFunc = async () => {
try {
if (hasSettingsChanged) {
await showUnsavedChanges({message: 'Your settings have changed. If you logout you will lose your changes. Click on the save button in the header to keep your changed settings.'})
await showUnsavedChanges({
message:
"Your settings have changed. If you logout you will lose your changes. Click on the save button in the header to keep your changed settings.",
});
}
window.sendMessage("logout", {})
window
.sendMessage("logout", {})
.then((response) => {
if (response) {
resetAllStates();
@ -898,9 +941,11 @@ function App() {
}
})
.catch((error) => {
console.error("Failed to log out:", error.message || "An error occurred");
console.error(
"Failed to log out:",
error.message || "An error occurred"
);
});
} catch (error) {}
};
@ -944,7 +989,7 @@ function App() {
setHasLocalNode(false);
setTxList([]);
setMemberGroups([]);
resetAllRecoil()
resetAllRecoil();
};
function roundUpToDecimals(number, decimals = 8) {
@ -961,18 +1006,20 @@ function App() {
res();
}, 250);
});
window.sendMessage("decryptWallet", {
window
.sendMessage("decryptWallet", {
password: authenticatePassword,
wallet: rawWallet,
})
.then((response) => {
console.log('response2', response)
console.log("response2", response);
if (response && !response.error) {
setAuthenticatePassword("");
setExtstate("authenticated");
setWalletToBeDecryptedError("");
window.sendMessage("userInfo")
window
.sendMessage("userInfo")
.then((response) => {
setIsLoading(false);
if (response && !response.error) {
@ -986,7 +1033,8 @@ function App() {
getBalanceFunc();
window.sendMessage("getWalletInfo")
window
.sendMessage("getWalletInfo")
.then((response) => {
if (response && response.walletInfo) {
setRawWallet(response.walletInfo);
@ -1004,7 +1052,6 @@ function App() {
setIsLoading(false);
console.error("Failed to decrypt wallet:", error);
});
} catch (error) {
setWalletToBeDecryptedError("Unable to authenticate. Wrong password");
}
@ -1054,13 +1101,13 @@ function App() {
const handleFocus = () => {
setIsFocused(true);
if (isMobile) {
window.sendMessage("clearAllNotifications", {})
.catch((error) => {
console.error("Failed to clear notifications:", error.message || "An error occurred");
window.sendMessage("clearAllNotifications", {}).catch((error) => {
console.error(
"Failed to clear notifications:",
error.message || "An error occurred"
);
});
}
};
// Handler for when the window loses focus
@ -1077,11 +1124,12 @@ function App() {
if (document.visibilityState === "visible") {
setIsFocused(true);
if (isMobile) {
window.sendMessage("clearAllNotifications", {})
.catch((error) => {
console.error("Failed to clear notifications:", error.message || "An error occurred");
window.sendMessage("clearAllNotifications", {}).catch((error) => {
console.error(
"Failed to clear notifications:",
error.message || "An error occurred"
);
});
}
} else {
setIsFocused(false);
@ -1123,7 +1171,8 @@ function App() {
});
setIsLoadingRegisterName(true);
new Promise((res, rej) => {
window.sendMessage("registerName", {
window
.sendMessage("registerName", {
name: registerNameValue,
})
.then((response) => {
@ -1132,7 +1181,8 @@ function App() {
setIsLoadingRegisterName(false);
setInfoSnack({
type: "success",
message: "Successfully registered. It may take a couple of minutes for the changes to propagate",
message:
"Successfully registered. It may take a couple of minutes for the changes to propagate",
});
setOpenRegisterName(false);
setRegisterNameValue("");
@ -1164,7 +1214,6 @@ function App() {
setOpenSnack(true);
rej(error);
});
});
} catch (error) {
if (error?.message) {
@ -1355,8 +1404,8 @@ function App() {
marginTop: "10px",
textDecoration: "underline",
}}
onClick={() => {
// TODO
onClick={async () => {
await Browser.open({ url: "https://www.qort.trade" });
}}
>
Get QORT at qort.trade
@ -1438,15 +1487,22 @@ function App() {
<AppContainer
sx={{
height: isMobile ? "100%" : "100vh",
backgroundImage: desktopViewMode === 'apps' && 'url("appsBg.svg")',
backgroundSize: desktopViewMode === 'apps' && 'cover',
backgroundPosition: desktopViewMode === 'apps' && 'center',
backgroundRepeat: desktopViewMode === 'apps' && 'no-repeat',
backgroundImage: desktopViewMode === "apps" && 'url("appsBg.svg")',
backgroundSize: desktopViewMode === "apps" && "cover",
backgroundPosition: desktopViewMode === "apps" && "center",
backgroundRepeat: desktopViewMode === "apps" && "no-repeat",
}}
>
{extState === "not-authenticated" && (
<NotAuthenticated getRootProps={getRootProps} getInputProps={getInputProps} setExtstate={setExtstate} apiKey={apiKey} globalApiKey={globalApiKey} setApiKey={setApiKey} handleSetGlobalApikey={handleSetGlobalApikey}/>
<NotAuthenticated
getRootProps={getRootProps}
getInputProps={getInputProps}
setExtstate={setExtstate}
apiKey={apiKey}
globalApiKey={globalApiKey}
setApiKey={setApiKey}
handleSetGlobalApikey={handleSetGlobalApikey}
/>
)}
{/* {extState !== "not-authenticated" && (
<button onClick={logoutFunc}>logout</button>
@ -1487,7 +1543,7 @@ function App() {
desktopViewMode={desktopViewMode}
setDesktopViewMode={setDesktopViewMode}
/>
{(!isMobile && desktopViewMode !== 'apps') && renderProfile()}
{!isMobile && desktopViewMode !== "apps" && renderProfile()}
</Box>
<Box
@ -1742,10 +1798,11 @@ function App() {
maxWidth: "90%",
}}
>
{'Fee: '}{messageQortalRequest?.fee}{' QORT'}
{"Fee: "}
{messageQortalRequest?.fee}
{" QORT"}
</TextP>
<Spacer height="15px" />
</>
)}
{messageQortalRequest?.checkbox1 && (
@ -2524,23 +2581,25 @@ function App() {
colors={["#004777", "#F7B801", "#A30000", "#A30000"]}
colorsTime={[7, 5, 2, 0]}
onComplete={() => {
onCancelQortalRequestExtension()
onCancelQortalRequestExtension();
}}
size={50}
strokeWidth={5}
>
{({ remainingTime }) => <TextP>{remainingTime}</TextP>}
</CountdownCircleTimer>
<Box sx={{
display: 'flex',
padding: '20px',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'flex-start',
minHeight: '400px',
maxHeight: '90vh',
overflow: 'auto'
}}>
<Box
sx={{
display: "flex",
padding: "20px",
flexDirection: "column",
alignItems: "center",
justifyContent: "flex-start",
minHeight: "400px",
maxHeight: "90vh",
overflow: "auto",
}}
>
<Box
sx={{
display: "flex",
@ -2626,7 +2685,9 @@ function App() {
{messageQortalRequestExtension?.html && (
<div
dangerouslySetInnerHTML={{ __html: messageQortalRequestExtension?.html }}
dangerouslySetInnerHTML={{
__html: messageQortalRequestExtension?.html,
}}
/>
)}
<Spacer height="15px" />
@ -2656,10 +2717,11 @@ function App() {
maxWidth: "90%",
}}
>
{'Fee: '}{messageQortalRequestExtension?.fee}{' QORT'}
{"Fee: "}
{messageQortalRequestExtension?.fee}
{" QORT"}
</TextP>
<Spacer height="15px" />
</>
)}
{messageQortalRequestExtension?.checkbox1 && (
@ -2680,7 +2742,9 @@ function App() {
edge="start"
tabIndex={-1}
disableRipple
defaultChecked={messageQortalRequestExtension?.checkbox1?.value}
defaultChecked={
messageQortalRequestExtension?.checkbox1?.value
}
sx={{
"&.Mui-checked": {
color: "white", // Customize the color when checked

View File

@ -1,6 +1,6 @@
// @ts-nocheck
// TODO
// import "./qortalRequests";
import "./qortalRequests";
import { isArray } from "lodash";
import {
decryptGroupEncryption,
@ -2878,7 +2878,6 @@ async function getChatHeadsDirect() {
throw new Error("No Chatheads saved");
}
}
// TODO: listener
function setupMessageListener() {
window.addEventListener("message", async (event) => {

View File

@ -3,6 +3,8 @@ import FileSaver from 'file-saver';
import { executeEvent } from '../../utils/events';
import { useSetRecoilState } from 'recoil';
import { navigationControllerAtom } from '../../atoms/global';
class Semaphore {
constructor(count) {
this.count = count
@ -58,7 +60,7 @@ const fileToBase64 = (file) => new Promise(async (resolve, reject) => {
}
})
function openIndexedDB() {
export function openIndexedDB() {
return new Promise((resolve, reject) => {
const request = indexedDB.open("fileStorageDB", 1);
@ -79,58 +81,7 @@ function openIndexedDB() {
});
}
async function handleGetFileFromIndexedDB(fileId, sendResponse) {
try {
const db = await openIndexedDB();
const transaction = db.transaction(["files"], "readonly");
const objectStore = transaction.objectStore("files");
const getRequest = objectStore.get(fileId);
getRequest.onsuccess = async function (event) {
if (getRequest.result) {
const file = getRequest.result.data;
try {
const base64String = await fileToBase64(file);
// Create a new transaction to delete the file
const deleteTransaction = db.transaction(["files"], "readwrite");
const deleteObjectStore = deleteTransaction.objectStore("files");
const deleteRequest = deleteObjectStore.delete(fileId);
deleteRequest.onsuccess = function () {
try {
sendResponse({ result: base64String });
} catch (error) {
console.log('error', error)
}
};
deleteRequest.onerror = function () {
console.error(`Error deleting file with ID ${fileId} from IndexedDB`);
sendResponse({ result: null, error: "Failed to delete file from IndexedDB" });
};
} catch (error) {
console.error("Error converting file to Base64:", error);
sendResponse({ result: null, error: "Failed to convert file to Base64" });
}
} else {
console.error(`File with ID ${fileId} not found in IndexedDB`);
sendResponse({ result: null, error: "File not found in IndexedDB" });
}
};
getRequest.onerror = function () {
console.error(`Error retrieving file with ID ${fileId} from IndexedDB`);
sendResponse({ result: null, error: "Error retrieving file from IndexedDB" });
};
} catch (error) {
console.error("Error opening IndexedDB:", error);
sendResponse({ result: null, error: "Error opening IndexedDB" });
}
}
const UIQortalRequests = [
'GET_USER_ACCOUNT', 'DECRYPT_DATA', 'SEND_COIN', 'GET_LIST_ITEMS',
@ -215,7 +166,7 @@ const UIQortalRequests = [
}
}
const showSaveFilePicker = async (data) => {
export const showSaveFilePicker = async (data) => {
let blob
let fileName
try {
@ -368,7 +319,7 @@ isDOMContentLoaded: false
if (event?.data?.requestedHandler !== 'UI') return;
const sendMessageToRuntime = (message, eventPort) => {
window.sendMessage(message.action, message, 60000, message.isFromExtension)
window.sendMessage(message.action, message.payload, 60000, message.isExtension)
.then((response) => {
if (response.error) {
eventPort.postMessage({
@ -402,6 +353,7 @@ isDOMContentLoaded: false
) {
let data;
try {
console.log('storeFilesInIndexedDB', structuredClone(event.data))
data = await storeFilesInIndexedDB(event.data);
} catch (error) {
console.error('Error storing files in IndexedDB:', error);
@ -458,6 +410,8 @@ isDOMContentLoaded: false
} }, '*'
);
}
};
// Add the listener for messages coming from the frameWindow
@ -471,17 +425,7 @@ isDOMContentLoaded: false
}, []); // Empty dependency array to run once when the component mounts
// TODO
// chrome.runtime?.onMessage.addListener( function (message, sender, sendResponse) {
// if(message.action === "SHOW_SAVE_FILE_PICKER"){
// showSaveFilePicker(message?.data)
// }
// else if (message.action === "getFileFromIndexedDB") {
// handleGetFileFromIndexedDB(message.fileId, sendResponse);
// return true; // Keep the message channel open for async response
// }
// });
return {path, history, resetHistory, changeCurrentIndex}
};

View File

@ -1,6 +1,7 @@
import React, { useEffect } from 'react';
import DOMPurify from 'dompurify';
import './styles.css'; // Ensure this CSS file is imported
import { Browser } from '@capacitor/browser';
export const MessageDisplay = ({ htmlContent , isReply}) => {
@ -28,25 +29,15 @@ export const MessageDisplay = ({ htmlContent , isReply}) => {
});
// Function to handle link clicks
const handleClick = (e) => {
const handleClick = async (e) => {
e.preventDefault();
// Ensure we are targeting an <a> element
const target = e.target.closest('a');
if (target) {
const href = target.getAttribute('href');
// TODO
// if (chrome && chrome.tabs) {
// chrome.tabs.create({ url: href }, (tab) => {
// if (chrome.runtime.lastError) {
// console.error('Error opening tab:', chrome.runtime.lastError);
// } else {
// console.log('Tab opened successfully:', tab);
// }
// });
// } else {
// console.error('chrome.tabs API is not available.');
// }
await Browser.open({ url: href });
} else {
console.error('No <a> tag found or href is null.');
}

View File

@ -9,6 +9,7 @@ import { Home, Groups, Message, ShowChart } from "@mui/icons-material";
import Box from "@mui/material/Box";
import BottomLogo from "../../assets/svgs/BottomLogo5.svg";
import LogoSelected from "../../assets/svgs/LogoSelected.svg";
import { Browser } from '@capacitor/browser';
import { CustomSvg } from "../../common/CustomSvg";
import { WalletIcon } from "../../assets/Icons/WalletIcon";
@ -183,10 +184,10 @@ export const MobileFooter = ({
}}
/>
<BottomNavigationAction
onClick={() => {
// TODO
// chrome.tabs.create({ url: "https://www.qort.trade"});
onClick={async () => {
await Browser.open({ url: 'https://www.qort.trade' });
}}
icon={
<IconWrapper label="Trading" color="rgba(250, 250, 250, 0.5)">
<TradingIcon color="rgba(250, 250, 250, 0.5)" />

View File

@ -24,13 +24,13 @@ window.addEventListener("message", (event) => {
}
});
export const sendMessageBackground = (action, data = {}, timeout = 60000, isFromExtension) => {
export const sendMessageBackground = (action, data = {}, timeout = 60000, isExtension) => {
return new Promise((resolve, reject) => {
const requestId = generateRequestId(); // Unique ID for each request
callbackMap.set(requestId, { resolve, reject }); // Store both resolve and reject callbacks
// Send the message with `backgroundMessage` type
window.postMessage({ type: "backgroundMessage", action, requestId, payload: data, isFromExtension }, "*");
window.postMessage({ type: "backgroundMessage", action, requestId, payload: data, isExtension }, "*");
// Set up a timeout to automatically reject if no response is received
const timeoutId = setTimeout(() => {

View File

@ -1,5 +1,5 @@
import { addForeignServer, addListItems, createPoll, decryptData, deleteListItems, deployAt, encryptData, getCrossChainServerInfo, getDaySummary, getForeignFee, getListItems, getServerConnectionHistory, getTxActivitySummary, getUserAccount, getUserWallet, getUserWalletInfo, getWalletBalance, joinGroup, publishMultipleQDNResources, publishQDNResource, removeForeignServer, saveFile, sendChatMessage, sendCoin, setCurrentForeignServer, updateForeignFee, voteOnPoll } from "./qortalRequests/get";
import { storeData } from "./utils/chromeStorage";
import { getData, storeData } from "./utils/chromeStorage";
@ -28,7 +28,7 @@ function setLocalStorage(key, data) {
qortalRequestPermissions[key] = value;
// Save the updated object back to storage
await setLocalStorage({ qortalRequestPermissions });
await setLocalStorage('qortalRequestPermissions', qortalRequestPermissions );
console.log('Permission set for', key);
} catch (error) {
@ -53,7 +53,7 @@ function setLocalStorage(key, data) {
// TODO: GET_FRIENDS_LIST
// NOT SURE IF TO IMPLEMENT: LINK_TO_QDN_RESOURCE, QDN_RESOURCE_DISPLAYED, SET_TAB_NOTIFICATIONS
function setupMessageListener() {
function setupMessageListenerQortalRequest() {
window.addEventListener("message", async (event) => {
const request = event.data;
@ -87,6 +87,7 @@ function setLocalStorage(key, data) {
case "ENCRYPT_DATA": {
try {
console.log('ENCRYPTDATA', request)
const res = await encryptData(request.payload, event.source);
event.source.postMessage({
requestId: request.requestId,
@ -98,7 +99,7 @@ function setLocalStorage(key, data) {
event.source.postMessage({
requestId: request.requestId,
action: request.action,
error: error.message,
error: error?.message,
type: "backgroundMessageResponse",
}, event.origin);
}
@ -368,6 +369,7 @@ function setLocalStorage(key, data) {
case "GET_WALLET_BALANCE": {
try {
const res = await getWalletBalance(request.payload, false, isFromExtension);
console.log('ressss', res)
event.source.postMessage({
requestId: request.requestId,
action: request.action,
@ -612,5 +614,5 @@ function setLocalStorage(key, data) {
}
// Initialize the message listener
setupMessageListener();
setupMessageListenerQortalRequest();

View File

@ -180,174 +180,101 @@ const _voteOnPoll = async ({pollName, optionIndex, optionName}, isFromExtension)
}
};
function getFileFromContentScript(fileId, sender) {
// Map to store resolvers and rejectors by requestId
const fileRequestResolvers = new Map();
const handleFileMessage = (event) => {
const { action, requestId, result, error } = event.data;
if (action === "getFileFromIndexedDBResponse" && fileRequestResolvers.has(requestId)) {
const { resolve, reject } = fileRequestResolvers.get(requestId);
fileRequestResolvers.delete(requestId); // Clean up after resolving
if (result) {
resolve(result);
} else {
reject(error || "Failed to retrieve file");
}
}
};
window.addEventListener("message", handleFileMessage);
function getFileFromContentScript(fileId) {
console.log('handleGetFileFromIndexedDB', fileId)
return new Promise((resolve, reject) => {
chrome.tabs.sendMessage(
sender.tab.id,
{ action: "getFileFromIndexedDB", fileId: fileId },
(response) => {
if (response && response.result) {
resolve(response.result);
} else {
reject(response?.error || "Failed to retrieve file");
}
}
const requestId = `getFile_${fileId}_${Date.now()}`;
console.log('handleGetFileFromIndexedDB', requestId)
fileRequestResolvers.set(requestId, { resolve, reject }); // Store resolvers by requestId
console.log('handleGetFileFromIndexedDB', 'passed')
// Send the request message
window.postMessage(
{ action: "getFileFromIndexedDB", fileId, requestId },
"*"
);
});
}
function sendToSaveFilePicker(data, sender) {
console.log('handleGetFileFromIndexedDB', 'after', window.origin)
chrome.tabs.sendMessage(sender.tab.id, {
action: "SHOW_SAVE_FILE_PICKER",
data,
});
}
async function responseFromExtension() {
return new Promise((resolve) => {
// Send message to the content script to check focus
chrome.runtime.sendMessage({ action: "QORTAL_REQUEST_PERMISSION", payloa }, (response) => {
if (chrome.runtime.lastError) {
resolve(false); // Error occurred, assume not focused
} else {
resolve(response); // Resolve based on the response
}
});
});
}
async function getUserPermission(payload: any, isFromExtension?: boolean) {
function waitForWindowReady(windowId) {
return new Promise((resolve) => {
const checkInterval = setInterval(() => {
chrome.windows.get(windowId, (win) => {
if (chrome.runtime.lastError) {
clearInterval(checkInterval); // Stop polling if there's an error
resolve(false);
} else if (win.state === "normal" || win.state === "maximized") {
clearInterval(checkInterval); // Window is ready
resolve(true);
}
});
}, 100); // Check every 100ms
});
}
if(isFromExtension){
return new Promise((resolve) => {
// Set a timeout for 1 second
const timeout = setTimeout(() => {
resolve(false);
}, 30000);
// Send message to the content script to check focus
chrome.runtime.sendMessage(
{ action: "QORTAL_REQUEST_PERMISSION", payload, isFromExtension },
(response) => {
if (response === undefined) return;
clearTimeout(timeout); // Clear the timeout if we get a response
if (chrome.runtime.lastError) {
resolve(false); // Error occurred, assume not focused
} else {
resolve(response); // Resolve based on the response
}
}
);
});
}
await new Promise((res) => {
const popupUrl = chrome.runtime.getURL("index.html?secondary=true");
chrome.windows.getAll(
{ populate: true, windowTypes: ["popup"] },
(windows) => {
// Attempt to find an existing popup window that has a tab with the correct URL
const existingPopup = windows.find(
(w) =>
w.tabs &&
w.tabs.some((tab) => tab.url && tab.url.startsWith(popupUrl))
);
if (existingPopup) {
// If the popup exists but is minimized or not focused, focus it
chrome.windows.update(existingPopup.id, {
focused: true,
state: "normal",
});
res(null);
} else {
// No existing popup found, create a new one
chrome.system.display.getInfo((displays) => {
// Assuming the primary display is the first one (adjust logic as needed)
const primaryDisplay = displays[0];
const screenWidth = primaryDisplay.bounds.width;
const windowHeight = 500; // Your window height
const windowWidth = 400; // Your window width
// Calculate left position for the window to appear on the right of the screen
const leftPosition = screenWidth - windowWidth;
// Calculate top position for the window, adjust as desired
const topPosition =
(primaryDisplay.bounds.height - windowHeight) / 2;
chrome.windows.create(
{
url: popupUrl,
type: "popup",
width: windowWidth,
height: windowHeight,
left: leftPosition,
top: 0,
},
async (newWindow) => {
removeDuplicateWindow(popupUrl);
await waitForWindowReady(newWindow.id);
res(null);
}
);
});
}
}
);
});
await new Promise((res) => {
// Timeout to handle no response scenario
setTimeout(() => {
chrome.runtime.sendMessage({
action: "SET_COUNTDOWN",
payload: 30,
});
res(true);
}, 1000);
if (fileRequestResolvers.has(requestId)) {
fileRequestResolvers.get(requestId).reject("Request timed out");
fileRequestResolvers.delete(requestId); // Clean up on timeout
}
}, 10000); // 10-second timeout
});
}
function sendToSaveFilePicker(data) {
window.postMessage({
action: "SHOW_SAVE_FILE_PICKER",
payload: data,
}, "*");
}
const responseResolvers = new Map();
const handleMessage = (event) => {
const { action, requestId, result } = event.data;
console.log("Received message:", event);
// Check if this is the expected response action and if we have a stored resolver
if (action === "QORTAL_REQUEST_PERMISSION_RESPONSE" && responseResolvers.has(requestId)) {
// Resolve the stored promise with the result
responseResolvers.get(requestId)(result || false);
responseResolvers.delete(requestId); // Clean up after resolving
}
};
window.addEventListener("message", handleMessage);
async function getUserPermission(payload, isFromExtension) {
return new Promise((resolve) => {
// Set a timeout for 1 second
const timeout = setTimeout(() => {
resolve(false);
}, 30000);
const requestId = `qortalRequest_${Date.now()}`;
responseResolvers.set(requestId, resolve); // Store resolver by requestId
// Send message to the content script to check focus
chrome.runtime.sendMessage(
{ action: "QORTAL_REQUEST_PERMISSION", payload },
(response) => {
if (response === undefined) return;
clearTimeout(timeout); // Clear the timeout if we get a response
if (chrome.runtime.lastError) {
resolve(false); // Error occurred, assume not focused
} else {
resolve(response); // Resolve based on the response
}
}
// Send the request message
window.postMessage(
{ action: "QORTAL_REQUEST_PERMISSION", payload, requestId, isFromExtension },
"*"
);
// Optional timeout to handle no response scenario
setTimeout(() => {
if (responseResolvers.has(requestId)) {
responseResolvers.get(requestId)(false); // Resolve with `false` if no response
responseResolvers.delete(requestId);
}
}, 30000); // 30-second timeout
});
}
export const getUserAccount = async () => {
try {
const wallet = await getSaveWallet();
@ -366,7 +293,7 @@ export const encryptData = async (data, sender) => {
let data64 = data.data64;
let publicKeys = data.publicKeys || [];
if (data.fileId) {
data64 = await getFileFromContentScript(data.fileId, sender);
data64 = await getFileFromContentScript(data.fileId);
}
if (!data64) {
throw new Error("Please include data to encrypt");
@ -633,7 +560,7 @@ export const publishQDNResource = async (data: any, sender, isFromExtension) =>
throw new Error("Only encrypted data can go into private services");
}
if (data.fileId) {
data64 = await getFileFromContentScript(data.fileId, sender);
data64 = await getFileFromContentScript(data.fileId);
}
if (data.encrypt) {
try {
@ -669,7 +596,7 @@ export const publishQDNResource = async (data: any, sender, isFromExtension) =>
const { accepted } = resPermission;
if (accepted) {
if (data.fileId && !data.encrypt) {
data64 = await getFileFromContentScript(data.fileId, sender);
data64 = await getFileFromContentScript(data.fileId);
}
try {
const resPublish = await publishData({
@ -853,7 +780,7 @@ export const publishMultipleQDNResources = async (data: any, sender, isFromExten
continue;
}
if (resource.fileId) {
data64 = await getFileFromContentScript(resource.fileId, sender);
data64 = await getFileFromContentScript(resource.fileId);
}
if (data.encrypt) {
try {
@ -1108,7 +1035,8 @@ export const sendChatMessage = async (data, isFromExtension) => {
isEncrypted: 1,
isText: 1,
});
const path = chrome.runtime.getURL("memory-pow.wasm.full");
const path = `${import.meta.env.BASE_URL}memory-pow.wasm.full`;
const { nonce, chatBytesArray } = await computePow({
chatBytes: tx.chatBytes,
@ -1154,7 +1082,8 @@ export const sendChatMessage = async (data, isFromExtension) => {
// if (!hasEnoughBalance) {
// throw new Error("Must have at least 4 QORT to send a chat message");
// }
const path = chrome.runtime.getURL("memory-pow.wasm.full");
const path = `${import.meta.env.BASE_URL}memory-pow.wasm.full`;
const { nonce, chatBytesArray } = await computePow({
chatBytes: tx.chatBytes,
@ -1277,8 +1206,7 @@ export const saveFile = async (data, sender, isFromExtension) => {
blob,
fileId,
fileHandleOptions,
},
sender
}
);
return true;
} else {

83
src/utils/indexedDB.ts Normal file
View File

@ -0,0 +1,83 @@
export async function handleGetFileFromIndexedDB(event) {
try {
const { fileId, requestId } = event.data;
const db = await openIndexedDB();
const transaction = db.transaction(["files"], "readonly");
const objectStore = transaction.objectStore("files");
const getRequest = objectStore.get(fileId);
getRequest.onsuccess = async function (event) {
if (getRequest.result) {
const file = getRequest.result.data;
try {
const base64String = await fileToBase64(file);
// Create a new transaction to delete the file
const deleteTransaction = db.transaction(["files"], "readwrite");
const deleteObjectStore = deleteTransaction.objectStore("files");
const deleteRequest = deleteObjectStore.delete(fileId);
deleteRequest.onsuccess = function () {
try {
window.postMessage(
{ action: "getFileFromIndexedDBResponse", requestId, result: base64String },
"*"
);
} catch (error) {
console.log('error', error)
}
};
deleteRequest.onerror = function () {
console.error(`Error deleting file with ID ${fileId} from IndexedDB`);
};
} catch (error) {
console.error("Error converting file to Base64:", error);
event.ports[0].postMessage({
result: null,
error: "Failed to convert file to Base64",
});
window.postMessage(
{ action: "getFileFromIndexedDBResponse", requestId, result: null,
error: "Failed to convert file to Base64"
},
"*"
);
}
} else {
console.error(`File with ID ${fileId} not found in IndexedDB`);
window.postMessage(
{ action: "getFileFromIndexedDBResponse", requestId, result: null,
error: 'File not found in IndexedDB'
},
"*"
);
}
};
getRequest.onerror = function () {
console.error(`Error retrieving file with ID ${fileId} from IndexedDB`);
event.source.postMessage(
{ action: "getFileFromIndexedDBResponse", requestId, result: null,
error: 'Error retrieving file from IndexedDB'
},
event.origin
);
};
} catch (error) {
const { requestId } = event.data;
console.error("Error opening IndexedDB:", error);
event.source.postMessage(
{ action: "getFileFromIndexedDBResponse", requestId, result: null,
error: 'Error opening IndexedDB'
},
event.origin
);
}
}